mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2025-07-17 11:42:32 +03:00
navbar variations converted
This commit is contained in:
parent
7f940586d9
commit
ca93368247
10
Gruntfile.js
10
Gruntfile.js
|
@ -56,7 +56,15 @@ module.exports = function(grunt) {
|
||||||
pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)background-image[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
|
pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)background-image[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
|
||||||
replacement: '@include bg-img-variations(unquote($1), $2);\n',
|
replacement: '@include bg-img-variations(unquote($1), $2);\n',
|
||||||
order: 23
|
order: 23
|
||||||
} ]
|
},
|
||||||
|
|
||||||
|
// navbar generic-variations
|
||||||
|
{ // Multi-line replacement - https://regex101.com/r/lX1hH1/1
|
||||||
|
pattern: /.generic-variations\(unquote\((".navbar")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
|
||||||
|
replacement: '@include navbar-variations(unquote($1), $2);\n',
|
||||||
|
order: 24
|
||||||
|
},
|
||||||
|
]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
// This file is NOT automatically converted and must be manually merged
|
||||||
@import 'mixins-shared';
|
@import 'mixins-shared';
|
||||||
|
|
||||||
@mixin generic-variations-colors($args) {
|
@mixin generic-variations-colors($args) {
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
|
// This file is NOT automatically converted and must be manually merged
|
||||||
|
|
||||||
// variations(unquote(""), background-color, #FFF);
|
// variations(unquote(""), background-color, #FFF);
|
||||||
@mixin variations($extra, $material-param-1, $default) {
|
@mixin variations($extra, $material-param-1, $default) {
|
||||||
@include generic-variations($extra, $default, "variations-content", $material-param-1);
|
@include generic-variations($extra, $default, "variations-content", $material-param-1);
|
||||||
|
@ -74,6 +76,42 @@
|
||||||
background-image: linear-gradient($material-color, $material-color), linear-gradient($input-underline-color, $input-underline-color);
|
background-image: linear-gradient($material-color, $material-color), linear-gradient($input-underline-color, $input-underline-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// navbar-variations(" label input[type=checkbox]:checked + .toggle:active:after", $primary
|
||||||
|
@mixin navbar-variations($extra, $default) {
|
||||||
|
@include generic-variations($extra, $default, "navbar-variations-content", null);
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin navbar-variations-content($args){
|
||||||
|
$material-color: map-get($args, material-color);
|
||||||
|
$material-text-color: map-get($args, material-text-color);
|
||||||
|
|
||||||
|
background-color: $material-color;
|
||||||
|
color: $material-text-color;
|
||||||
|
// deeply defined to override welljumbo class without !impotant need
|
||||||
|
.navbar-form .form-control-wrapper input.form-control::placeholder, .navbar-form input.form-control::placeholder {
|
||||||
|
color: $material-text-color;
|
||||||
|
}
|
||||||
|
.dropdown-menu {
|
||||||
|
border-radius: $dropdown-radius;
|
||||||
|
li > a {
|
||||||
|
font-size: $dropdown-font-size;
|
||||||
|
padding: 13px 16px;
|
||||||
|
&:hover,
|
||||||
|
&:focus {
|
||||||
|
color: $material-color;
|
||||||
|
background-color: $grey-200;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.active > a {
|
||||||
|
&:hover,
|
||||||
|
&:focus {
|
||||||
|
color: $material-text-color;
|
||||||
|
}
|
||||||
|
background-color: $material-color;
|
||||||
|
color: $material-text-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// interpolation of mixin-name is not allowed evidently, so we statically include based on the mixin-name given
|
// interpolation of mixin-name is not allowed evidently, so we statically include based on the mixin-name given
|
||||||
@mixin call-variations-content-mixin($args) {
|
@mixin call-variations-content-mixin($args) {
|
||||||
|
@ -92,6 +130,8 @@
|
||||||
@include bg-box-shadow-variations-content($args);
|
@include bg-box-shadow-variations-content($args);
|
||||||
} @else if $mixin-name == bg-img-variations-content {
|
} @else if $mixin-name == bg-img-variations-content {
|
||||||
@include bg-img-variations-content($args);
|
@include bg-img-variations-content($args);
|
||||||
|
} @else if $mixin-name == navbar-variations-content {
|
||||||
|
@include navbar-variations-content($args);
|
||||||
} @else {
|
} @else {
|
||||||
@error "Unknown mixin: #{$mixin-name}"
|
@error "Unknown mixin: #{$mixin-name}"
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
// This file is NOT automatically converted and must be manually merged
|
||||||
@import 'mixins-shared';
|
@import 'mixins-shared';
|
||||||
|
|
||||||
@mixin generic-variations-colors($args) {
|
@mixin generic-variations-colors($args) {
|
||||||
|
|
|
@ -166,34 +166,7 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.generic-variations(unquote(".navbar"), $primary, {
|
@include navbar-variations(unquote(".navbar"), $primary);
|
||||||
background-color: $material-color;
|
|
||||||
color: $material-text-color;
|
|
||||||
// deeply defined to override welljumbo class without !impotant need
|
|
||||||
.navbar-form .form-control-wrapper input.form-control::placeholder, .navbar-form input.form-control::placeholder {
|
|
||||||
color: $material-text-color;
|
|
||||||
}
|
|
||||||
.dropdown-menu {
|
|
||||||
border-radius: $dropdown-radius;
|
|
||||||
li > a {
|
|
||||||
font-size: $dropdown-font-size;
|
|
||||||
padding: 13px 16px;
|
|
||||||
&:hover,
|
|
||||||
&:focus {
|
|
||||||
color: $material-color;
|
|
||||||
background-color: $grey-200;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.active > a {
|
|
||||||
&:hover,
|
|
||||||
&:focus {
|
|
||||||
color: $material-text-color;
|
|
||||||
}
|
|
||||||
background-color: $material-color;
|
|
||||||
color: $material-text-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
&-inverse {
|
&-inverse {
|
||||||
background-color: $indigo;
|
background-color: $indigo;
|
||||||
|
|
Loading…
Reference in New Issue
Block a user