153 lines
3.0 KiB
SCSS
153 lines
3.0 KiB
SCSS
// Globals
|
|
// Full palette of colors
|
|
@each $color_name, $color in $mdb-colors-1 {
|
|
@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;
|
|
}
|
|
.rgba-#{$color_name}-slight,
|
|
.rgba-#{$color_name}-slight:after {
|
|
background-color: rgba($color_value, .1);
|
|
}
|
|
.rgba-#{$color_name}-light,
|
|
.rgba-#{$color_name}-light:after {
|
|
background-color: rgba($color_value, .3);
|
|
}
|
|
.rgba-#{$color_name}-strong,
|
|
.rgba-#{$color_name}-strong:after {
|
|
background-color: rgba($color_value, .7);
|
|
}
|
|
}
|
|
@else {
|
|
@if $enable_full_palette {
|
|
.#{$color_name}.#{$color_type} {
|
|
background-color: $color_value !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Stylish color
|
|
@each $color_name, $color_value in $stylish-rgba {
|
|
.#{$color_name} {
|
|
background-color: $color_value;
|
|
}
|
|
}
|
|
|
|
// Material colors palette
|
|
@each $color_name, $color in $material-colors {
|
|
.#{$color_name} {
|
|
background-color: $color !important;
|
|
}
|
|
}
|
|
|
|
// Basic gradients
|
|
@each $name, $val in $gradients {
|
|
@include make-gradient($name, $val);
|
|
}
|
|
@each $name, $val in $gradients-rgba {
|
|
@include make-gradient-rgba($name, $val);
|
|
}
|
|
|
|
.dark-grey-text {
|
|
color: #4f4f4f !important;
|
|
&:hover,
|
|
&:focus {
|
|
color: #4f4f4f !important;
|
|
}
|
|
}
|
|
|
|
// Shadow on hover
|
|
.hoverable {
|
|
box-shadow: none;
|
|
transition: $transition-hoverable;
|
|
&:hover {
|
|
box-shadow: $z-depth-2;
|
|
transition: $transition-hoverable;
|
|
}
|
|
}
|
|
|
|
// Shadows
|
|
.z-depth-0 {
|
|
box-shadow: none !important;
|
|
}
|
|
.z-depth-1 {
|
|
box-shadow: $z-depth-1 !important;
|
|
}
|
|
.z-depth-1-half {
|
|
box-shadow: $z-depth-1-half !important;
|
|
}
|
|
.z-depth-2 {
|
|
box-shadow: $z-depth-2 !important;
|
|
}
|
|
.z-depth-3 {
|
|
box-shadow: $z-depth-3 !important;
|
|
}
|
|
.z-depth-4 {
|
|
box-shadow: $z-depth-4 !important;
|
|
}
|
|
.z-depth-5 {
|
|
box-shadow: $z-depth-5 !important;
|
|
}
|
|
|
|
// Disabled cursor
|
|
.disabled,
|
|
:disabled {
|
|
pointer-events: none !important;
|
|
}
|
|
|
|
// Links
|
|
a {
|
|
cursor: pointer;
|
|
text-decoration: none;
|
|
color: $link-color;
|
|
transition: $transition-basic;
|
|
&:hover {
|
|
text-decoration: none;
|
|
color: $link-hover-color;
|
|
transition: $transition-basic;
|
|
}
|
|
&.disabled,
|
|
&:disabled {
|
|
&:hover {
|
|
color: $link-color;
|
|
}
|
|
}
|
|
}
|
|
|
|
a:not([href]):not([tabindex]), a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {
|
|
color: inherit;
|
|
text-decoration: none;
|
|
}
|
|
|
|
// Divider
|
|
.divider-new {
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
align-items: center;
|
|
display: flex;
|
|
margin-top: $divider-margin-y;
|
|
margin-bottom: $divider-margin-y;
|
|
> h1, h2, h3, h4, h5, h6 {
|
|
margin-bottom: 0;
|
|
}
|
|
&:before,
|
|
&:after {
|
|
content: "";
|
|
height: 1.5px;
|
|
flex: 1;
|
|
height: $divider-height;
|
|
background: #c6c6c6;
|
|
}
|
|
&:before {
|
|
margin: 0 $divider-margin-x 0 0;
|
|
}
|
|
&:after {
|
|
margin: 0 0 0 $divider-margin-x;
|
|
}
|
|
} |