mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2024-11-27 03:54:13 +03:00
fixed bg-box-shadow variations
This commit is contained in:
parent
12dbc8d160
commit
f9f761b0eb
|
@ -42,8 +42,14 @@ module.exports = function(grunt) {
|
|||
pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)background-color[\s\S]+?(?!\r|\n)(\(\d+\/\d+\))[\s\S]+?(?!\r|\n)}\);$\n/mg,
|
||||
replacement: '@include bg-color-variations(unquote($1), $2, $3);\n',
|
||||
order: 21
|
||||
}
|
||||
},
|
||||
|
||||
// bg-box-shadow generic-variations
|
||||
{ // Multi-line replacement - https://regex101.com/r/jW8kR1/1
|
||||
pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)box-shadow[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
|
||||
replacement: '@include bg-box-shadow-variations(unquote($1), $2);\n',
|
||||
order: 22
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,3 +1,11 @@
|
|||
@mixin btn-shadow(){
|
||||
@extend .shadow-z-1;
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
&:active:not(.btn-link) {
|
||||
@extend .shadow-z-1-hover;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
position: relative;
|
||||
padding: 8px 30px;
|
||||
|
@ -127,11 +135,3 @@
|
|||
.btn-group-flat {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
@mixin btn-shadow(){
|
||||
@extend .shadow-z-1;
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
&:active:not(.btn-link) {
|
||||
@extend .shadow-z-1-hover;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -54,6 +54,17 @@
|
|||
background-color: rgba(map-get($args, material-color), map-get($args, material-param-1));
|
||||
}
|
||||
|
||||
// bg-box-shadow-variations(" label input[type=checkbox]:checked + .toggle:active:after", $primary
|
||||
@mixin bg-box-shadow-variations($extra, $default) {
|
||||
@include generic-variations($extra, $default, "bg-box-shadow-variations-content", null);
|
||||
}
|
||||
|
||||
@mixin bg-box-shadow-variations-content($args){
|
||||
$material-color: map-get($args, material-color);
|
||||
box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4), 0 0 0 15px rgba($material-color, (10/100));
|
||||
}
|
||||
|
||||
|
||||
// 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-name: map-get($args, mixin-name);
|
||||
|
@ -67,6 +78,8 @@
|
|||
@include button-variations-content($args);
|
||||
} @else if $mixin-name == bg-color-variations-content {
|
||||
@include bg-color-variations-content($args);
|
||||
} @else if $mixin-name == bg-box-shadow-variations-content {
|
||||
@include bg-box-shadow-variations-content($args);
|
||||
} @else {
|
||||
@error "Unknown mixin: #{$mixin-name}"
|
||||
}
|
||||
|
|
|
@ -59,7 +59,5 @@
|
|||
// Handle on
|
||||
@include variations(unquote(" label input[type=checkbox]:checked + .toggle:after"), background-color, $primary);
|
||||
// Ripple on
|
||||
.generic-variations(unquote(" label input[type=checkbox]:checked + .toggle:active:after"), $primary, {
|
||||
box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4), 0 0 0 15px rgba($material-color, (10/100));
|
||||
});
|
||||
@include bg-box-shadow-variations(unquote(" label input[type=checkbox]:checked + .toggle:active:after"), $primary);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue
Block a user