@@ -72,17 +72,63 @@ a.text-muted:hover {
7272
7373// Gradient Background colors (theme colors)
7474@each $name , $color in $theme-colors {
75- .bg-#{$name } -gradient {
76- @include gradient-bg ( $color );
75+ .bg-gradient- #{$name } {
76+ @include bg- gradient-variant ( ' & ' , $color );
7777 color : color-yiq ($color );
78+
79+ & .btn {
80+ & .disabled ,
81+ & :disabled ,
82+ & :not (:disabled ):not (.disabled ):active ,
83+ & :not (:disabled ):not (.disabled ).active ,
84+ .show > & .dropdown-toggle {
85+ background-image : none !important ;
86+ }
87+
88+ & :hover {
89+ color : color-yiq (darken ($color , 7.5% ));
90+ @include bg-gradient-variant (' &' , darken ($color , 7.5% ));
91+ border-color : darken ($color , 10% );
92+ }
93+
94+ & :active ,
95+ & .active {
96+ color : color-yiq (darken ($color , 10% ));
97+ @include bg-gradient-variant (' &' , darken ($color , 10% ));
98+ border-color : darken ($color , 12.5% );
99+ }
100+ }
78101 }
79102}
80103
81104// Gradient Background colors (colors)
82105@each $name , $color in $colors {
83- .bg-#{$name } -gradient {
84- @include gradient-bg ( $color );
106+ .bg-gradient- #{$name } {
107+ @include bg- gradient-variant ( ' & ' , $color );
85108 color : color-yiq ($color );
109+
110+ & .btn {
111+ & .disabled ,
112+ & :disabled ,
113+ & :not (:disabled ):not (.disabled ):active ,
114+ & :not (:disabled ):not (.disabled ).active ,
115+ .show > & .dropdown-toggle {
116+ background-image : none !important ;
117+ }
118+
119+ & :hover {
120+ color : color-yiq (darken ($color , 7.5% ));
121+ @include bg-gradient-variant (' &' , darken ($color , 7.5% ));
122+ border-color : darken ($color , 10% );
123+ }
124+
125+ & :active ,
126+ & .active {
127+ color : color-yiq (darken ($color , 10% ));
128+ @include bg-gradient-variant (' &' , darken ($color , 10% ));
129+ border-color : darken ($color , 12.5% );
130+ }
131+ }
86132 }
87133}
88134
0 commit comments