deblan-mirror/papercss
1
0
Fork 0
mirror of https://github.com/papercss/papercss synced 2024-06-08 17:02:14 +02:00
Code Issues Projects Releases Wiki Activity

chore: use color mixin in alerts

Browse source
This commit is contained in:
Seifeldin Mahjoub 2020-08-26 00:35:20 +02:00
parent 688f27d959
commit 415dca3d75
1 changed files with 9 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
src/components/_alerts.scss
View file

@ -1,16 +1,17 @@
@mixin btn-close-color($base-color) { @mixin btn-close-color($base-color-name) {
color: lighten($base-color, 10%); @include color('color', #{$base-color-name}-light-10);
&:hover, &:hover,
&:active, &:active,
&:focus { &:focus {
color: darken($base-color, 10%); @include color('color', #{$base-color-name}-dark-10)
} }
} }
.alert { .alert {
@include color('border-color', 'primary');
@include border-style(); @include border-style();
border: 2px solid $primary; border-style: solid;
border-width: 2px;
margin-bottom: 20px; margin-bottom: 20px;
padding: 15px; padding: 15px;
width: 100%; width: 100%;
@ -33,9 +34,9 @@
@each $colorName, $color, $color-light in $colors { @each $colorName, $color, $color-light in $colors {
.alert-#{$colorName} { .alert-#{$colorName} {
background-color: $color-light; @include color('color', #{$colorName}-text);
border-color: $color; @include color('background-color', #{$colorName}-light);
color: $color; @include color('border-color', #{$colorName});
.btn-close { .btn-close {
@include btn-close-color($color); @include btn-close-color($color);