github
/
AdminLTE
mirror of https://github.com/ColorlibHQ/AdminLTE
1
0
Fork 0
Code Issues Releases Wiki Activity

Be explicit with the background color property (#2834)

pull/2837/head
XhmikosR 2020-06-13 13:22:58 +03:00 committed by GitHub
parent fffb131305
commit bce97813d6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
24 changed files with 73 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
build/scss/_alerts.scss
View File

@ -26,7 +26,7 @@
@each $color, $value in $theme-colors { @each $color, $value in $theme-colors {
.alert-#{$color} { .alert-#{$color} {
color: color-yiq($value); color: color-yiq($value);
background: $value; background-color: $value;
border-color: darken($value, 5%); border-color: darken($value, 5%);
} }

4
build/scss/_buttons.scss
View File

@ -21,7 +21,7 @@
position: relative; position: relative;
> input[type="file"] { > input[type="file"] {
background: $white; background-color: $white;
cursor: inherit; cursor: inherit;
display: block; display: block;
font-size: 100px; font-size: 100px;
@ -80,7 +80,7 @@
} }
&:hover { &:hover {
background: $button-default-background-color; background-color: $button-default-background-color;
border-color: darken($button-default-border-color, 20%); border-color: darken($button-default-border-color, 20%);
color: $button-default-color; color: $button-default-color;
} }

8
build/scss/_cards.scss
View File

@ -251,7 +251,7 @@ html.maximized-card {
// Box Tools Buttons // Box Tools Buttons
.btn-tool { .btn-tool {
background: transparent; background-color: transparent;
color: $gray-500; color: $gray-500;
font-size: $font-size-sm; font-size: $font-size-sm;
margin: -(($card-spacer-y / 2) * 2) 0; margin: -(($card-spacer-y / 2) * 2) 0;
@ -323,7 +323,7 @@ html.maximized-card {
// Comment Box // Comment Box
.card-comments { .card-comments {
background: $gray-100; background-color: $gray-100;
.card-comment { .card-comment {
@include clearfix (); @include clearfix ();
@ -375,7 +375,7 @@ html.maximized-card {
// Todo list element // Todo list element
> li { > li {
@include border-radius(2px); @include border-radius(2px);
background: $gray-100; background-color: $gray-100;
border-left: 2px solid $gray-200; border-left: 2px solid $gray-200;
color: $gray-700; color: $gray-700;
margin-bottom: 2px; margin-bottom: 2px;
@ -431,7 +431,7 @@ html.maximized-card {
} }
.badge { .badge {
background: $gray-500 !important; background-color: $gray-500 !important;
} }
} }
} }

4
build/scss/_control-sidebar.scss
View File

@ -95,7 +95,7 @@ body.text-sm {
// Dark skin // Dark skin
.control-sidebar-dark { .control-sidebar-dark {
background: $sidebar-dark-bg; background-color: $sidebar-dark-bg;
&, &,
a, a,
@ -168,6 +168,6 @@ body.text-sm {
color: lighten($sidebar-light-color, 10%); color: lighten($sidebar-light-color, 10%);
// Background // Background
background: $sidebar-light-bg; background-color: $sidebar-light-bg;
border-left: $main-header-bottom-border; border-left: $main-header-bottom-border;
} }

6
build/scss/_direct-chat.scss
View File

@ -56,7 +56,7 @@
@include border-radius($border-radius-lg); @include border-radius($border-radius-lg);
} }
background: $direct-chat-default-msg-bg; background-color: $direct-chat-default-msg-bg;
border: 1px solid $direct-chat-default-msg-border-color; border: 1px solid $direct-chat-default-msg-border-color;
color: $direct-chat-default-font-color; color: $direct-chat-default-font-color;
margin: 5px 0 0 50px; margin: 5px 0 0 50px;
@ -135,7 +135,7 @@
.direct-chat-contacts { .direct-chat-contacts {
@include translate(101%, 0); @include translate(101%, 0);
background: $dark; background-color: $dark;
bottom: 0; bottom: 0;
color: $white; color: $white;
height: 250px; height: 250px;
@ -146,7 +146,7 @@
} }
.direct-chat-contacts-light { .direct-chat-contacts-light {
background: $light; background-color: $light;
.contacts-list-name { .contacts-list-name {
color: $gray-700; color: $gray-700;

4
build/scss/_dropdown.scss
View File

@ -169,7 +169,7 @@
right: 5%; right: 5%;
left: auto; left: auto;
border: 1px solid #ddd; border: 1px solid #ddd;
background: $white; background-color: $white;
} }
} }
} }
@ -229,7 +229,7 @@
a { a {
@include media-breakpoint-up(sm) { @include media-breakpoint-up(sm) {
background: $white !important; background-color: $white !important;
color: $gray-700 !important; color: $gray-700 !important;
} }
} }

2
build/scss/_info-box.scss
View File

@ -6,7 +6,7 @@
@include box-shadow($card-shadow); @include box-shadow($card-shadow);
@include border-radius($border-radius); @include border-radius($border-radius);
background: $white; background-color: $white;
display: flex; display: flex;
margin-bottom: map-get($spacers, 3); margin-bottom: map-get($spacers, 3);
min-height: 80px; min-height: 80px;

6
build/scss/_layout.scss
View File

@ -479,7 +479,7 @@ body:not(.sidebar-mini-md) {
} }
.content-wrapper { .content-wrapper {
background: $main-bg; background-color: $main-bg;
> .content { > .content {
padding: $content-padding-y $content-padding-x; padding: $content-padding-y $content-padding-x;
@ -573,7 +573,7 @@ body:not(.sidebar-mini-md) {
} }
.main-footer { .main-footer {
background: $main-footer-bg; background-color: $main-footer-bg;
border-top: $main-footer-border-top; border-top: $main-footer-border-top;
color: lighten($gray-700, 25%); color: lighten($gray-700, 25%);
padding: $main-footer-padding; padding: $main-footer-padding;
@ -601,7 +601,7 @@ body:not(.sidebar-mini-md) {
} }
.breadcrumb { .breadcrumb {
background: transparent; background-color: transparent;
line-height: 1.8rem; line-height: 1.8rem;
margin-bottom: 0; margin-bottom: 0;
padding: 0; padding: 0;

40
build/scss/_main-sidebar.scss
View File

@ -225,13 +225,13 @@
} }
.status { .status {
background: $sidebar-light-hover-bg; background-color: $sidebar-light-hover-bg;
color: $sidebar-light-color; color: $sidebar-light-color;
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
background: darken($sidebar-light-hover-bg, 3%); background-color: darken($sidebar-light-hover-bg, 3%);
color: $sidebar-light-hover-color; color: $sidebar-light-hover-color;
} }
} }
@ -274,13 +274,13 @@
// First Level Submenu // First Level Submenu
> .nav-treeview { > .nav-treeview {
background: $sidebar-light-submenu-bg; background-color: $sidebar-light-submenu-bg;
} }
} }
// Section Heading // Section Heading
.nav-header { .nav-header {
background: inherit; background-color: inherit;
color: darken($sidebar-light-color, 5%); color: darken($sidebar-light-color, 5%);
} }
@ -348,13 +348,13 @@
} }
.status { .status {
background: $sidebar-dark-hover-bg; background-color: $sidebar-dark-hover-bg;
color: $sidebar-dark-color; color: $sidebar-dark-color;
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
background: darken($sidebar-dark-hover-bg, 3%); background-color: darken($sidebar-dark-hover-bg, 3%);
color: $sidebar-dark-hover-color; color: $sidebar-dark-hover-color;
} }
} }
@ -397,13 +397,13 @@
// First Level Submenu // First Level Submenu
> .nav-treeview { > .nav-treeview {
background: $sidebar-dark-submenu-bg; background-color: $sidebar-dark-submenu-bg;
} }
} }
// Section Heading // Section Heading
.nav-header { .nav-header {
background: inherit; //darken($sidebar-dark-bg, 3%); background-color: inherit; //darken($sidebar-dark-bg, 3%);
color: lighten($sidebar-dark-color, 5%); color: lighten($sidebar-dark-color, 5%);
} }
@ -644,7 +644,7 @@
&.nav-sidebar > .nav-item { &.nav-sidebar > .nav-item {
.nav-treeview, .nav-treeview,
> .nav-treeview { > .nav-treeview {
background: rgba($white, .05); background-color: rgba($white, .05);
.nav-item { .nav-item {
> .nav-link { > .nav-link {
@ -676,7 +676,7 @@
&.nav-sidebar > .nav-item { &.nav-sidebar > .nav-item {
> .nav-link { > .nav-link {
&.active { &.active {
background: inherit; background-color: inherit;
border-left: 3px solid transparent; border-left: 3px solid transparent;
box-shadow: none; box-shadow: none;
@ -783,7 +783,7 @@
&.nav-sidebar > .nav-item { &.nav-sidebar > .nav-item {
.nav-treeview, .nav-treeview,
> .nav-treeview { > .nav-treeview {
background: rgba($white, .05); background-color: rgba($white, .05);
} }
> .nav-link.active { > .nav-link.active {
@ -795,7 +795,7 @@
&.active, &.active,
&:focus, &:focus,
&:hover { &:hover {
background: none; background-color: transparent;
color: $sidebar-dark-active-color; color: $sidebar-dark-active-color;
} }
} }
@ -805,7 +805,7 @@
&.nav-sidebar > .nav-item { &.nav-sidebar > .nav-item {
.nav-treeview, .nav-treeview,
> .nav-treeview { > .nav-treeview {
background: rgba($black, .05); background-color: rgba($black, .05);
} }
> .nav-link.active { > .nav-link.active {
@ -817,7 +817,7 @@
&.active, &.active,
&:focus, &:focus,
&:hover { &:hover {
background: none; background-color: transparent;
color: $sidebar-light-active-color; color: $sidebar-light-active-color;
} }
} }
@ -885,7 +885,7 @@
[class*="sidebar-dark"] { [class*="sidebar-dark"] {
.form-control-sidebar, .form-control-sidebar,
.btn-sidebar { .btn-sidebar {
background: lighten($sidebar-dark-bg, 5%); background-color: lighten($sidebar-dark-bg, 5%);
border: 1px solid lighten($sidebar-dark-bg, 15%); border: 1px solid lighten($sidebar-dark-bg, 15%);
color: lighten(color-yiq(lighten($sidebar-dark-bg, 5%)), 15%); color: lighten(color-yiq(lighten($sidebar-dark-bg, 5%)), 15%);
} }
@ -896,18 +896,18 @@
} }
.btn-sidebar:hover { .btn-sidebar:hover {
background: lighten($sidebar-dark-bg, 7.5%); background-color: lighten($sidebar-dark-bg, 7.5%);
} }
.btn-sidebar:focus { .btn-sidebar:focus {
background: lighten($sidebar-dark-bg, 10%); background-color: lighten($sidebar-dark-bg, 10%);
} }
} }
[class*="sidebar-light"] { [class*="sidebar-light"] {
.form-control-sidebar, .form-control-sidebar,
.btn-sidebar { .btn-sidebar {
background: darken($sidebar-light-bg, 5%); background-color: darken($sidebar-light-bg, 5%);
border: 1px solid darken($sidebar-light-bg, 15%); border: 1px solid darken($sidebar-light-bg, 15%);
color: color-yiq(darken($sidebar-light-bg, 5%)); color: color-yiq(darken($sidebar-light-bg, 5%));
} }
@ -918,11 +918,11 @@
} }
.btn-sidebar:hover { .btn-sidebar:hover {
background: darken($sidebar-light-bg, 7.5%); background-color: darken($sidebar-light-bg, 7.5%);
} }
.btn-sidebar:focus { .btn-sidebar:focus {
background: darken($sidebar-light-bg, 10%); background-color: darken($sidebar-light-bg, 10%);
} }
} }

12
build/scss/_miscellaneous.scss
View File

@ -52,7 +52,7 @@
} }
.list-seperator { .list-seperator {
background: $card-border-color; background-color: $card-border-color;
height: 1px; height: 1px;
margin: 15px 0 9px; margin: 15px 0 9px;
} }
@ -216,7 +216,7 @@
// General attachemnt block // General attachemnt block
.attachment-block { .attachment-block {
background: $gray-100; background-color: $gray-100;
border: 1px solid $card-border-color; border: 1px solid $card-border-color;
margin-bottom: 10px; margin-bottom: 10px;
padding: 5px; padding: 5px;
@ -259,7 +259,7 @@
.overlay { .overlay {
@include border-radius($border-radius); @include border-radius($border-radius);
align-items: center; align-items: center;
background: rgba($white, .7); background-color: rgba($white, .7);
display: flex; display: flex;
justify-content: center; justify-content: center;
z-index: 50; z-index: 50;
@ -273,7 +273,7 @@
} }
&.dark { &.dark {
background: rgba($black, .5); background-color: rgba($black, .5);
> .fa, > .fa,
> .fas, > .fas,
@ -391,13 +391,13 @@ pre {
// Blockquotes styles // Blockquotes styles
blockquote { blockquote {
background: $white; background-color: $white;
border-left: .7rem solid $primary; border-left: .7rem solid $primary;
margin: 1.5em .7rem; margin: 1.5em .7rem;
padding: .5em .7rem; padding: .5em .7rem;
.box & { .box & {
background: $gray-200; background-color: $gray-200;
} }
p:last-child { p:last-child {

2
build/scss/_products.scss
View File

@ -14,7 +14,7 @@
@include border-radius($border-radius); @include border-radius($border-radius);
} }
background: $white; background-color: $white;
padding: 10px 0; padding: 10px 0;
} }

4
build/scss/_small-box.scss
View File

@ -16,7 +16,7 @@
} }
> .small-box-footer { > .small-box-footer {
background: rgba($black, .1); background-color: rgba($black, .1);
color: rgba($white, .8); color: rgba($white, .8);
display: block; display: block;
padding: 3px 0; padding: 3px 0;
@ -26,7 +26,7 @@
z-index: 10; z-index: 10;
&:hover { &:hover {
background: rgba($black, .15); background-color: rgba($black, .15);
color: $white; color: $white;
} }
} }

8
build/scss/_timeline.scss
View File

@ -9,7 +9,7 @@
// The line // The line
&::before { &::before {
@include border-radius($border-radius); @include border-radius($border-radius);
background: $gray-300; background-color: $gray-300;
bottom: 0; bottom: 0;
content: ""; content: "";
left: 31px; left: 31px;
@ -33,7 +33,7 @@
> .timeline-item { > .timeline-item {
@include box-shadow($card-shadow); @include box-shadow($card-shadow);
@include border-radius($border-radius); @include border-radius($border-radius);
background: $white; background-color: $white;
color: $gray-700; color: $gray-700;
margin-left: 60px; margin-left: 60px;
margin-right: 15px; margin-right: 15px;
@ -89,7 +89,7 @@
> .far, > .far,
> .fab, > .fab,
> .ion { > .ion {
background: $gray-500; background-color: $gray-500;
border-radius: 50%; border-radius: 50%;
font-size: 15px; font-size: 15px;
height: 30px; height: 30px;
@ -117,7 +117,7 @@
> div { > div {
> .timeline-item { > .timeline-item {
@include box-shadow(none); @include box-shadow(none);
background: $gray-100; background-color: $gray-100;
border: 1px solid $gray-300; border: 1px solid $gray-300;
> .timeline-header { > .timeline-header {

4
build/scss/mixins/_accent.scss
View File

@ -22,14 +22,14 @@
.dropdown-item { .dropdown-item {
&:active, &:active,
&.active { &.active {
background: $color; background-color: $color;
color: color-yiq($color); color: color-yiq($color);
} }
} }
.custom-control-input:checked ~ .custom-control-label { .custom-control-input:checked ~ .custom-control-label {
&::before { &::before {
background: $color; background-color: $color;
border-color: darken($color, 20%); border-color: darken($color, 20%);
} }

4
build/scss/mixins/_cards.scss
View File

@ -63,7 +63,7 @@
table td.hour:hover, table td.hour:hover,
table td.minute:hover, table td.minute:hover,
table td.second:hover { table td.second:hover {
background: darken($color, 8%); background-color: darken($color, 8%);
color: color-yiq($color); color: color-yiq($color);
} }
@ -73,7 +73,7 @@
table td.active, table td.active,
table td.active:hover { table td.active:hover {
background: lighten($color, 10%); background-color: lighten($color, 10%);
color: color-yiq($color); color: color-yiq($color);
} }
} }

8
build/scss/mixins/_custom-forms.scss
View File

@ -6,7 +6,7 @@
@mixin custom-switch-variant($name, $color) { @mixin custom-switch-variant($name, $color) {
&.custom-switch-off-#{$name} { &.custom-switch-off-#{$name} {
& .custom-control-input ~ .custom-control-label::before { & .custom-control-input ~ .custom-control-label::before {
background: #{$color}; background-color: #{$color};
border-color: darken($color, 20%); border-color: darken($color, 20%);
} }
@ -15,13 +15,13 @@
} }
& .custom-control-input ~ .custom-control-label::after { & .custom-control-input ~ .custom-control-label::after {
background: darken($color, 25%); background-color: darken($color, 25%);
} }
} }
&.custom-switch-on-#{$name} { &.custom-switch-on-#{$name} {
& .custom-control-input:checked ~ .custom-control-label::before { & .custom-control-input:checked ~ .custom-control-label::before {
background: #{$color}; background-color: #{$color};
border-color: darken($color, 20%); border-color: darken($color, 20%);
} }
@ -30,7 +30,7 @@
} }
& .custom-control-input:checked ~ .custom-control-label::after { & .custom-control-input:checked ~ .custom-control-label::after {
background: lighten($color, 30%); background-color: lighten($color, 30%);
} }
} }
} }

2
build/scss/mixins/_direct-chat.scss
View File

@ -5,7 +5,7 @@
// Direct Chat Variant // Direct Chat Variant
@mixin direct-chat-variant($bg-color, $color: $white) { @mixin direct-chat-variant($bg-color, $color: $white) {
.right > .direct-chat-text { .right > .direct-chat-text {
background: $bg-color; background-color: $bg-color;
border-color: $bg-color; border-color: $bg-color;
color: color-yiq($bg-color); color: color-yiq($bg-color);

4
build/scss/mixins/_miscellaneous.scss
View File

@ -26,7 +26,7 @@
// Gradient background // Gradient background
@mixin gradient($color: #f5f5f5, $start: #eee, $stop: $white) { @mixin gradient($color: #f5f5f5, $start: #eee, $stop: $white) {
background: $color; background-color: $color;
background: gradient(linear, left bottom, left top, color-stop(0, $start), color-stop(1, $stop)); background-image: gradient(linear, left bottom, left top, color-stop(0, $start), color-stop(1, $stop));
} }

4
build/scss/mixins/_navbar.scss
View File

@ -17,7 +17,7 @@
.nav .open > a:hover, .nav .open > a:hover,
.nav .open > a:focus, .nav .open > a:focus,
.nav > .active > a { .nav > .active > a {
background: $hover-bg; background-color: $hover-bg;
color: $hover-color; color: $hover-color;
} }
@ -27,7 +27,7 @@
&:hover, &:hover,
&:focus { &:focus {
background: $hover-bg; background-color: $hover-bg;
color: $hover-color; color: $hover-color;
} }
} }

4
build/scss/mixins/_toasts.scss
View File

@ -5,7 +5,7 @@
// Toast Variant // Toast Variant
@mixin toast-variant($name, $color) { @mixin toast-variant($name, $color) {
&.bg-#{$name} { &.bg-#{$name} {
background: rgba($color, .9) !important; background-color: rgba($color, .9) !important;
@if (color-yiq($color) == $yiq-text-light) { @if (color-yiq($color) == $yiq-text-light) {
.close { .close {
@ -15,7 +15,7 @@
} }
.toast-header { .toast-header {
background: rgba($color, .85); background-color: rgba($color, .85);
color: color-yiq($color); color: color-yiq($color);
} }
} }

2
build/scss/pages/_invoice.scss
View File

@ -3,7 +3,7 @@
// //
.invoice { .invoice {
background: $white; background-color: $white;
border: 1px solid $card-border-color; border: 1px solid $card-border-color;
position: relative; position: relative;
} }

6
build/scss/pages/_lockscreen.scss
View File

@ -4,7 +4,7 @@
// ADD THIS CLASS TO THE <BODY> TAG // ADD THIS CLASS TO THE <BODY> TAG
.lockscreen { .lockscreen {
background: $gray-200; background-color: $gray-200;
// User name [optional] // User name [optional]
.lockscreen-name { .lockscreen-name {
@ -34,7 +34,7 @@
// Will contain the image and the sign in form // Will contain the image and the sign in form
.lockscreen-item { .lockscreen-item {
@include border-radius(4px); @include border-radius(4px);
background: $white; background-color: $white;
margin: 10px auto 30px; margin: 10px auto 30px;
padding: 0; padding: 0;
position: relative; position: relative;
@ -44,7 +44,7 @@
// User image // User image
.lockscreen-image { .lockscreen-image {
@include border-radius(50%); @include border-radius(50%);
background: $white; background-color: $white;
left: -10px; left: -10px;
padding: 5px; padding: 5px;
position: absolute; position: absolute;

4
build/scss/pages/_login_and_register.scss
View File

@ -17,7 +17,7 @@
.login-page, .login-page,
.register-page { .register-page {
align-items: center; align-items: center;
background: $gray-200; background-color: $gray-200;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100vh; height: 100vh;
@ -36,7 +36,7 @@
.login-card-body, .login-card-body,
.register-card-body { .register-card-body {
background: $white; background-color: $white;
border-top: 0; border-top: 0;
color: #666; color: #666;
padding: 20px; padding: 20px;

2
build/scss/pages/_mailbox.scss
View File

@ -63,7 +63,7 @@
} }
.mailbox-attachment-info { .mailbox-attachment-info {
background: $gray-100; background-color: $gray-100;
padding: 10px; padding: 10px;
} }