diff options
Diffstat (limited to 'assets/scss/theme/theme.scss')
| -rw-r--r-- | assets/scss/theme/theme.scss | 158 |
1 files changed, 98 insertions, 60 deletions
diff --git a/assets/scss/theme/theme.scss b/assets/scss/theme/theme.scss index 65f5a87..a57aa26 100644 --- a/assets/scss/theme/theme.scss +++ b/assets/scss/theme/theme.scss @@ -1,88 +1,126 @@ @media (prefers-color-scheme: dark) { - body { - background-color: #343a40; color: #f8f9fa; - } + body { + background-color: #343a40; + color: #f8f9fa; + } +} + +.horizontal-scrollable > .row { + overflow-x: auto; + white-space: nowrap; +} + +.horizontal-scrollable > .row > .col-xs-4 { + display: inline-block; + float: none; } .gradient-featured { - background: $white; - background: linear-gradient(135deg, $white 0%, tint-color($primary, 80%) 100%); + background: $white; + background: linear-gradient( + 135deg, + $white 0%, + tint-color($primary, 80%) 100% + ); } .card-feature { - background-color: var(--#{$prefix}light) if($enable-important-utilities, !important, null); + background-color: var(--#{$prefix}light) + if($enable-important-utilities, !important, null); } .card-feature div i { - background: linear-gradient(135deg, tint-color($primary, 80%) 0%, $primary 100%); - -webkit-background-clip: text; - background-clip: text; - -webkit-text-fill-color: transparent; + background: linear-gradient( + 135deg, + tint-color($primary, 80%) 0%, + $primary 100% + ); + -webkit-background-clip: text; + background-clip: text; + -webkit-text-fill-color: transparent; } // scss-docs-start styling .card-shrink { - transition: 0.3s transform cubic-bezier(0.155, 1.105, 0.295, 1.12), 0.3s box-shadow, 0.3s -webkit-transform cubic-bezier(0.155, 1.105, 0.295, 1.12); - cursor: pointer; + transition: + 0.3s transform cubic-bezier(0.155, 1.105, 0.295, 1.12), + 0.3s box-shadow, + 0.3s -webkit-transform cubic-bezier(0.155, 1.105, 0.295, 1.12); + cursor: pointer; } .card-shrink:hover { - transform: scale(0.99); - box-shadow: none if($enable-important-utilities, !important, null); + transform: scale(0.99); + box-shadow: none if($enable-important-utilities, !important, null); } // scss-docs-end styling .footer { - background-color: $gray-800 if($enable-important-utilities, !important, null); - color: var(--#{$prefix}light) if($enable-important-utilities, !important, null); + background-color: $gray-800 if($enable-important-utilities, !important, null); + color: var(--#{$prefix}light) + if($enable-important-utilities, !important, null); } .footer-muted { - color: var(--#{$prefix}light) if($enable-important-utilities, !important, null); - opacity: .7 if($enable-important-utilities, !important, null); + color: var(--#{$prefix}light) + if($enable-important-utilities, !important, null); + opacity: 0.7 if($enable-important-utilities, !important, null); } .link-bg-footer { - color: var(--#{$prefix}light) if($enable-important-utilities, !important, null); - - &:hover, - &:focus { - color: $gray-400 if($enable-important-utilities, !important, null); - } + color: var(--#{$prefix}light) + if($enable-important-utilities, !important, null); + + &:hover, + &:focus { + color: $gray-400 if($enable-important-utilities, !important, null); + } } @if $enable-dark-mode { - @include color-mode(dark) { - .gradient-featured { - background: rgb(184,78,92); - background: linear-gradient(330deg, rgba(184,78,92,1) 0%, rgba(17,0,84,1) 80%); - } - - .card-feature { - background-color: var(--#{$prefix}tertiary-bg) if($enable-important-utilities, !important, null); - } - - .card-feature div i { - background: linear-gradient(135deg, $primary 0%, shade-color($primary, 60%) 100%); - -webkit-background-clip: text; - background-clip: text; - -webkit-text-fill-color: transparent; - } - - .footer { - background-color: var(--#{$prefix}tertiary-bg) if($enable-important-utilities, !important, null); - color: var(--#{$prefix}tertiary) if($enable-important-utilities, !important, null); - } - - .link-bg-footer { - color: var(--#{$prefix}tertiary) if($enable-important-utilities, !important, null); - - &:hover, - &:focus { - color: $gray-400 if($enable-important-utilities, !important, null); - } - } + @include color-mode(dark) { + .gradient-featured { + background: rgb(184, 78, 92); + background: linear-gradient( + 330deg, + rgba(184, 78, 92, 1) 0%, + rgba(17, 0, 84, 1) 80% + ); } + + .card-feature { + background-color: var(--#{$prefix}tertiary-bg) + if($enable-important-utilities, !important, null); + } + + .card-feature div i { + background: linear-gradient( + 135deg, + $primary 0%, + shade-color($primary, 60%) 100% + ); + -webkit-background-clip: text; + background-clip: text; + -webkit-text-fill-color: transparent; + } + + .footer { + background-color: var(--#{$prefix}tertiary-bg) + if($enable-important-utilities, !important, null); + color: var(--#{$prefix}tertiary) + if($enable-important-utilities, !important, null); + } + + .link-bg-footer { + color: var(--#{$prefix}tertiary) + if($enable-important-utilities, !important, null); + + &:hover, + &:focus { + color: $gray-400 if($enable-important-utilities, !important, null); + } + } + } } // .accordion-theme { @@ -103,12 +141,12 @@ // } .math { - overflow-x: auto; - font-size: 0.7rem !important; + overflow-x: auto; + font-size: 0.7rem !important; } @include media-breakpoint-up(md) { - .math { - font-size: 1rem !important; - } -}
\ No newline at end of file + .math { + font-size: 1rem !important; + } +} |