Archive: Namaste PHP AMQP framework v1.0 (2017-2020)
952 days continuous production uptime, 40k+ tp/s single node. Original corpo Bitbucket history not included — clean archive commit.
This commit is contained in:
985
html/sass/mdb/free/data/_colors.scss
Executable file
985
html/sass/mdb/free/data/_colors.scss
Executable file
@@ -0,0 +1,985 @@
|
||||
// COLORS
|
||||
|
||||
$mdb-color: (
|
||||
"lighten-5": #D0D6E2,
|
||||
"lighten-4": #B1BACE,
|
||||
"lighten-3": #929FBA,
|
||||
"lighten-2": #7283A7,
|
||||
"lighten-1": #59698D,
|
||||
"base": #45526E,
|
||||
"darken-1": #3B465E,
|
||||
"darken-2": #2E3951,
|
||||
"darken-3": #1C2A48,
|
||||
"darken-4": #1C2331,
|
||||
);
|
||||
|
||||
$red: (
|
||||
"lighten-5": #FFEBEE,
|
||||
"lighten-4": #FFCDD2,
|
||||
"lighten-3": #EF9A9A,
|
||||
"lighten-2": #E57373,
|
||||
"lighten-1": #EF5350,
|
||||
"base": #F44336,
|
||||
"darken-1": #E53935,
|
||||
"darken-2": #D32F2F,
|
||||
"darken-3": #C62828,
|
||||
"darken-4": #B71C1C,
|
||||
"accent-1": #FF8A80,
|
||||
"accent-2": #FF5252,
|
||||
"accent-3": #FF1744,
|
||||
"accent-4": #D50000
|
||||
);
|
||||
|
||||
$pink: (
|
||||
"lighten-5": #fce4ec,
|
||||
"lighten-4": #f8bbd0,
|
||||
"lighten-3": #f48fb1,
|
||||
"lighten-2": #f06292,
|
||||
"lighten-1": #ec407a,
|
||||
"base": #e91e63,
|
||||
"darken-1": #d81b60,
|
||||
"darken-2": #c2185b,
|
||||
"darken-3": #ad1457,
|
||||
"darken-4": #880e4f,
|
||||
"accent-1": #ff80ab,
|
||||
"accent-2": #ff4081,
|
||||
"accent-3": #f50057,
|
||||
"accent-4": #c51162
|
||||
);
|
||||
|
||||
$purple: (
|
||||
"lighten-5": #f3e5f5,
|
||||
"lighten-4": #e1bee7,
|
||||
"lighten-3": #ce93d8,
|
||||
"lighten-2": #ba68c8,
|
||||
"lighten-1": #ab47bc,
|
||||
"base": #9c27b0,
|
||||
"darken-1": #8e24aa,
|
||||
"darken-2": #7b1fa2,
|
||||
"darken-3": #6a1b9a,
|
||||
"darken-4": #4a148c,
|
||||
"accent-1": #ea80fc,
|
||||
"accent-2": #e040fb,
|
||||
"accent-3": #d500f9,
|
||||
"accent-4": #aa00ff
|
||||
);
|
||||
|
||||
$deep-purple: (
|
||||
"lighten-5": #ede7f6,
|
||||
"lighten-4": #d1c4e9,
|
||||
"lighten-3": #b39ddb,
|
||||
"lighten-2": #9575cd,
|
||||
"lighten-1": #7e57c2,
|
||||
"base": #673ab7,
|
||||
"darken-1": #5e35b1,
|
||||
"darken-2": #512da8,
|
||||
"darken-3": #4527a0,
|
||||
"darken-4": #311b92,
|
||||
"accent-1": #b388ff,
|
||||
"accent-2": #7c4dff,
|
||||
"accent-3": #651fff,
|
||||
"accent-4": #6200ea
|
||||
);
|
||||
|
||||
$indigo: (
|
||||
"lighten-5": #e8eaf6,
|
||||
"lighten-4": #c5cae9,
|
||||
"lighten-3": #9fa8da,
|
||||
"lighten-2": #7986cb,
|
||||
"lighten-1": #5c6bc0,
|
||||
"base": #3f51b5,
|
||||
"darken-1": #3949ab,
|
||||
"darken-2": #303f9f,
|
||||
"darken-3": #283593,
|
||||
"darken-4": #1a237e,
|
||||
"accent-1": #8c9eff,
|
||||
"accent-2": #536dfe,
|
||||
"accent-3": #3d5afe,
|
||||
"accent-4": #304ffe
|
||||
);
|
||||
|
||||
$blue: (
|
||||
"lighten-5": #E3F2FD,
|
||||
"lighten-4": #BBDEFB,
|
||||
"lighten-3": #90CAF9,
|
||||
"lighten-2": #64B5F6,
|
||||
"lighten-1": #42A5F5,
|
||||
"base": #2196F3,
|
||||
"darken-1": #1E88E5,
|
||||
"darken-2": #1976D2,
|
||||
"darken-3": #1565C0,
|
||||
"darken-4": #0D47A1,
|
||||
"accent-1": #82B1FF,
|
||||
"accent-2": #448AFF,
|
||||
"accent-3": #2979FF,
|
||||
"accent-4": #2962FF
|
||||
);
|
||||
|
||||
$light-blue: (
|
||||
"lighten-5": #e1f5fe,
|
||||
"lighten-4": #b3e5fc,
|
||||
"lighten-3": #81d4fa,
|
||||
"lighten-2": #4fc3f7,
|
||||
"lighten-1": #29b6f6,
|
||||
"base": #03a9f4,
|
||||
"darken-1": #039be5,
|
||||
"darken-2": #0288d1,
|
||||
"darken-3": #0277bd,
|
||||
"darken-4": #01579b,
|
||||
"accent-1": #80d8ff,
|
||||
"accent-2": #40c4ff,
|
||||
"accent-3": #00b0ff,
|
||||
"accent-4": #0091ea
|
||||
);
|
||||
|
||||
$cyan: (
|
||||
"lighten-5": #e0f7fa,
|
||||
"lighten-4": #b2ebf2,
|
||||
"lighten-3": #80deea,
|
||||
"lighten-2": #4dd0e1,
|
||||
"lighten-1": #26c6da,
|
||||
"base": #00bcd4,
|
||||
"darken-1": #00acc1,
|
||||
"darken-2": #0097a7,
|
||||
"darken-3": #00838f,
|
||||
"darken-4": #006064,
|
||||
"accent-1": #84ffff,
|
||||
"accent-2": #18ffff,
|
||||
"accent-3": #00e5ff,
|
||||
"accent-4": #00b8d4
|
||||
);
|
||||
|
||||
$teal: (
|
||||
"lighten-5": #e0f2f1,
|
||||
"lighten-4": #b2dfdb,
|
||||
"lighten-3": #80cbc4,
|
||||
"lighten-2": #4db6ac,
|
||||
"lighten-1": #26a69a,
|
||||
"base": #009688,
|
||||
"darken-1": #00897b,
|
||||
"darken-2": #00796b,
|
||||
"darken-3": #00695c,
|
||||
"darken-4": #004d40,
|
||||
"accent-1": #a7ffeb,
|
||||
"accent-2": #64ffda,
|
||||
"accent-3": #1de9b6,
|
||||
"accent-4": #00bfa5
|
||||
);
|
||||
|
||||
$green: (
|
||||
"lighten-5": #E8F5E9,
|
||||
"lighten-4": #C8E6C9,
|
||||
"lighten-3": #A5D6A7,
|
||||
"lighten-2": #81C784,
|
||||
"lighten-1": #66BB6A,
|
||||
"base": #4CAF50,
|
||||
"darken-1": #43A047,
|
||||
"darken-2": #388E3C,
|
||||
"darken-3": #2E7D32,
|
||||
"darken-4": #1B5E20,
|
||||
"accent-1": #B9F6CA,
|
||||
"accent-2": #69F0AE,
|
||||
"accent-3": #00E676,
|
||||
"accent-4": #00C853
|
||||
);
|
||||
|
||||
$light-green: (
|
||||
"lighten-5": #f1f8e9,
|
||||
"lighten-4": #dcedc8,
|
||||
"lighten-3": #c5e1a5,
|
||||
"lighten-2": #aed581,
|
||||
"lighten-1": #9ccc65,
|
||||
"base": #8bc34a,
|
||||
"darken-1": #7cb342,
|
||||
"darken-2": #689f38,
|
||||
"darken-3": #558b2f,
|
||||
"darken-4": #33691e,
|
||||
"accent-1": #ccff90,
|
||||
"accent-2": #b2ff59,
|
||||
"accent-3": #76ff03,
|
||||
"accent-4": #64dd17
|
||||
);
|
||||
|
||||
$lime: (
|
||||
"lighten-5": #f9fbe7,
|
||||
"lighten-4": #f0f4c3,
|
||||
"lighten-3": #e6ee9c,
|
||||
"lighten-2": #dce775,
|
||||
"lighten-1": #d4e157,
|
||||
"base": #cddc39,
|
||||
"darken-1": #c0ca33,
|
||||
"darken-2": #afb42b,
|
||||
"darken-3": #9e9d24,
|
||||
"darken-4": #827717,
|
||||
"accent-1": #f4ff81,
|
||||
"accent-2": #eeff41,
|
||||
"accent-3": #c6ff00,
|
||||
"accent-4": #aeea00
|
||||
);
|
||||
|
||||
$yellow: (
|
||||
"lighten-5": #fffde7,
|
||||
"lighten-4": #fff9c4,
|
||||
"lighten-3": #fff59d,
|
||||
"lighten-2": #fff176,
|
||||
"lighten-1": #ffee58,
|
||||
"base": #ffeb3b,
|
||||
"darken-1": #fdd835,
|
||||
"darken-2": #fbc02d,
|
||||
"darken-3": #f9a825,
|
||||
"darken-4": #f57f17,
|
||||
"accent-1": #ffff8d,
|
||||
"accent-2": #ffff00,
|
||||
"accent-3": #ffea00,
|
||||
"accent-4": #ffd600
|
||||
);
|
||||
|
||||
$amber: (
|
||||
"lighten-5": #fff8e1,
|
||||
"lighten-4": #ffecb3,
|
||||
"lighten-3": #ffe082,
|
||||
"lighten-2": #ffd54f,
|
||||
"lighten-1": #ffca28,
|
||||
"base": #ffc107,
|
||||
"darken-1": #ffb300,
|
||||
"darken-2": #ffa000,
|
||||
"darken-3": #ff8f00,
|
||||
"darken-4": #ff6f00,
|
||||
"accent-1": #ffe57f,
|
||||
"accent-2": #ffd740,
|
||||
"accent-3": #ffc400,
|
||||
"accent-4": #ffab00
|
||||
);
|
||||
|
||||
$orange: (
|
||||
"lighten-5": #fff3e0,
|
||||
"lighten-4": #ffe0b2,
|
||||
"lighten-3": #ffcc80,
|
||||
"lighten-2": #ffb74d,
|
||||
"lighten-1": #ffa726,
|
||||
"base": #ff9800,
|
||||
"darken-1": #fb8c00,
|
||||
"darken-2": #f57c00,
|
||||
"darken-3": #ef6c00,
|
||||
"darken-4": #e65100,
|
||||
"accent-1": #ffd180,
|
||||
"accent-2": #ffab40,
|
||||
"accent-3": #ff9100,
|
||||
"accent-4": #ff6d00
|
||||
);
|
||||
|
||||
$deep-orange: (
|
||||
"lighten-5": #fbe9e7,
|
||||
"lighten-4": #ffccbc,
|
||||
"lighten-3": #ffab91,
|
||||
"lighten-2": #ff8a65,
|
||||
"lighten-1": #ff7043,
|
||||
"base": #ff5722,
|
||||
"darken-1": #f4511e,
|
||||
"darken-2": #e64a19,
|
||||
"darken-3": #d84315,
|
||||
"darken-4": #bf360c,
|
||||
"accent-1": #ff9e80,
|
||||
"accent-2": #ff6e40,
|
||||
"accent-3": #ff3d00,
|
||||
"accent-4": #dd2c00
|
||||
);
|
||||
|
||||
$brown: (
|
||||
"lighten-5": #efebe9,
|
||||
"lighten-4": #d7ccc8,
|
||||
"lighten-3": #bcaaa4,
|
||||
"lighten-2": #a1887f,
|
||||
"lighten-1": #8d6e63,
|
||||
"base": #795548,
|
||||
"darken-1": #6d4c41,
|
||||
"darken-2": #5d4037,
|
||||
"darken-3": #4e342e,
|
||||
"darken-4": #3e2723
|
||||
);
|
||||
|
||||
$blue-grey: (
|
||||
"lighten-5": #eceff1,
|
||||
"lighten-4": #cfd8dc,
|
||||
"lighten-3": #b0bec5,
|
||||
"lighten-2": #90a4ae,
|
||||
"lighten-1": #78909c,
|
||||
"base": #607d8b,
|
||||
"darken-1": #546e7a,
|
||||
"darken-2": #455a64,
|
||||
"darken-3": #37474f,
|
||||
"darken-4": #263238
|
||||
);
|
||||
|
||||
$grey: (
|
||||
"lighten-5": #fafafa,
|
||||
"lighten-4": #f5f5f5,
|
||||
"lighten-3": #eeeeee,
|
||||
"lighten-2": #e0e0e0,
|
||||
"lighten-1": #bdbdbd,
|
||||
"base": #9e9e9e,
|
||||
"darken-1": #757575,
|
||||
"darken-2": #616161,
|
||||
"darken-3": #424242,
|
||||
"darken-4": #212121
|
||||
);
|
||||
|
||||
$shades: (
|
||||
"black": #000000,
|
||||
"white": #FFFFFF,
|
||||
"transparent": transparent
|
||||
);
|
||||
|
||||
$colors: (
|
||||
"mdb-color": $mdb-color,
|
||||
"red": $red,
|
||||
"pink": $pink,
|
||||
"purple": $purple,
|
||||
"deep-purple": $deep-purple,
|
||||
"indigo": $indigo,
|
||||
"blue": $blue,
|
||||
"light-blue": $light-blue,
|
||||
"cyan": $cyan,
|
||||
"teal": $teal,
|
||||
"green": $green,
|
||||
"light-green": $light-green,
|
||||
"lime": $lime,
|
||||
"yellow": $yellow,
|
||||
"amber": $amber,
|
||||
"orange": $orange,
|
||||
"deep-orange": $deep-orange,
|
||||
"brown": $brown,
|
||||
"blue-grey": $blue-grey,
|
||||
"grey": $grey,
|
||||
"shades": $shades
|
||||
);
|
||||
|
||||
// Color Classes
|
||||
$enable_full_palette: true;
|
||||
|
||||
@if $enable_full_palette == true {
|
||||
@each $color_name,
|
||||
$color in $colors {
|
||||
@each $color_type,
|
||||
$color_value in $color {
|
||||
@if $color_type=="base" {
|
||||
.#{$color_name} {
|
||||
background-color: $color_value !important;
|
||||
}
|
||||
.#{$color_name}-text {
|
||||
color: $color_value !important;
|
||||
}
|
||||
}
|
||||
@else {
|
||||
.#{$color_name}.#{$color_type} {
|
||||
background-color: $color_value !important;
|
||||
}
|
||||
// .#{$color_name}-text.text-#{$color_type} {
|
||||
// color: $color_value !important;
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Shade classes
|
||||
@each $color,
|
||||
$color_value in $shades {
|
||||
.#{$color} {
|
||||
background-color: $color_value !important;
|
||||
}
|
||||
.#{$color}-text {
|
||||
color: $color_value !important;
|
||||
}
|
||||
}
|
||||
|
||||
// usage: color("name_of_color", "type_of_color")
|
||||
// to avoid to repeating map-get($colors, ...)
|
||||
@function color($color, $type) {
|
||||
@if map-has-key($colors, $color) {
|
||||
$curr_color: map-get($colors, $color);
|
||||
@if map-has-key($curr_color, $type) {
|
||||
@return map-get($curr_color, $type);
|
||||
}
|
||||
}
|
||||
// @warn "Unknown `#{name}` in $colors.";
|
||||
@return null;
|
||||
}
|
||||
|
||||
.light-blue-text {
|
||||
color: map-get($blue, "accent-1") !important;
|
||||
}
|
||||
|
||||
.dark-grey-text {
|
||||
color:#4f4f4f !important;
|
||||
}
|
||||
|
||||
// Social colors
|
||||
$fb-color: #3B5998 !default;
|
||||
$tw-color: #55ACEE !default;
|
||||
$gplus-color: #DD4B39 !default;
|
||||
$yt-color: #ED302F !default;
|
||||
$li-color: #0082CA !default;
|
||||
$pin-color: #C61118 !default;
|
||||
$ins-color: #2E5E86 !default;
|
||||
$git-color: #333 !default;
|
||||
$comm-color: #30CFC0 !default;
|
||||
$vk-color: #4C75A3 !default;
|
||||
$drib-color: #EC4A89 !default;
|
||||
$so-color: #ffac44 !default;
|
||||
$slack-color: #56b68b !default;
|
||||
|
||||
$social-colors: (
|
||||
"fb": #3B5998,
|
||||
"tw": #55ACEE,
|
||||
"gplus": #DD4B39,
|
||||
"yt": #ED302F,
|
||||
"li": #0082CA,
|
||||
"pin": #C61118,
|
||||
"ins": #2E5E86,
|
||||
"git": #333,
|
||||
"comm": #30CFC0,
|
||||
"vk": #4C75A3,
|
||||
"dribbble": #EC4A89,
|
||||
"so": #ffac44,
|
||||
"slack": #56b68b,
|
||||
"email": #4B515D
|
||||
);
|
||||
|
||||
// Material Design Colors
|
||||
$danger-color: #ff3547 !default;
|
||||
.danger-color {
|
||||
background-color: $danger-color!important;
|
||||
}
|
||||
|
||||
$danger-color-dark: #CC0000 !default;
|
||||
.danger-color-dark {
|
||||
background-color: $danger-color-dark!important;
|
||||
}
|
||||
|
||||
$warning-color: #ffbb33 !default;
|
||||
.warning-color {
|
||||
background-color: $warning-color!important;
|
||||
}
|
||||
|
||||
$warning-color-dark: #FF8800 !default;
|
||||
.warning-color-dark {
|
||||
background-color: $warning-color-dark!important;
|
||||
}
|
||||
|
||||
$success-color: #00C851 !default;
|
||||
.success-color {
|
||||
background-color: $success-color!important;
|
||||
}
|
||||
|
||||
$success-color-dark: #007E33 !default;
|
||||
.success-color-dark {
|
||||
background-color: $success-color-dark!important;
|
||||
}
|
||||
|
||||
$info-color: #33b5e5 !default;
|
||||
.info-color {
|
||||
background-color: $info-color!important;
|
||||
}
|
||||
|
||||
$info-color-dark: #0099CC !default;
|
||||
.info-color-dark {
|
||||
background-color: $info-color-dark!important;
|
||||
}
|
||||
|
||||
// MDB Colors
|
||||
$default-color: #2BBBAD !default;
|
||||
.default-color {
|
||||
background-color: $default-color!important;
|
||||
}
|
||||
|
||||
$default-color-dark: #00695c !default;
|
||||
.default-color-dark {
|
||||
background-color: $default-color-dark!important;
|
||||
}
|
||||
|
||||
$primary-color: #4285F4 !default;
|
||||
.primary-color {
|
||||
background-color: $primary-color!important;
|
||||
}
|
||||
|
||||
$primary-color-dark: #0d47a1 !default;
|
||||
.primary-color-dark {
|
||||
background-color: $primary-color-dark!important;
|
||||
}
|
||||
|
||||
$secondary-color: #aa66cc !default;
|
||||
.secondary-color {
|
||||
background-color: $secondary-color!important;
|
||||
}
|
||||
|
||||
$secondary-color-dark: #9933CC !default;
|
||||
.secondary-color-dark {
|
||||
background-color: $secondary-color-dark!important;
|
||||
}
|
||||
|
||||
$elegant-color: #2E2E2E !default;
|
||||
.elegant-color {
|
||||
background-color: $elegant-color!important;
|
||||
}
|
||||
|
||||
$elegant-color-dark: #212121 !default;
|
||||
.elegant-color-dark {
|
||||
background-color: $elegant-color-dark!important;
|
||||
}
|
||||
|
||||
$stylish-color: #4B515D !default;
|
||||
.stylish-color {
|
||||
background-color: $stylish-color!important;
|
||||
}
|
||||
|
||||
$stylish-color-dark: #3E4551 !default;
|
||||
.stylish-color-dark {
|
||||
background-color: $stylish-color-dark!important;
|
||||
}
|
||||
|
||||
$special-color: #37474F !default;
|
||||
.special-color {
|
||||
background-color: $special-color!important;
|
||||
}
|
||||
|
||||
$special-color-dark: #263238 !default;
|
||||
.special-color-dark {
|
||||
background-color: $special-color-dark!important;
|
||||
}
|
||||
|
||||
$unique-color: #3F729B !default;
|
||||
.unique-color {
|
||||
background-color: $unique-color!important;
|
||||
}
|
||||
|
||||
$unique-color-dark: #1C2331 !default;
|
||||
.unique-color-dark {
|
||||
background-color: $unique-color-dark!important;
|
||||
}
|
||||
|
||||
$mdbcolor: #45526E !default;
|
||||
.mdb-color {
|
||||
background-color: $mdbcolor!important;
|
||||
}
|
||||
|
||||
$error-color: color("red", "base") !default;
|
||||
|
||||
// RGBA colors
|
||||
// Light overlays
|
||||
$rgba-blue-light: rgba(3, 169, 244, 0.3) !default;
|
||||
.rgba-blue-light {
|
||||
background-color: $rgba-blue-light!important;
|
||||
}
|
||||
|
||||
$rgba-red-light: rgba(244, 67, 54, 0.3) !default;
|
||||
.rgba-red-light {
|
||||
background-color: $rgba-red-light!important;
|
||||
}
|
||||
|
||||
$rgba-pink-light: rgba(233, 30, 99, 0.3) !default;
|
||||
.rgba-pink-light {
|
||||
background-color: $rgba-pink-light!important;
|
||||
}
|
||||
|
||||
$rgba-purple-light: rgba(156, 39, 176, 0.3) !default;
|
||||
.rgba-purple-light {
|
||||
background-color: $rgba-purple-light!important;
|
||||
}
|
||||
|
||||
$rgba-indigo-light: rgba(63, 81, 181, 0.3) !default;
|
||||
.rgba-indigo-light {
|
||||
background-color: $rgba-indigo-light!important;
|
||||
}
|
||||
|
||||
$rgba-cyan-light: rgba(0, 188, 212, 0.3) !default;
|
||||
.rgba-cyan-light {
|
||||
background-color: $rgba-cyan-light!important;
|
||||
}
|
||||
|
||||
$rgba-teal-light: rgba(0, 150, 136, 0.3) !default;
|
||||
.rgba-teal-light {
|
||||
background-color: $rgba-teal-light!important;
|
||||
}
|
||||
|
||||
$rgba-green-light: rgba(76, 175, 80, 0.3) !default;
|
||||
.rgba-green-light {
|
||||
background-color: $rgba-green-light!important;
|
||||
}
|
||||
|
||||
$rgba-lime-light: rgba(205, 220, 57, 0.3) !default;
|
||||
.rgba-lime-light {
|
||||
background-color: $rgba-lime-light!important;
|
||||
}
|
||||
|
||||
$rgba-yellow-light: rgba(255, 235, 59, 0.3) !default;
|
||||
.rgba-yellow-light {
|
||||
background-color: $rgba-yellow-light!important;
|
||||
}
|
||||
|
||||
$rgba-orange-light: rgba(255, 152, 0, 0.3) !default;
|
||||
.rgba-orange-light {
|
||||
background-color: $rgba-orange-light!important;
|
||||
}
|
||||
|
||||
$rgba-brown-light: rgba(121, 85, 72, 0.3) !default;
|
||||
.rgba-brown-light {
|
||||
background-color: $rgba-brown-light!important;
|
||||
}
|
||||
|
||||
$rgba-grey-light: rgba(158, 158, 158, 0.3) !default;
|
||||
.rgba-grey-light {
|
||||
background-color: $rgba-grey-light!important;
|
||||
}
|
||||
|
||||
$rgba-bluegrey-light: rgba(96, 125, 139, 0.3) !default;
|
||||
.rgba-bluegrey-light {
|
||||
background-color: $rgba-bluegrey-light!important;
|
||||
}
|
||||
|
||||
$rgba-black-light: rgba(0, 0, 0, 0.3) !default;
|
||||
.rgba-black-light {
|
||||
background-color: $rgba-black-light!important;
|
||||
}
|
||||
|
||||
$rgba-stylish-light: rgba(62, 69, 81, 0.3) !default;
|
||||
.rgba-stylish-light {
|
||||
background-color: $rgba-stylish-light!important;
|
||||
}
|
||||
|
||||
$rgba-white-light: rgba(255, 255, 255, 0.3) !default;
|
||||
.rgba-white-light {
|
||||
background-color: $rgba-white-light!important;
|
||||
}
|
||||
|
||||
// Strong overlays
|
||||
$rgba-blue-strong: rgba(3, 169, 244, 0.7) !default;
|
||||
.rgba-blue-strong {
|
||||
background-color: $rgba-blue-strong!important;
|
||||
}
|
||||
|
||||
$rgba-red-strong: rgba(244, 67, 54, 0.7) !default;
|
||||
.rgba-red-strong {
|
||||
background-color: $rgba-red-strong!important;
|
||||
}
|
||||
|
||||
$rgba-pink-strong: rgba(233, 30, 99, 0.7) !default;
|
||||
.rgba-pink-strong {
|
||||
background-color: $rgba-pink-strong!important;
|
||||
}
|
||||
|
||||
$rgba-purple-strong: rgba(156, 39, 176, 0.7) !default;
|
||||
.rgba-purple-strong {
|
||||
background-color: $rgba-purple-strong!important;
|
||||
}
|
||||
|
||||
$rgba-indigo-strong: rgba(63, 81, 181, 0.7) !default;
|
||||
.rgba-indigo-strong {
|
||||
background-color: $rgba-indigo-strong!important;
|
||||
}
|
||||
|
||||
$rgba-cyan-strong: rgba(0, 188, 212, 0.7) !default;
|
||||
.rgba-cyan-strong {
|
||||
background-color: $rgba-cyan-strong!important;
|
||||
}
|
||||
|
||||
$rgba-teal-strong: rgba(0, 150, 136, 0.7) !default;
|
||||
.rgba-teal-strong {
|
||||
background-color: $rgba-teal-strong!important;
|
||||
}
|
||||
|
||||
$rgba-green-strong: rgba(76, 175, 80, 0.7) !default;
|
||||
.rgba-green-strong {
|
||||
background-color: $rgba-green-strong!important;
|
||||
}
|
||||
|
||||
$rgba-lime-strong: rgba(205, 220, 57, 0.7) !default;
|
||||
.rgba-lime-strong {
|
||||
background-color: $rgba-lime-strong!important;
|
||||
}
|
||||
|
||||
$rgba-yellow-strong: rgba(255, 235, 59, 0.7) !default;
|
||||
.rgba-yellow-strong {
|
||||
background-color: $rgba-yellow-strong!important;
|
||||
}
|
||||
|
||||
$rgba-orange-strong: rgba(255, 152, 0, 0.7) !default;
|
||||
.rgba-orange-strong {
|
||||
background-color: $rgba-orange-strong!important;
|
||||
}
|
||||
|
||||
$rgba-brown-strong: rgba(121, 85, 72, 0.7) !default;
|
||||
.rgba-brown-strong {
|
||||
background-color: $rgba-brown-strong!important;
|
||||
}
|
||||
|
||||
$rgba-grey-strong: rgba(158, 158, 158, 0.7) !default;
|
||||
.rgba-grey-strong {
|
||||
background-color: $rgba-grey-strong!important;
|
||||
}
|
||||
|
||||
$rgba-bluegrey-strong: rgba(96, 125, 139, 0.7) !default;
|
||||
.rgba-bluegrey-strong {
|
||||
background-color: $rgba-bluegrey-strong!important;
|
||||
}
|
||||
|
||||
$rgba-black-strong: rgba(0, 0, 0, 0.7) !default;
|
||||
.rgba-black-strong {
|
||||
background-color: $rgba-black-strong!important;
|
||||
}
|
||||
|
||||
$rgba-stylish-strong: rgba(62, 69, 81, 0.7) !default;
|
||||
.rgba-stylish-strong {
|
||||
background-color: $rgba-stylish-strong!important;
|
||||
}
|
||||
|
||||
$rgba-white-strong: rgba(255, 255, 255, 0.7) !default;
|
||||
.rgba-white-strong {
|
||||
background-color: $rgba-white-strong!important;
|
||||
}
|
||||
|
||||
// Super light overlays
|
||||
$rgba-blue-slight: rgba(3, 169, 244, 0.1) !default;
|
||||
.rgba-blue-slight {
|
||||
background-color: $rgba-blue-slight!important;
|
||||
}
|
||||
|
||||
$rgba-red-slight: rgba(244, 67, 54, 0.1) !default;
|
||||
.rgba-red-slight {
|
||||
background-color: $rgba-red-slight!important;
|
||||
}
|
||||
|
||||
$rgba-pink-slight: rgba(233, 30, 99, 0.1) !default;
|
||||
.rgba-pink-slight {
|
||||
background-color: $rgba-pink-slight!important;
|
||||
}
|
||||
|
||||
$rgba-purple-slight: rgba(156, 39, 176, 0.1) !default;
|
||||
.rgba-purple-slight {
|
||||
background-color: $rgba-purple-slight!important;
|
||||
}
|
||||
|
||||
$rgba-indigo-slight: rgba(63, 81, 181, 0.1) !default;
|
||||
.rgba-indigo-slight {
|
||||
background-color: $rgba-indigo-slight!important;
|
||||
}
|
||||
|
||||
$rgba-cyan-slight: rgba(0, 188, 212, 0.1) !default;
|
||||
.rgba-cyan-slight {
|
||||
background-color: $rgba-cyan-slight!important;
|
||||
}
|
||||
|
||||
$rgba-teal-slight: rgba(0, 150, 136, 0.1) !default;
|
||||
.rgba-teal-slight {
|
||||
background-color: $rgba-teal-slight!important;
|
||||
}
|
||||
|
||||
$rgba-green-slight: rgba(76, 175, 80, 0.1) !default;
|
||||
.rgba-green-slight {
|
||||
background-color: $rgba-green-slight!important;
|
||||
}
|
||||
|
||||
$rgba-lime-slight: rgba(205, 220, 57, 0.1) !default;
|
||||
.rgba-lime-slight {
|
||||
background-color: $rgba-lime-slight!important;
|
||||
}
|
||||
|
||||
$rgba-yellow-slight: rgba(255, 235, 59, 0.1) !default;
|
||||
.rgba-yellow-slight {
|
||||
background-color: $rgba-yellow-slight!important;
|
||||
}
|
||||
|
||||
$rgba-orange-slight: rgba(255, 152, 0, 0.1) !default;
|
||||
.rgba-orange-slight {
|
||||
background-color: $rgba-orange-slight!important;
|
||||
}
|
||||
|
||||
$rgba-brown-slight: rgba(121, 85, 72, 0.1) !default;
|
||||
.rgba-brown-slight {
|
||||
background-color: $rgba-brown-slight!important;
|
||||
}
|
||||
|
||||
$rgba-grey-slight: rgba(158, 158, 158, 0.1) !default;
|
||||
.rgba-grey-slight {
|
||||
background-color: $rgba-grey-slight!important;
|
||||
}
|
||||
|
||||
$rgba-bluegrey-slight: rgba(96, 125, 139, 0.1) !default;
|
||||
.rgba-bluegrey-slight {
|
||||
background-color: rgba(96, 125, 139, 0.1)!important;
|
||||
}
|
||||
|
||||
$rgba-black-slight: rgba(0, 0, 0, 0.1) !default;
|
||||
.rgba-black-slight {
|
||||
background-color: $rgba-black-slight!important;
|
||||
}
|
||||
|
||||
$rgba-stylish-slight: rgba(62, 69, 81, 0.1) !default;
|
||||
.rgba-stylish-slight {
|
||||
background-color: $rgba-stylish-slight!important;
|
||||
}
|
||||
|
||||
$rgba-white-slight: rgba(255, 255, 255, 0.1) !default;
|
||||
.rgba-white-slight {
|
||||
background-color: $rgba-white-slight!important;
|
||||
}
|
||||
|
||||
$rgba-colors: (
|
||||
// Super light
|
||||
"blue-slight": $rgba-blue-slight,
|
||||
"red-slight": $rgba-red-slight,
|
||||
"pink-slight": $rgba-pink-slight,
|
||||
"purple-slight": $rgba-purple-slight,
|
||||
"indigo-slight": $rgba-indigo-slight,
|
||||
"cyan-slight": $rgba-cyan-slight,
|
||||
"teal-slight": $rgba-teal-slight,
|
||||
"green-slight": $rgba-green-slight,
|
||||
"lime-slight": $rgba-lime-slight,
|
||||
"yellow-slight": $rgba-yellow-slight,
|
||||
"orange-slight": $rgba-orange-slight,
|
||||
"brown-slight": $rgba-brown-slight,
|
||||
"grey-slight": $rgba-grey-slight,
|
||||
"bluegrey-slight": $rgba-bluegrey-slight,
|
||||
"black-slight": $rgba-black-slight,
|
||||
"stylish-slight": $rgba-stylish-slight,
|
||||
"white-slight": $rgba-white-slight,
|
||||
// Light
|
||||
"blue-light": $rgba-blue-light,
|
||||
"red-light": $rgba-red-light,
|
||||
"pink-light": $rgba-pink-light,
|
||||
"purple-light": $rgba-purple-light,
|
||||
"indigo-light": $rgba-indigo-light,
|
||||
"cyan-light": $rgba-cyan-light,
|
||||
"teal-light": $rgba-teal-light,
|
||||
"green-light": $rgba-green-light,
|
||||
"lime-light": $rgba-lime-light,
|
||||
"yellow-light": $rgba-yellow-light,
|
||||
"orange-light": $rgba-orange-light,
|
||||
"brown-light": $rgba-brown-light,
|
||||
"grey-light": $rgba-grey-light,
|
||||
"bluegrey-light": $rgba-bluegrey-light,
|
||||
"black-light": $rgba-black-light,
|
||||
"stylish-light": $rgba-stylish-light,
|
||||
"white-light": $rgba-white-light,
|
||||
// Strong
|
||||
"blue-strong": $rgba-blue-strong,
|
||||
"red-strong": $rgba-red-strong,
|
||||
"pink-strong": $rgba-pink-strong,
|
||||
"purple-strong": $rgba-purple-strong,
|
||||
"indigo-strong": $rgba-indigo-strong,
|
||||
"cyan-strong": $rgba-cyan-strong,
|
||||
"teal-strong": $rgba-teal-strong,
|
||||
"green-strong": $rgba-green-strong,
|
||||
"lime-strong": $rgba-lime-strong,
|
||||
"yellow-strong": $rgba-yellow-strong,
|
||||
"orange-strong": $rgba-orange-strong,
|
||||
"brown-strong": $rgba-brown-strong,
|
||||
"grey-strong": $rgba-grey-strong,
|
||||
"bluegrey-strong": $rgba-bluegrey-strong,
|
||||
"black-strong": $rgba-black-strong,
|
||||
"stylish-strong": $rgba-stylish-strong,
|
||||
"white-strong": $rgba-white-strong,
|
||||
);
|
||||
|
||||
$material-colors: (
|
||||
"primary": $primary-color,
|
||||
"danger": $danger-color,
|
||||
"warning": $warning-color-dark,
|
||||
"success": $success-color,
|
||||
"info": $info-color,
|
||||
"default": $default-color,
|
||||
"secondary": $secondary-color,
|
||||
"elegant": $elegant-color,
|
||||
"unique": map-get($pink, darken-4),
|
||||
"dark-green": map-get($green, darken-2),
|
||||
"mdb-color": map-get($mdb-color, lighten-1),
|
||||
"red": map-get($red, darken-2),
|
||||
"pink": map-get($pink, lighten-1),
|
||||
"purple": map-get($purple, darken-1),
|
||||
"deep-purple": map-get($deep-purple, darken-2),
|
||||
"indigo": map-get($indigo, base),
|
||||
"blue": map-get($blue, darken-2),
|
||||
"light-blue": map-get($blue, accent-1),
|
||||
"cyan": map-get($cyan, base),
|
||||
"teal": map-get($teal, darken-2),
|
||||
"green": map-get($green, darken-2),
|
||||
"light-green": map-get($light-green, base),
|
||||
"lime": map-get($lime, darken-2),
|
||||
"yellow": map-get($yellow, darken-2),
|
||||
"amber": map-get($amber, darken-2),
|
||||
"orange": map-get($orange, darken-2),
|
||||
"deep-orange": map-get($deep-orange, lighten-1),
|
||||
"brown": map-get($brown, base),
|
||||
"grey": map-get($grey, darken-2),
|
||||
"blue-grey": map-get($blue-grey, lighten-1),
|
||||
"dark": map-get($grey, darken-4),
|
||||
"light": map-get($grey, lighten-2),
|
||||
"white": $white,
|
||||
"black": $black
|
||||
);
|
||||
|
||||
$ctbc: (
|
||||
"tabs-cyan": map-get($yellow, "base"),
|
||||
"tabs-orange": map-get($red, "darken-1"),
|
||||
"tabs-grey": map-get($shades, "white"),
|
||||
"tabs-pink": map-get($deep-purple, "base"),
|
||||
"tabs-green": map-get($blue, "darken-3"),
|
||||
"tabs-primary": map-get($shades, "white")
|
||||
);
|
||||
|
||||
$skin-colors: (
|
||||
"mdb",
|
||||
"white",
|
||||
"black",
|
||||
"grey",
|
||||
"light-blue",
|
||||
"indigo",
|
||||
"pink",
|
||||
"cyan",
|
||||
"navy-blue",
|
||||
"deep-purple"
|
||||
);
|
||||
|
||||
$dropdown-colors: (
|
||||
"primary" : $primary-color,
|
||||
"danger" : $danger-color-dark,
|
||||
"default" : $default-color,
|
||||
"secondary": $secondary-color,
|
||||
"success" : $success-color,
|
||||
"info" : $info-color,
|
||||
"warning" : $warning-color,
|
||||
"dark" : map-get($material-colors, "elegant"),
|
||||
"ins" : map-get($social-colors, "ins")
|
||||
);
|
||||
|
||||
$switch-colors: (
|
||||
"bg": $secondary-color,
|
||||
"checked-lever-bg": desaturate(lighten($secondary-color, 25%), 25%),
|
||||
"unchecked-bg": #F1F1F1,
|
||||
"unchecked-lever-bg": #818181,
|
||||
);
|
||||
|
||||
@function map-create() {
|
||||
|
||||
$colormap: ();
|
||||
|
||||
@each $key, $val in $colors {
|
||||
|
||||
@if(map-has-key($val, darken-2)) {
|
||||
$colormap: map-merge($colormap, ($key: map-get($val, darken-2)));
|
||||
}
|
||||
}
|
||||
|
||||
@return $colormap;
|
||||
|
||||
}
|
||||
|
||||
$mdb-colors: map-create();
|
||||
|
||||
$color-palette: map-merge($mdb-colors, $material-colors);
|
||||
|
||||
@each $name, $color in $material-colors {
|
||||
.bg-#{$name} {
|
||||
background-color: $color !important;
|
||||
}
|
||||
}
|
||||
90
html/sass/mdb/free/data/_functions.scss
Executable file
90
html/sass/mdb/free/data/_functions.scss
Executable file
@@ -0,0 +1,90 @@
|
||||
// Bootstrap functions
|
||||
//
|
||||
// Utility mixins and functions for evalutating source code across our variables, maps, and mixins.
|
||||
|
||||
// Ascending
|
||||
// Used to evaluate Sass maps like our grid breakpoints.
|
||||
@mixin _assert-ascending($map, $map-name) {
|
||||
$prev-key: null;
|
||||
$prev-num: null;
|
||||
@each $key, $num in $map {
|
||||
@if $prev-num == null {
|
||||
// Do nothing
|
||||
} @else if not comparable($prev-num, $num) {
|
||||
@warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !";
|
||||
} @else if $prev-num >= $num {
|
||||
@warn "Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !";
|
||||
}
|
||||
$prev-key: $key;
|
||||
$prev-num: $num;
|
||||
}
|
||||
}
|
||||
|
||||
// Starts at zero
|
||||
// Another grid mixin that ensures the min-width of the lowest breakpoint starts at 0.
|
||||
@mixin _assert-starts-at-zero($map) {
|
||||
$values: map-values($map);
|
||||
$first-value: nth($values, 1);
|
||||
@if $first-value != 0 {
|
||||
@warn "First breakpoint in `$grid-breakpoints` must start at 0, but starts at #{$first-value}.";
|
||||
}
|
||||
}
|
||||
|
||||
// Replace `$search` with `$replace` in `$string`
|
||||
// Used on our SVG icon backgrounds for custom forms.
|
||||
//
|
||||
// @author Hugo Giraudel
|
||||
// @param {String} $string - Initial string
|
||||
// @param {String} $search - Substring to replace
|
||||
// @param {String} $replace ('') - New value
|
||||
// @return {String} - Updated string
|
||||
@function str-replace($string, $search, $replace: "") {
|
||||
$index: str-index($string, $search);
|
||||
|
||||
@if $index {
|
||||
@return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
|
||||
}
|
||||
|
||||
@return $string;
|
||||
}
|
||||
|
||||
// Color contrast
|
||||
@mixin color-yiq($color) {
|
||||
$r: red($color);
|
||||
$g: green($color);
|
||||
$b: blue($color);
|
||||
|
||||
$yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000;
|
||||
|
||||
@if ($yiq >= 150) {
|
||||
color: #111;
|
||||
} @else {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
// Retreive color Sass maps
|
||||
@function color($key: "blue") {
|
||||
@return map-get($colors, $key);
|
||||
}
|
||||
|
||||
@function theme-color($key: "primary") {
|
||||
@return map-get($theme-colors, $key);
|
||||
}
|
||||
|
||||
@function grayscale($key: "100") {
|
||||
@return map-get($grays, $key);
|
||||
}
|
||||
|
||||
// Request a theme color level
|
||||
@function theme-color-level($color-name: "primary", $level: 0) {
|
||||
$color: theme-color($color-name);
|
||||
$color-base: if($level > 0, #000, #fff);
|
||||
|
||||
@if $level < 0 {
|
||||
// Lighter values need a quick double negative for the Sass math to work
|
||||
@return mix($color-base, $color, $level * -1 * $theme-color-interval);
|
||||
} @else {
|
||||
@return mix($color-base, $color, $level * $theme-color-interval);
|
||||
}
|
||||
}
|
||||
267
html/sass/mdb/free/data/_mixins.scss
Executable file
267
html/sass/mdb/free/data/_mixins.scss
Executable file
@@ -0,0 +1,267 @@
|
||||
/*********************
|
||||
Mixins
|
||||
**********************/
|
||||
|
||||
@mixin hover {
|
||||
@if $enable-hover-media-query {
|
||||
// See Media Queries Level 4: http://drafts.csswg.org/mediaqueries/#hover
|
||||
// Currently shimmed by https://github.com/twbs/mq4-hover-shim
|
||||
@media (hover: hover) {
|
||||
&:hover {
|
||||
@content
|
||||
}
|
||||
}
|
||||
}
|
||||
@else {
|
||||
&:hover {
|
||||
@content
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin hover-focus {
|
||||
@if $enable-hover-media-query {
|
||||
&:focus {
|
||||
@content
|
||||
}
|
||||
@include hover {
|
||||
@content
|
||||
}
|
||||
}
|
||||
@else {
|
||||
&:focus,
|
||||
&:hover {
|
||||
@content
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin plain-hover-focus {
|
||||
@if $enable-hover-media-query {
|
||||
&:focus {
|
||||
@content
|
||||
}
|
||||
@include hover {
|
||||
@content
|
||||
}
|
||||
}
|
||||
@else {
|
||||
&:focus,
|
||||
&:hover {
|
||||
@content
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin hover-focus-active {
|
||||
@if $enable-hover-media-query {
|
||||
&:focus,
|
||||
&:active {
|
||||
@content
|
||||
}
|
||||
@include hover {
|
||||
@content
|
||||
}
|
||||
}
|
||||
@else {
|
||||
&:focus,
|
||||
&:active,
|
||||
&:hover {
|
||||
@content
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin border-radius($args) {
|
||||
-webkit-border-radius: $args;
|
||||
-moz-border-radius: $args;
|
||||
-ms-border-radius: $args;
|
||||
-o-border-radius: $args;
|
||||
border-radius: $args;
|
||||
}
|
||||
|
||||
@mixin placeholder {
|
||||
&::-webkit-input-placeholder {
|
||||
@content
|
||||
}
|
||||
&:-moz-placeholder {
|
||||
@content
|
||||
}
|
||||
&::-moz-placeholder {
|
||||
@content
|
||||
}
|
||||
&::-ms-placeholder {
|
||||
@content
|
||||
}
|
||||
&::placeholder {
|
||||
@content
|
||||
}
|
||||
}
|
||||
|
||||
// New mixins
|
||||
@mixin make-button($name, $color) {
|
||||
.btn-#{$name} {
|
||||
@function set-notification-text-color($color) {
|
||||
@if (lightness($color) > 80) {
|
||||
@return $black; // Lighter backgorund, return dark color
|
||||
} @else {
|
||||
@return $white; // Darker background, return light color
|
||||
}
|
||||
}
|
||||
background-color: $color !important;
|
||||
color: set-notification-text-color($color) !important;
|
||||
&:hover {
|
||||
background-color: lighten($color, 5%);
|
||||
}
|
||||
&:focus,
|
||||
&.focus {
|
||||
@extend .z-depth-1-half;
|
||||
}
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active {
|
||||
background-color: darken($color, 13%);
|
||||
}
|
||||
&.dropdown-toggle {
|
||||
background-color: $color!important;
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: lighten($color, 5%) !important;
|
||||
}
|
||||
}
|
||||
&:not([disabled]):not(.disabled):active,
|
||||
&:not([disabled]):not(.disabled).active,
|
||||
.show > &.dropdown-toggle {
|
||||
@extend .z-depth-1-half;
|
||||
background-color: darken($color, 13%) !important;
|
||||
}
|
||||
&:not([disabled]):not(.disabled):active:focus,
|
||||
&:not([disabled]):not(.disabled).active:focus,
|
||||
.show > &.dropdown-toggle:focus {
|
||||
@extend .z-depth-1-half;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin make-outline-button($name, $color) {
|
||||
.btn-outline-#{$name} {
|
||||
border: 2px solid $color;
|
||||
color: $color !important;
|
||||
background-color: transparent;
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&:active:focus,
|
||||
&.active {
|
||||
background-color: transparent;
|
||||
color: $color;
|
||||
border-color: $color;
|
||||
}
|
||||
&:not([disabled]):not(.disabled):active,
|
||||
&:not([disabled]):not(.disabled).active,
|
||||
.show > &.dropdown-toggle {
|
||||
@extend .z-depth-1-half;
|
||||
background-color: transparent !important;
|
||||
border-color: $color !important;
|
||||
}
|
||||
&:not([disabled]):not(.disabled):active:focus,
|
||||
&:not([disabled]):not(.disabled).active:focus,
|
||||
.show > &.dropdown-toggle:focus {
|
||||
@extend .z-depth-1-half;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin make-gradient-button($name, $value) {
|
||||
.btn.#{$name}-gradient {
|
||||
background: linear-gradient(40deg, map-get($value, start), map-get($value, end)) !important;
|
||||
transition:.5s ease;
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&:active:focus
|
||||
&.active {
|
||||
background: linear-gradient(40deg, lighten(map-get($value, start), 5%), lighten(map-get($value, end), 5%));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Button sizes
|
||||
@mixin button-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
|
||||
padding: $padding-y $padding-x;
|
||||
font-size: $font-size;
|
||||
line-height: $line-height;
|
||||
@include border-radius($border-radius);
|
||||
}
|
||||
|
||||
|
||||
@mixin transition($transition...) {
|
||||
@if $enable-transitions {
|
||||
@if length($transition) == 0 {
|
||||
transition: $transition-base;
|
||||
} @else {
|
||||
transition: $transition;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin transform($args) {
|
||||
-webkit-transform: $args;
|
||||
-moz-transform: $args;
|
||||
-ms-transform: $args;
|
||||
-o-transform: $args;
|
||||
transform: $args;
|
||||
}
|
||||
|
||||
@function breakpoint-min($name, $breakpoints: $grid-breakpoints) {
|
||||
$min: map-get($breakpoints, $name);
|
||||
@return if($min != 0, $min, null);
|
||||
}
|
||||
|
||||
@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {
|
||||
$min: breakpoint-min($name, $breakpoints);
|
||||
@if $min {
|
||||
@media (min-width: $min) {
|
||||
@content;
|
||||
}
|
||||
} @else {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
// Flexbox
|
||||
@mixin flexbox() {
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -ms-flexbox;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
}
|
||||
@mixin flex($values) {
|
||||
-webkit-box-flex: $values;
|
||||
-moz-box-flex: $values;
|
||||
-webkit-flex: $values;
|
||||
-ms-flex: $values;
|
||||
flex: $values;
|
||||
}
|
||||
@mixin order($val) {
|
||||
-webkit-box-ordinal-group: $val;
|
||||
-moz-box-ordinal-group: $val;
|
||||
-ms-flex-order: $val;
|
||||
-webkit-order: $val;
|
||||
order: $val;
|
||||
}
|
||||
@mixin align($align) {
|
||||
-webkit-flex-align: $align;
|
||||
-ms-flex-align: $align;
|
||||
-webkit-align-items: $align;
|
||||
align-items: $align;
|
||||
}
|
||||
@mixin justify-content($val) {
|
||||
-webkit-justify-content: $val;
|
||||
justify-content: $val;
|
||||
}
|
||||
|
||||
@function breakpoint-infix($name, $breakpoints: $grid-breakpoints) {
|
||||
@return if(breakpoint-min($name, $breakpoints) == null, "", "-#{$name}");
|
||||
}
|
||||
41
html/sass/mdb/free/data/_prefixer.scss
Executable file
41
html/sass/mdb/free/data/_prefixer.scss
Executable file
@@ -0,0 +1,41 @@
|
||||
// Transforms
|
||||
|
||||
@mixin transform($args) {
|
||||
-webkit-transform: $args;
|
||||
-moz-transform: $args;
|
||||
-ms-transform: $args;
|
||||
-o-transform: $args;
|
||||
transform: $args;
|
||||
}
|
||||
|
||||
@mixin transform-origin($args) {
|
||||
-webkit-transform-origin: $args;
|
||||
-moz-transform-origin: $args;
|
||||
-ms-transform-origin: $args;
|
||||
-o-transform-origin: $args;
|
||||
transform-origin: $args;
|
||||
}
|
||||
|
||||
// Keyframes
|
||||
@mixin keyframes($animation-name) {
|
||||
@keyframes #{$animation-name} {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
//animations
|
||||
@mixin animation($args) {
|
||||
-webkit-animation: $args;
|
||||
-moz-animation: $args;
|
||||
-ms-animation: $args;
|
||||
-o-animation: $args;
|
||||
animation: $args;
|
||||
}
|
||||
|
||||
@mixin animation-delay($delay) {
|
||||
-webkit-animation-delay: $delay;
|
||||
-moz-animation-delay: $delay;
|
||||
-ms-animation-delay: $delay;
|
||||
-o-animation-delay: $delay;
|
||||
animation-delay: $delay;
|
||||
}
|
||||
837
html/sass/mdb/free/data/_variables-b4.scss
Executable file
837
html/sass/mdb/free/data/_variables-b4.scss
Executable file
@@ -0,0 +1,837 @@
|
||||
// Variables
|
||||
//
|
||||
// Copy settings from this file into the provided `_custom.scss` to override
|
||||
// the Bootstrap defaults without modifying key, versioned files.
|
||||
//
|
||||
// Variables should follow the `$component-state-property-size` formula for
|
||||
// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
|
||||
|
||||
// Table of Contents
|
||||
//
|
||||
// Color system
|
||||
// Options
|
||||
// Spacing
|
||||
// Body
|
||||
// Links
|
||||
// Grid breakpoints
|
||||
// Grid containers
|
||||
// Grid columns
|
||||
// Fonts
|
||||
// Components
|
||||
// Tables
|
||||
// Buttons
|
||||
// Forms
|
||||
// Dropdowns
|
||||
// Z-index master list
|
||||
// Navs
|
||||
// Navbar
|
||||
// Pagination
|
||||
// Jumbotron
|
||||
// Form states and alerts
|
||||
// Cards
|
||||
// Tooltips
|
||||
// Popovers
|
||||
// Badges
|
||||
// Modals
|
||||
// Alerts
|
||||
// Progress bars
|
||||
// List group
|
||||
// Image thumbnails
|
||||
// Figures
|
||||
// Breadcrumbs
|
||||
// Carousel
|
||||
// Close
|
||||
// Code
|
||||
|
||||
|
||||
//
|
||||
// Color system
|
||||
//
|
||||
|
||||
$white: #fff !default;
|
||||
$gray-100: #f8f9fa !default;
|
||||
$gray-200: #e9ecef !default;
|
||||
$gray-300: #dee2e6 !default;
|
||||
$gray-400: #ced4da !default;
|
||||
$gray-500: #adb5bd !default;
|
||||
$gray-600: #868e96 !default;
|
||||
$gray-700: #495057 !default;
|
||||
$gray-800: #343a40 !default;
|
||||
$gray-900: #212529 !default;
|
||||
$black: #000 !default;
|
||||
|
||||
$grays: (
|
||||
100: $gray-100,
|
||||
200: $gray-200,
|
||||
300: $gray-300,
|
||||
400: $gray-400,
|
||||
500: $gray-500,
|
||||
600: $gray-600,
|
||||
700: $gray-700,
|
||||
800: $gray-800,
|
||||
900: $gray-900
|
||||
) !default;
|
||||
|
||||
$blue: #007bff !default;
|
||||
$indigo: #6610f2 !default;
|
||||
$purple: #6f42c1 !default;
|
||||
$pink: #e83e8c !default;
|
||||
$red: #dc3545 !default;
|
||||
$orange: #fd7e14 !default;
|
||||
$yellow: #ffc107 !default;
|
||||
$green: #28a745 !default;
|
||||
$teal: #20c997 !default;
|
||||
$cyan: #17a2b8 !default;
|
||||
|
||||
$colors: (
|
||||
blue: $blue,
|
||||
indigo: $indigo,
|
||||
purple: $purple,
|
||||
pink: $pink,
|
||||
red: $red,
|
||||
orange: $orange,
|
||||
yellow: $yellow,
|
||||
green: $green,
|
||||
teal: $teal,
|
||||
cyan: $cyan,
|
||||
white: $white,
|
||||
gray: $gray-600,
|
||||
gray-dark: $gray-800
|
||||
) !default;
|
||||
|
||||
$theme-colors: (
|
||||
primary: $blue,
|
||||
secondary: $gray-600,
|
||||
success: $green,
|
||||
info: $cyan,
|
||||
warning: $yellow,
|
||||
danger: $red,
|
||||
light: $gray-100,
|
||||
dark: $gray-800
|
||||
) !default;
|
||||
|
||||
// Set a specific jump point for requesting color jumps
|
||||
$theme-color-interval: 8% !default;
|
||||
|
||||
|
||||
// Options
|
||||
//
|
||||
// Quickly modify global styling by enabling or disabling optional features.
|
||||
|
||||
$enable-rounded: true !default;
|
||||
$enable-shadows: false !default;
|
||||
$enable-gradients: false !default;
|
||||
$enable-transitions: true !default;
|
||||
$enable-hover-media-query: false !default;
|
||||
$enable-grid-classes: true !default;
|
||||
$enable-print-styles: true !default;
|
||||
|
||||
|
||||
// Spacing
|
||||
//
|
||||
// Control the default styling of most Bootstrap elements by modifying these
|
||||
// variables. Mostly focused on spacing.
|
||||
// You can add more entries to the $spacers map, should you need more variation.
|
||||
|
||||
$spacer: 1rem !default;
|
||||
$spacers: (
|
||||
0: 0,
|
||||
1: ($spacer * .25),
|
||||
2: ($spacer * .5),
|
||||
3: $spacer,
|
||||
4: ($spacer * 1.5),
|
||||
5: ($spacer * 3)
|
||||
) !default;
|
||||
|
||||
// This variable affects the `.h-*` and `.w-*` classes.
|
||||
$sizes: (
|
||||
25: 25%,
|
||||
50: 50%,
|
||||
75: 75%,
|
||||
100: 100%
|
||||
) !default;
|
||||
|
||||
// Body
|
||||
//
|
||||
// Settings for the `<body>` element.
|
||||
|
||||
$body-bg: $white !default;
|
||||
$body-color: $gray-900 !default;
|
||||
|
||||
// Links
|
||||
//
|
||||
// Style anchor elements.
|
||||
|
||||
$link-color: theme-color("primary") !default;
|
||||
$link-decoration: none !default;
|
||||
$link-hover-color: darken($link-color, 15%) !default;
|
||||
$link-hover-decoration: underline !default;
|
||||
|
||||
|
||||
// Grid breakpoints
|
||||
//
|
||||
// Define the minimum dimensions at which your layout will change,
|
||||
// adapting to different screen sizes, for use in media queries.
|
||||
|
||||
$grid-breakpoints: (
|
||||
xs: 0,
|
||||
sm: 576px,
|
||||
md: 768px,
|
||||
lg: 992px,
|
||||
xl: 1200px
|
||||
) !default;
|
||||
@include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
|
||||
@include _assert-starts-at-zero($grid-breakpoints);
|
||||
|
||||
|
||||
// Grid containers
|
||||
//
|
||||
// Define the maximum width of `.container` for different screen sizes.
|
||||
|
||||
$container-max-widths: (
|
||||
sm: 540px,
|
||||
md: 720px,
|
||||
lg: 960px,
|
||||
xl: 1140px
|
||||
) !default;
|
||||
@include _assert-ascending($container-max-widths, "$container-max-widths");
|
||||
|
||||
|
||||
// Grid columns
|
||||
//
|
||||
// Set the number of columns and specify the width of the gutters.
|
||||
|
||||
$grid-columns: 12 !default;
|
||||
$grid-gutter-width: 30px !default;
|
||||
|
||||
// Components
|
||||
//
|
||||
// Define common padding and border radius sizes and more.
|
||||
|
||||
$line-height-lg: 1.5 !default;
|
||||
$line-height-sm: 1.5 !default;
|
||||
|
||||
$border-width: 1px !default;
|
||||
|
||||
$border-radius: .25rem !default;
|
||||
$border-radius-lg: .3rem !default;
|
||||
$border-radius-sm: .2rem !default;
|
||||
|
||||
$component-active-color: $white !default;
|
||||
$component-active-bg: theme-color("primary") !default;
|
||||
|
||||
$caret-width: .3em !default;
|
||||
|
||||
$transition-base: all .2s ease-in-out !default;
|
||||
$transition-fade: opacity .15s linear !default;
|
||||
$transition-collapse: height .35s ease !default;
|
||||
|
||||
|
||||
// Fonts
|
||||
//
|
||||
// Font, line-height, and color for body text, headings, and more.
|
||||
|
||||
$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !default;
|
||||
$font-family-monospace: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
|
||||
$font-family-base: $font-family-sans-serif !default;
|
||||
|
||||
$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`
|
||||
$font-size-lg: 1.25rem !default;
|
||||
$font-size-sm: .875rem !default;
|
||||
|
||||
$font-weight-normal: normal !default;
|
||||
$font-weight-bold: bold !default;
|
||||
|
||||
$font-weight-base: $font-weight-normal !default;
|
||||
$line-height-base: 1.5 !default;
|
||||
|
||||
$h1-font-size: 2.5rem !default;
|
||||
$h2-font-size: 2rem !default;
|
||||
$h3-font-size: 1.75rem !default;
|
||||
$h4-font-size: 1.5rem !default;
|
||||
$h5-font-size: 1.25rem !default;
|
||||
$h6-font-size: 1rem !default;
|
||||
|
||||
$headings-margin-bottom: ($spacer / 2) !default;
|
||||
$headings-font-family: inherit !default;
|
||||
$headings-font-weight: 500 !default;
|
||||
$headings-line-height: 1.1 !default;
|
||||
$headings-color: inherit !default;
|
||||
|
||||
$display1-size: 6rem !default;
|
||||
$display2-size: 5.5rem !default;
|
||||
$display3-size: 4.5rem !default;
|
||||
$display4-size: 3.5rem !default;
|
||||
|
||||
$display1-weight: 300 !default;
|
||||
$display2-weight: 300 !default;
|
||||
$display3-weight: 300 !default;
|
||||
$display4-weight: 300 !default;
|
||||
$display-line-height: $headings-line-height !default;
|
||||
|
||||
$lead-font-size: 1.25rem !default;
|
||||
$lead-font-weight: 300 !default;
|
||||
|
||||
$small-font-size: 80% !default;
|
||||
|
||||
$text-muted: $gray-600 !default;
|
||||
|
||||
$blockquote-small-color: $gray-600 !default;
|
||||
$blockquote-font-size: ($font-size-base * 1.25) !default;
|
||||
|
||||
$hr-border-color: rgba($black,.1) !default;
|
||||
$hr-border-width: $border-width !default;
|
||||
|
||||
$mark-padding: .2em !default;
|
||||
|
||||
$dt-font-weight: $font-weight-bold !default;
|
||||
|
||||
$kbd-box-shadow: inset 0 -.1rem 0 rgba($black,.25) !default;
|
||||
$nested-kbd-font-weight: $font-weight-bold !default;
|
||||
|
||||
$list-inline-padding: 5px !default;
|
||||
|
||||
$mark-bg: #fcf8e3 !default;
|
||||
|
||||
|
||||
// Tables
|
||||
//
|
||||
// Customizes the `.table` component with basic values, each used across all table variations.
|
||||
|
||||
$table-cell-padding: .75rem !default;
|
||||
$table-cell-padding-sm: .3rem !default;
|
||||
|
||||
$table-bg: transparent !default;
|
||||
$table-accent-bg: rgba($black,.05) !default;
|
||||
$table-hover-bg: rgba($black,.075) !default;
|
||||
$table-active-bg: $table-hover-bg !default;
|
||||
|
||||
$table-border-width: $border-width !default;
|
||||
$table-border-color: $gray-200 !default;
|
||||
|
||||
$table-head-bg: $gray-200 !default;
|
||||
$table-head-color: $gray-700 !default;
|
||||
|
||||
$table-inverse-bg: $gray-900 !default;
|
||||
$table-inverse-accent-bg: rgba($white, .05) !default;
|
||||
$table-inverse-hover-bg: rgba($white, .075) !default;
|
||||
$table-inverse-border-color: lighten($gray-900, 7.5%) !default;
|
||||
$table-inverse-color: $body-bg !default;
|
||||
|
||||
|
||||
// Buttons
|
||||
//
|
||||
// For each of Bootstrap's buttons, define text, background and border color.
|
||||
|
||||
$input-btn-padding-y: .5rem !default;
|
||||
$input-btn-padding-x: .75rem !default;
|
||||
$input-btn-line-height: 1.25 !default;
|
||||
|
||||
$input-btn-padding-y-sm: .25rem !default;
|
||||
$input-btn-padding-x-sm: .5rem !default;
|
||||
$input-btn-line-height-sm: 1.5 !default;
|
||||
|
||||
$input-btn-padding-y-lg: .5rem !default;
|
||||
$input-btn-padding-x-lg: 1rem !default;
|
||||
$input-btn-line-height-lg: 1.5 !default;
|
||||
|
||||
$btn-font-weight: $font-weight-normal !default;
|
||||
$btn-box-shadow: inset 0 1px 0 rgba($white,.15), 0 1px 1px rgba($black,.075) !default;
|
||||
$btn-focus-box-shadow: 0 0 0 3px rgba(theme-color("primary"), .25) !default;
|
||||
$btn-active-box-shadow: inset 0 3px 5px rgba($black,.125) !default;
|
||||
|
||||
$btn-link-disabled-color: $gray-600 !default;
|
||||
|
||||
$btn-block-spacing-y: .5rem !default;
|
||||
|
||||
// Allows for customizing button radius independently from global border radius
|
||||
$btn-border-radius: $border-radius !default;
|
||||
$btn-border-radius-lg: $border-radius-lg !default;
|
||||
$btn-border-radius-sm: $border-radius-sm !default;
|
||||
|
||||
$btn-transition: all .15s ease-in-out !default;
|
||||
|
||||
|
||||
// Forms
|
||||
|
||||
$input-bg: $white !default;
|
||||
$input-disabled-bg: $gray-200 !default;
|
||||
|
||||
$input-color: $gray-700 !default;
|
||||
$input-border-color: rgba($black,.15) !default;
|
||||
$input-btn-border-width: $border-width !default; // For form controls and buttons
|
||||
$input-box-shadow: inset 0 1px 1px rgba($black,.075) !default;
|
||||
|
||||
$input-border-radius: $border-radius !default;
|
||||
$input-border-radius-lg: $border-radius-lg !default;
|
||||
$input-border-radius-sm: $border-radius-sm !default;
|
||||
|
||||
$input-focus-bg: $input-bg !default;
|
||||
$input-focus-border-color: lighten(theme-color("primary"), 25%) !default;
|
||||
$input-focus-box-shadow: $input-box-shadow, $btn-focus-box-shadow !default;
|
||||
$input-focus-color: $input-color !default;
|
||||
|
||||
$input-placeholder-color: $gray-600 !default;
|
||||
|
||||
$input-height-border: $input-btn-border-width * 2 !default;
|
||||
|
||||
$input-height-inner: ($font-size-base * $input-btn-line-height) + ($input-btn-padding-y * 2) !default;
|
||||
$input-height: calc(#{$input-height-inner} + #{$input-height-border}) !default;
|
||||
|
||||
$input-height-inner-sm: ($font-size-sm * $input-btn-line-height-sm) + ($input-btn-padding-y-sm * 2) !default;
|
||||
$input-height-sm: calc(#{$input-height-inner-sm} + #{$input-height-border}) !default;
|
||||
|
||||
$input-height-inner-lg: ($font-size-sm * $input-btn-line-height-lg) + ($input-btn-padding-y-lg * 2) !default;
|
||||
$input-height-lg: calc(#{$input-height-inner-lg} + #{$input-height-border}) !default;
|
||||
|
||||
$input-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s !default;
|
||||
|
||||
$form-text-margin-top: .25rem !default;
|
||||
|
||||
$form-check-margin-bottom: .5rem !default;
|
||||
$form-check-input-gutter: 1.25rem !default;
|
||||
$form-check-input-margin-y: .25rem !default;
|
||||
$form-check-input-margin-x: .25rem !default;
|
||||
|
||||
$form-check-inline-margin-x: .75rem !default;
|
||||
|
||||
$form-group-margin-bottom: 1rem !default;
|
||||
|
||||
$input-group-addon-bg: $gray-200 !default;
|
||||
$input-group-addon-border-color: $input-border-color !default;
|
||||
|
||||
$custom-control-gutter: 1.5rem !default;
|
||||
$custom-control-spacer-y: .25rem !default;
|
||||
$custom-control-spacer-x: 1rem !default;
|
||||
|
||||
$custom-control-indicator-size: 1rem !default;
|
||||
$custom-control-indicator-bg: #ddd !default;
|
||||
$custom-control-indicator-bg-size: 50% 50% !default;
|
||||
$custom-control-indicator-box-shadow: inset 0 .25rem .25rem rgba($black,.1) !default;
|
||||
|
||||
$custom-control-indicator-disabled-bg: $gray-200 !default;
|
||||
$custom-control-description-disabled-color: $gray-600 !default;
|
||||
|
||||
$custom-control-indicator-checked-color: $white !default;
|
||||
$custom-control-indicator-checked-bg: theme-color("primary") !default;
|
||||
$custom-control-indicator-checked-box-shadow: none !default;
|
||||
|
||||
$custom-control-indicator-focus-box-shadow: 0 0 0 1px $body-bg, 0 0 0 3px theme-color("primary") !default;
|
||||
|
||||
$custom-control-indicator-active-color: $white !default;
|
||||
$custom-control-indicator-active-bg: lighten(theme-color("primary"), 35%) !default;
|
||||
$custom-control-indicator-active-box-shadow: none !default;
|
||||
|
||||
$custom-checkbox-indicator-border-radius: $border-radius !default;
|
||||
$custom-checkbox-indicator-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"), "#", "%23") !default;
|
||||
|
||||
$custom-checkbox-indicator-indeterminate-bg: theme-color("primary") !default;
|
||||
$custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color !default;
|
||||
$custom-checkbox-indicator-icon-indeterminate: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='#{$custom-checkbox-indicator-indeterminate-color}' d='M0 2h4'/%3E%3C/svg%3E"), "#", "%23") !default;
|
||||
$custom-checkbox-indicator-indeterminate-box-shadow: none !default;
|
||||
|
||||
$custom-radio-indicator-border-radius: 50% !default;
|
||||
$custom-radio-indicator-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='#{$custom-control-indicator-checked-color}'/%3E%3C/svg%3E"), "#", "%23") !default;
|
||||
|
||||
$custom-select-padding-y: .375rem !default;
|
||||
$custom-select-padding-x: .75rem !default;
|
||||
$custom-select-height: $input-height !default;
|
||||
$custom-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator
|
||||
$custom-select-line-height: $input-btn-line-height !default;
|
||||
$custom-select-color: $input-color !default;
|
||||
$custom-select-disabled-color: $gray-600 !default;
|
||||
$custom-select-bg: $white !default;
|
||||
$custom-select-disabled-bg: $gray-200 !default;
|
||||
$custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions
|
||||
$custom-select-indicator-color: #333 !default;
|
||||
$custom-select-indicator: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"), "#", "%23") !default;
|
||||
$custom-select-border-width: $input-btn-border-width !default;
|
||||
$custom-select-border-color: $input-border-color !default;
|
||||
$custom-select-border-radius: $border-radius !default;
|
||||
|
||||
$custom-select-focus-border-color: lighten(theme-color("primary"), 25%) !default;
|
||||
$custom-select-focus-box-shadow: inset 0 1px 2px rgba($black, .075), 0 0 5px rgba($custom-select-focus-border-color, .5) !default;
|
||||
|
||||
$custom-select-font-size-sm: 75% !default;
|
||||
$custom-select-height-sm: $input-height-sm !default;
|
||||
|
||||
$custom-file-height: 2.5rem !default;
|
||||
$custom-file-width: 14rem !default;
|
||||
$custom-file-focus-box-shadow: 0 0 0 .075rem $white, 0 0 0 .2rem theme-color("primary") !default;
|
||||
|
||||
$custom-file-padding-y: 1rem !default;
|
||||
$custom-file-padding-x: .5rem !default;
|
||||
$custom-file-line-height: 1.5 !default;
|
||||
$custom-file-color: $gray-700 !default;
|
||||
$custom-file-bg: $white !default;
|
||||
$custom-file-border-width: $border-width !default;
|
||||
$custom-file-border-color: $input-border-color !default;
|
||||
$custom-file-border-radius: $border-radius !default;
|
||||
$custom-file-box-shadow: inset 0 .2rem .4rem rgba($black,.05) !default;
|
||||
$custom-file-button-color: $custom-file-color !default;
|
||||
$custom-file-button-bg: $gray-200 !default;
|
||||
$custom-file-text: (
|
||||
placeholder: (
|
||||
en: "Choose file..."
|
||||
),
|
||||
button-label: (
|
||||
en: "Browse"
|
||||
)
|
||||
) !default;
|
||||
|
||||
|
||||
// Form validation
|
||||
$form-feedback-valid-color: theme-color("success") !default;
|
||||
$form-feedback-invalid-color: theme-color("danger") !default;
|
||||
|
||||
|
||||
// Dropdowns
|
||||
//
|
||||
// Dropdown menu container and contents.
|
||||
|
||||
$dropdown-min-width: 10rem !default;
|
||||
$dropdown-padding-y: .5rem !default;
|
||||
$dropdown-margin-top: .125rem !default;
|
||||
$dropdown-bg: $white !default;
|
||||
$dropdown-border-color: rgba($black,.15) !default;
|
||||
$dropdown-border-width: $border-width !default;
|
||||
$dropdown-divider-bg: $gray-200 !default;
|
||||
$dropdown-box-shadow: 0 .5rem 1rem rgba($black,.175) !default;
|
||||
|
||||
$dropdown-link-color: $gray-900 !default;
|
||||
$dropdown-link-hover-color: darken($gray-900, 5%) !default;
|
||||
$dropdown-link-hover-bg: $gray-100 !default;
|
||||
|
||||
$dropdown-link-active-color: $component-active-color !default;
|
||||
$dropdown-link-active-bg: $component-active-bg !default;
|
||||
|
||||
$dropdown-link-disabled-color: $gray-600 !default;
|
||||
|
||||
$dropdown-item-padding-y: .25rem !default;
|
||||
$dropdown-item-padding-x: 1.5rem !default;
|
||||
|
||||
$dropdown-header-color: $gray-600 !default;
|
||||
|
||||
|
||||
// Z-index master list
|
||||
//
|
||||
// Warning: Avoid customizing these values. They're used for a bird's eye view
|
||||
// of components dependent on the z-axis and are designed to all work together.
|
||||
|
||||
$zindex-dropdown: 1000 !default;
|
||||
$zindex-sticky: 1020 !default;
|
||||
$zindex-fixed: 1030 !default;
|
||||
$zindex-modal-backdrop: 1040 !default;
|
||||
$zindex-modal: 1050 !default;
|
||||
$zindex-popover: 1060 !default;
|
||||
$zindex-tooltip: 1070 !default;
|
||||
|
||||
// Navs
|
||||
|
||||
$nav-link-padding-y: .5rem !default;
|
||||
$nav-link-padding-x: 1rem !default;
|
||||
$nav-link-disabled-color: $gray-600 !default;
|
||||
|
||||
$nav-tabs-border-color: #ddd !default;
|
||||
$nav-tabs-border-width: $border-width !default;
|
||||
$nav-tabs-border-radius: $border-radius !default;
|
||||
$nav-tabs-link-hover-border-color: $gray-200 !default;
|
||||
$nav-tabs-link-active-color: $gray-700 !default;
|
||||
$nav-tabs-link-active-bg: $body-bg !default;
|
||||
$nav-tabs-link-active-border-color: #ddd !default;
|
||||
|
||||
$nav-pills-border-radius: $border-radius !default;
|
||||
$nav-pills-link-active-color: $component-active-color !default;
|
||||
$nav-pills-link-active-bg: $component-active-bg !default;
|
||||
|
||||
// Navbar
|
||||
|
||||
$navbar-padding-y: ($spacer / 2) !default;
|
||||
$navbar-padding-x: $spacer !default;
|
||||
|
||||
$navbar-brand-font-size: $font-size-lg !default;
|
||||
// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link
|
||||
$nav-link-height: $navbar-brand-font-size * $line-height-base !default;
|
||||
$navbar-brand-height: ($font-size-base * $line-height-base + $nav-link-padding-y * 2) !default;
|
||||
$navbar-brand-padding-y: ($navbar-brand-height - $nav-link-height) / 2 !default;
|
||||
|
||||
$navbar-toggler-padding-y: .25rem !default;
|
||||
$navbar-toggler-padding-x: .75rem !default;
|
||||
$navbar-toggler-font-size: $font-size-lg !default;
|
||||
$navbar-toggler-border-radius: $btn-border-radius !default;
|
||||
|
||||
$navbar-dark-color: rgba($white,.5) !default;
|
||||
$navbar-dark-hover-color: rgba($white,.75) !default;
|
||||
$navbar-dark-active-color: rgba($white,1) !default;
|
||||
$navbar-dark-disabled-color: rgba($white,.25) !default;
|
||||
$navbar-dark-toggler-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-dark-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"), "#", "%23") !default;
|
||||
$navbar-dark-toggler-border-color: rgba($white,.1) !default;
|
||||
|
||||
$navbar-light-color: rgba($black,.5) !default;
|
||||
$navbar-light-hover-color: rgba($black,.7) !default;
|
||||
$navbar-light-active-color: rgba($black,.9) !default;
|
||||
$navbar-light-disabled-color: rgba($black,.3) !default;
|
||||
$navbar-light-toggler-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-light-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"), "#", "%23") !default;
|
||||
$navbar-light-toggler-border-color: rgba($black,.1) !default;
|
||||
|
||||
// Pagination
|
||||
|
||||
$pagination-padding-y: .5rem !default;
|
||||
$pagination-padding-x: .75rem !default;
|
||||
$pagination-padding-y-sm: .25rem !default;
|
||||
$pagination-padding-x-sm: .5rem !default;
|
||||
$pagination-padding-y-lg: .75rem !default;
|
||||
$pagination-padding-x-lg: 1.5rem !default;
|
||||
$pagination-line-height: 1.25 !default;
|
||||
|
||||
$pagination-color: $link-color !default;
|
||||
$pagination-bg: $white !default;
|
||||
$pagination-border-width: $border-width !default;
|
||||
$pagination-border-color: #ddd !default;
|
||||
|
||||
$pagination-hover-color: $link-hover-color !default;
|
||||
$pagination-hover-bg: $gray-200 !default;
|
||||
$pagination-hover-border-color: #ddd !default;
|
||||
|
||||
$pagination-active-color: $white !default;
|
||||
$pagination-active-bg: theme-color("primary") !default;
|
||||
$pagination-active-border-color: theme-color("primary") !default;
|
||||
|
||||
$pagination-disabled-color: $gray-600 !default;
|
||||
$pagination-disabled-bg: $white !default;
|
||||
$pagination-disabled-border-color: #ddd !default;
|
||||
|
||||
|
||||
// Jumbotron
|
||||
|
||||
$jumbotron-padding: 2rem !default;
|
||||
$jumbotron-bg: $gray-200 !default;
|
||||
|
||||
|
||||
// Cards
|
||||
|
||||
$card-spacer-y: .75rem !default;
|
||||
$card-spacer-x: 1.25rem !default;
|
||||
$card-border-width: 1px !default;
|
||||
$card-border-radius: $border-radius !default;
|
||||
$card-border-color: rgba($black,.125) !default;
|
||||
$card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width}) !default;
|
||||
$card-cap-bg: rgba($black, .03) !default;
|
||||
$card-bg: $white !default;
|
||||
|
||||
$card-img-overlay-padding: 1.25rem !default;
|
||||
|
||||
$card-deck-margin: ($grid-gutter-width / 2) !default;
|
||||
|
||||
$card-columns-count: 3 !default;
|
||||
$card-columns-gap: 1.25rem !default;
|
||||
$card-columns-margin: $card-spacer-y !default;
|
||||
|
||||
|
||||
// Tooltips
|
||||
|
||||
$tooltip-max-width: 200px !default;
|
||||
$tooltip-color: $white !default;
|
||||
$tooltip-bg: $black !default;
|
||||
$tooltip-opacity: .9 !default;
|
||||
$tooltip-padding-y: 3px !default;
|
||||
$tooltip-padding-x: 8px !default;
|
||||
$tooltip-margin: 0 !default;
|
||||
|
||||
|
||||
$tooltip-arrow-width: 5px !default;
|
||||
$tooltip-arrow-height: 5px !default;
|
||||
$tooltip-arrow-color: $tooltip-bg !default;
|
||||
|
||||
|
||||
// Popovers
|
||||
|
||||
$popover-inner-padding: 1px !default;
|
||||
$popover-bg: $white !default;
|
||||
$popover-max-width: 276px !default;
|
||||
$popover-border-width: $border-width !default;
|
||||
$popover-border-color: rgba($black,.2) !default;
|
||||
$popover-box-shadow: 0 5px 10px rgba($black,.2) !default;
|
||||
|
||||
$popover-header-bg: darken($popover-bg, 3%) !default;
|
||||
$popover-header-color: $headings-color !default;
|
||||
$popover-header-padding-y: 8px !default;
|
||||
$popover-header-padding-x: 14px !default;
|
||||
|
||||
$popover-body-color: $body-color !default;
|
||||
$popover-body-padding-y: 9px !default;
|
||||
$popover-body-padding-x: 14px !default;
|
||||
|
||||
$popover-arrow-width: 10px !default;
|
||||
$popover-arrow-height: 5px !default;
|
||||
$popover-arrow-color: $popover-bg !default;
|
||||
|
||||
$popover-arrow-outer-width: ($popover-arrow-width + 1px) !default;
|
||||
$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;
|
||||
|
||||
|
||||
// Badges
|
||||
|
||||
$badge-color: $white !default;
|
||||
$badge-font-size: 75% !default;
|
||||
$badge-font-weight: $font-weight-bold !default;
|
||||
$badge-padding-y: .25em !default;
|
||||
$badge-padding-x: .4em !default;
|
||||
|
||||
$badge-pill-padding-x: .6em !default;
|
||||
// Use a higher than normal value to ensure completely rounded edges when
|
||||
// customizing padding or font-size on labels.
|
||||
$badge-pill-border-radius: 10rem !default;
|
||||
|
||||
|
||||
// Modals
|
||||
|
||||
// Padding applied to the modal body
|
||||
$modal-inner-padding: 15px !default;
|
||||
|
||||
$modal-dialog-margin: 10px !default;
|
||||
$modal-dialog-margin-y-sm-up: 30px !default;
|
||||
|
||||
$modal-title-line-height: $line-height-base !default;
|
||||
|
||||
$modal-content-bg: $white !default;
|
||||
$modal-content-border-color: rgba($black,.2) !default;
|
||||
$modal-content-border-width: $border-width !default;
|
||||
$modal-content-box-shadow-xs: 0 3px 9px rgba($black,.5) !default;
|
||||
$modal-content-box-shadow-sm-up: 0 5px 15px rgba($black,.5) !default;
|
||||
|
||||
$modal-backdrop-bg: $black !default;
|
||||
$modal-backdrop-opacity: .5 !default;
|
||||
$modal-header-border-color: $gray-200 !default;
|
||||
$modal-footer-border-color: $modal-header-border-color !default;
|
||||
$modal-header-border-width: $modal-content-border-width !default;
|
||||
$modal-footer-border-width: $modal-header-border-width !default;
|
||||
$modal-header-padding: 15px !default;
|
||||
|
||||
$modal-lg: 800px !default;
|
||||
$modal-md: 500px !default;
|
||||
$modal-sm: 300px !default;
|
||||
|
||||
$modal-transition: transform .3s ease-out !default;
|
||||
|
||||
|
||||
// Alerts
|
||||
//
|
||||
// Define alert colors, border radius, and padding.
|
||||
|
||||
$alert-padding-y: .75rem !default;
|
||||
$alert-padding-x: 1.25rem !default;
|
||||
$alert-margin-bottom: 1rem !default;
|
||||
$alert-border-radius: $border-radius !default;
|
||||
$alert-link-font-weight: $font-weight-bold !default;
|
||||
$alert-border-width: $border-width !default;
|
||||
|
||||
|
||||
// Progress bars
|
||||
|
||||
$progress-height: 1rem !default;
|
||||
$progress-font-size: .75rem !default;
|
||||
$progress-bg: $gray-200 !default;
|
||||
$progress-border-radius: $border-radius !default;
|
||||
$progress-box-shadow: inset 0 .1rem .1rem rgba($black,.1) !default;
|
||||
$progress-bar-color: $white !default;
|
||||
$progress-bar-bg: theme-color("primary") !default;
|
||||
$progress-bar-animation-timing: 1s linear infinite !default;
|
||||
$progress-bar-transition: width .6s ease !default;
|
||||
|
||||
// List group
|
||||
|
||||
$list-group-bg: $white !default;
|
||||
$list-group-border-color: rgba($black,.125) !default;
|
||||
$list-group-border-width: $border-width !default;
|
||||
$list-group-border-radius: $border-radius !default;
|
||||
|
||||
$list-group-item-padding-y: .75rem !default;
|
||||
$list-group-item-padding-x: 1.25rem !default;
|
||||
|
||||
$list-group-hover-bg: $gray-100 !default;
|
||||
$list-group-active-color: $component-active-color !default;
|
||||
$list-group-active-bg: $component-active-bg !default;
|
||||
$list-group-active-border-color: $list-group-active-bg !default;
|
||||
|
||||
$list-group-disabled-color: $gray-600 !default;
|
||||
$list-group-disabled-bg: $list-group-bg !default;
|
||||
|
||||
$list-group-action-color: $gray-700 !default;
|
||||
$list-group-action-hover-color: $list-group-action-color !default;
|
||||
|
||||
$list-group-action-active-color: $body-color !default;
|
||||
$list-group-action-active-bg: $gray-200 !default;
|
||||
|
||||
|
||||
// Image thumbnails
|
||||
|
||||
$thumbnail-padding: .25rem !default;
|
||||
$thumbnail-bg: $body-bg !default;
|
||||
$thumbnail-border-width: $border-width !default;
|
||||
$thumbnail-border-color: #ddd !default;
|
||||
$thumbnail-border-radius: $border-radius !default;
|
||||
$thumbnail-box-shadow: 0 1px 2px rgba($black,.075) !default;
|
||||
$thumbnail-transition: all .2s ease-in-out !default;
|
||||
|
||||
|
||||
// Figures
|
||||
|
||||
$figure-caption-font-size: 90% !default;
|
||||
$figure-caption-color: $gray-600 !default;
|
||||
|
||||
|
||||
// Breadcrumbs
|
||||
|
||||
$breadcrumb-padding-y: .75rem !default;
|
||||
$breadcrumb-padding-x: 1rem !default;
|
||||
$breadcrumb-item-padding: .5rem !default;
|
||||
|
||||
$breadcrumb-bg: $gray-200 !default;
|
||||
$breadcrumb-divider-color: $gray-600 !default;
|
||||
$breadcrumb-active-color: $gray-600 !default;
|
||||
$breadcrumb-divider: "/" !default;
|
||||
|
||||
|
||||
// Carousel
|
||||
|
||||
$carousel-control-color: $white !default;
|
||||
$carousel-control-width: 15% !default;
|
||||
$carousel-control-opacity: .5 !default;
|
||||
|
||||
$carousel-indicator-width: 30px !default;
|
||||
$carousel-indicator-height: 3px !default;
|
||||
$carousel-indicator-spacer: 3px !default;
|
||||
$carousel-indicator-active-bg: $white !default;
|
||||
|
||||
$carousel-caption-width: 70% !default;
|
||||
$carousel-caption-color: $white !default;
|
||||
|
||||
$carousel-control-icon-width: 20px !default;
|
||||
|
||||
$carousel-control-prev-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3E%3Cpath d='M4 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E"), "#", "%23") !default;
|
||||
$carousel-control-next-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3E%3Cpath d='M1.5 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E"), "#", "%23") !default;
|
||||
|
||||
$carousel-transition: transform .6s ease !default;
|
||||
|
||||
|
||||
// Close
|
||||
|
||||
$close-font-size: $font-size-base * 1.5 !default;
|
||||
$close-font-weight: $font-weight-bold !default;
|
||||
$close-color: $black !default;
|
||||
$close-text-shadow: 0 1px 0 $white !default;
|
||||
|
||||
// Code
|
||||
|
||||
$code-font-size: 90% !default;
|
||||
$code-padding-y: .2rem !default;
|
||||
$code-padding-x: .4rem !default;
|
||||
$code-color: #bd4147 !default;
|
||||
$code-bg: $gray-100 !default;
|
||||
|
||||
$kbd-color: $white !default;
|
||||
$kbd-bg: $gray-900 !default;
|
||||
|
||||
$pre-color: $gray-900 !default;
|
||||
$pre-scrollable-max-height: 340px !default;
|
||||
211
html/sass/mdb/free/data/_variables.scss
Executable file
211
html/sass/mdb/free/data/_variables.scss
Executable file
@@ -0,0 +1,211 @@
|
||||
// Fonts Path
|
||||
$roboto-font-path: "../font/roboto/" !default;
|
||||
|
||||
// Full Palette
|
||||
$enable_full_palette: true;
|
||||
|
||||
// $btn-floating-icon-margin: 5px;
|
||||
|
||||
//Tabs
|
||||
$tabs-padding: 0.7rem;
|
||||
$tabs-margin-x: 1rem;
|
||||
$tabs-margin-y: -20px;
|
||||
$pills-padding: 0.6rem;
|
||||
|
||||
// Spacers
|
||||
$spacer: 1rem !default;
|
||||
$spacer-x: $spacer !default;
|
||||
$spacer-y: $spacer !default;
|
||||
$spacers: (
|
||||
0: 0,
|
||||
1: ($spacer * .25),
|
||||
2: ($spacer * .5),
|
||||
3: $spacer,
|
||||
4: ($spacer * 1.5),
|
||||
5: ($spacer * 3),
|
||||
6: ($spacer * 5)
|
||||
) !default;
|
||||
|
||||
|
||||
// Extreme Padding
|
||||
$extreme-padding: (
|
||||
"xs": 0,
|
||||
"sm": 5%,
|
||||
"md": 10%,
|
||||
"lg": 15%,
|
||||
"xl": 20%
|
||||
);
|
||||
|
||||
// Navbar
|
||||
$font-weight: 300;
|
||||
|
||||
$navbar-light-toggler-icon: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.9)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !default;
|
||||
$navbar-light-bg-active-color: rgba($black, .1) !default;
|
||||
$navbar-light-hover-color: rgba($black, .75);
|
||||
|
||||
$navbar-dark-toggler-icon: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.9)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !default;
|
||||
$navbar-dark-bg-active-color: rgba($white, .1) !default;
|
||||
$navbar-dark-hover-color: rgba($white, .75);
|
||||
|
||||
$navbar-scrolling-padding: 12px;
|
||||
$navbar-top-collapse-padding: 5px;
|
||||
$navbar-flex-icons-padding-md: 6px;
|
||||
$navbar-flex-icons-padding-lg: 3px;
|
||||
$navbar-form-input-mr: 5px;
|
||||
$navbar-form-input-mb: 1px;
|
||||
$navbar-form-input-ml: 8px;
|
||||
$navbar-form-input-height: 1rem;
|
||||
$navbar-dropdown-font-size: 0.9375rem;
|
||||
$navbar-dropdown-menu-padding: 10px;
|
||||
$navbar-padding-dropdown: 1rem;
|
||||
$navbar-avatar-height: 35px;
|
||||
$navbar-double-small-padding: 4px;
|
||||
$navbar-double-font-size: 15px;
|
||||
$navbar-breadcrumb-dn-padding: 1rem;
|
||||
// $navbar-button-collapse-top: 1px;
|
||||
$navbar-button-collapse-left: 10px;
|
||||
$navbar-button-collapse-font-size: 1.5rem;
|
||||
$navbar-button-collapse-fs-sm: 1.4rem;
|
||||
$navbar-button-collapse-mx: 10px;
|
||||
// $navbar-button-collapse-mt: 1px;
|
||||
|
||||
//Dropdown
|
||||
$dropdown-menu-padding: 0.5rem;
|
||||
$dropdown-item-padding: 1rem;
|
||||
|
||||
// Badges
|
||||
$badge-pill-padding-x: 0.6rem !default;
|
||||
$badge-pill-border-radius: 10rem !default;
|
||||
|
||||
// Progress
|
||||
$progress-bar-height: 4px;
|
||||
$progress-bar-wider-height: 20px;
|
||||
$progress-bar-narrower-height: 1px;
|
||||
$progress-bar-margin-y: 1rem;
|
||||
$progress-bar-bg-color: map-get($grey, lighten-3);
|
||||
|
||||
// Forms
|
||||
// Text Inputs + Textarea
|
||||
$input-border-color: map-get($grey, "lighten-1");
|
||||
$input-focus-color: $primary-color;
|
||||
$input-font-size: 1rem;
|
||||
$form-control-margin: 0.5rem;
|
||||
$form-control-border-color: $primary-color;
|
||||
// TODO
|
||||
$input-disabled-color: rgba(0,0,0, .46) !default;
|
||||
$input-disabled-solid-color: $primary-color !default;
|
||||
|
||||
// Radio Buttons
|
||||
$radio-fill-color: $primary-color !default;
|
||||
$radio-empty-color: #5a5a5a !default;
|
||||
|
||||
// Dropdown
|
||||
$dropdown-bg-color: #fff !default;
|
||||
$dropdown-hover-bg-color: #eee !default;
|
||||
$dropdown-color: $primary-color !default;
|
||||
$dropdown-item-height: 40px !default;
|
||||
|
||||
// Inputs
|
||||
$input-bg-color: #fff !default;
|
||||
$input-error-color: $error-color !default;
|
||||
$input-success-color: $success-color !default;
|
||||
$input-focus-color: $primary-color !default;
|
||||
$label-font-size: .8rem !default;
|
||||
$input-disabled-color: rgba(0,0,0, .46) !default;
|
||||
// $input-disabled-solid-color: $primary-color !default; //trochę dziwny kolor był tutaj wpisany dlatego zamieniłem
|
||||
$input-disabled-solid-color: #BDBDBD;
|
||||
|
||||
// Table
|
||||
$product-table-img-max-height: 150px;
|
||||
$product-table-img-min-width: 50px;
|
||||
$table-inverse-color-border: $white !default;
|
||||
|
||||
// Footer
|
||||
$footer-margin-top: 20px;
|
||||
$footer-padding-top: 20px;
|
||||
$footer-copyright-height: 50px;
|
||||
$footer-copyright-line-height: 50px;
|
||||
$footer-call-to-action-pt: 1.3rem;
|
||||
$footer-call-to-action-pb: 0.5rem;
|
||||
$footer-call-to-action-pr: 10px;
|
||||
$footer-insta-photos-max-width: 100px;
|
||||
$footer-insta-photos-margin: 4px;
|
||||
|
||||
// Images Path
|
||||
$image-path: '../img/';
|
||||
|
||||
// Reponsive Headings
|
||||
$responsive-headings: (
|
||||
"xs": (
|
||||
"h1": 150%,
|
||||
"h2": 145%,
|
||||
"h3": 135%,
|
||||
"h4": 135%,
|
||||
"h5": 135%
|
||||
),
|
||||
"sm": (
|
||||
"h1": 170%,
|
||||
"h2": 140%,
|
||||
"h3": 125%,
|
||||
"h4": 125%,
|
||||
"h5": 125%
|
||||
),
|
||||
"md": (
|
||||
"h1": 200%,
|
||||
"h2": 170%,
|
||||
"h3": 140%,
|
||||
"h4": 125%,
|
||||
"h5": 125%
|
||||
),
|
||||
"lg": (
|
||||
"h1": 200%,
|
||||
"h2": 170%,
|
||||
"h3": 140%,
|
||||
"h4": 125%,
|
||||
"h5": 125%
|
||||
),
|
||||
"xl": (
|
||||
"h1": 250%,
|
||||
"h2": 200%,
|
||||
"h3": 170%,
|
||||
"h4": 140%,
|
||||
"h5": 125%
|
||||
),
|
||||
);
|
||||
|
||||
/*** Global ***/
|
||||
// Media Query Ranges
|
||||
$small-screen-up: 601px !default;
|
||||
$medium-screen-up: 993px !default;
|
||||
$large-screen-up: 1201px !default;
|
||||
$small-screen: 600px !default;
|
||||
$medium-screen: 992px !default;
|
||||
$large-screen: 1200px !default;
|
||||
$sidenav-breakpoint: 1440px !default;
|
||||
|
||||
$medium-and-up: "only screen and (min-width : #{$small-screen-up})" !default;
|
||||
$large-and-up: "only screen and (min-width : #{$medium-screen-up})" !default;
|
||||
$small-and-down: "only screen and (max-width : #{$small-screen})" !default;
|
||||
$medium-and-down: "only screen and (max-width : #{$medium-screen})" !default;
|
||||
$medium-only: "only screen and (min-width : #{$small-screen-up}) and (max-width : #{$medium-screen})" !default;
|
||||
$hide-sidenav: "only screen and (max-width : #{$sidenav-breakpoint})" !default;
|
||||
|
||||
// Link color
|
||||
$link-color: #0275d8;
|
||||
|
||||
$navbar-option: (
|
||||
"light": (
|
||||
"navbar-toggler-icon": $navbar-light-toggler-icon,
|
||||
"navbar-option-color": $black,
|
||||
"navbar-link-hover-color": $navbar-light-hover-color,
|
||||
"navbar-active-link-bg-color": $navbar-light-bg-active-color,
|
||||
"navbar-placeholder-color": $black !important
|
||||
),
|
||||
"dark": (
|
||||
"navbar-toggler-icon": $navbar-dark-toggler-icon,
|
||||
"navbar-option-color": $white,
|
||||
"navbar-link-hover-color": $navbar-dark-hover-color,
|
||||
"navbar-active-link-bg-color": $navbar-dark-bg-active-color,
|
||||
"navbar-placeholder-color": $white !important
|
||||
)
|
||||
);
|
||||
Reference in New Issue
Block a user