diff --git a/site/assets/scss/_styles_project.scss b/site/assets/scss/_styles_project.scss index f2765281f2..c051535164 100644 --- a/site/assets/scss/_styles_project.scss +++ b/site/assets/scss/_styles_project.scss @@ -13,8 +13,8 @@ $white: #ffffff; // Gradient colors -$gradient-start: #9333EA; // Purple -$gradient-end: #4F46E5; // Indigo +$gradient-start: #9333EA; // Purple +$gradient-end: #4F46E5; // Indigo // Enhanced gradient mixin @mixin gradient-text { @@ -135,9 +135,37 @@ body { .td-navbar-nav-scroll { max-width: 100%; font-size: 0.9rem; + } } +} + +@media(min-width: 992px) { + + .td-max-width-on-larger-screens, + .td-card.card, + .td-card-group.card-group, + .td-content>.tab-content .tab-pane, + .td-content .footnotes, + .td-content>.alert, + .td-content>.highlight, + .td-content>.lead, + .td-content>.td-table, + .td-box .td-content>table, + .td-content>table, + .td-content>blockquote, + .td-content>dl dd, + .td-content>h1, + .td-content>.h1, + .td-content>h2, + .td-content>.h2, + .td-content>ol, + .td-content>p, + .td-content>pre, + .td-content>ul { + max-width: 100%; } } + .td-navbar { background-color: rgba($white, 0.95); backdrop-filter: blur(8px); @@ -161,6 +189,7 @@ body { .td-navbar-logo-regular { display: block; } + .td-navbar-logo-white { display: none; } @@ -203,6 +232,7 @@ body { .td-navbar-logo-regular { display: none; } + .td-navbar-logo-white { display: block; } @@ -249,7 +279,7 @@ nav.foldable-nav { margin: 0; } - .ul-1 > li { + .ul-1>li { padding-left: 1em; } @@ -257,7 +287,7 @@ nav.foldable-nav { display: none; } - input:checked ~ ul.foldable { + input:checked~ul.foldable { display: block; } @@ -271,13 +301,13 @@ nav.foldable-nav { padding-left: 1em; } - .ul-1 .with-child > label:before { + .ul-1 .with-child>label:before { top: 0.1em; font-size: 1em; color: var(--bs-secondary-color); } - .ul-1 .with-child > input:checked ~ label:before { + .ul-1 .with-child>input:checked~label:before { color: var(--bs-secondary-color); transform: rotate(90deg); transition: transform 0.5s; @@ -356,7 +386,7 @@ nav.foldable-nav { } } - &.active-path > label > .td-sidebar-link { + &.active-path>label>.td-sidebar-link { color: $primary; font-weight: 500; } @@ -378,7 +408,7 @@ nav.foldable-nav { } // Show nested items when checkbox is checked - input:checked ~ ul.foldable { + input:checked~ul.foldable { display: block; } @@ -418,7 +448,13 @@ nav.foldable-nav { // Container -.container, .container-fluid, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm { +.container, +.container-fluid, +.container-xxl, +.container-xl, +.container-lg, +.container-md, +.container-sm { --bs-gutter-x: 1.5rem; --bs-gutter-y: 0; padding-right: 0; @@ -432,7 +468,8 @@ nav.foldable-nav { padding-bottom: 2rem; // @include media-breakpoint-up(md) { // padding-top: 5.5rem; - } +} + .td-main { padding-top: 4.5rem; @@ -440,7 +477,12 @@ nav.foldable-nav { padding-top: 0; } - h1, h2, h3, h4, h5, h6 { + h1, + h2, + h3, + h4, + h5, + h6 { font-weight: 600; margin-bottom: 1.5rem; color: $dark; @@ -1048,6 +1090,7 @@ footer { // About page styling .td-content { + // Main heading styles h1 { font-size: 3.5rem; @@ -1395,7 +1438,8 @@ footer { } } - .fa, .fas { + .fa, + .fas { color: rgba($white, 0.9); } } @@ -1463,13 +1507,15 @@ footer { } } - .fa, .fas { + .fa, + .fas { color: $primary; } } // Icon styling - .fa, .fas { + .fa, + .fas { font-size: 2.5rem; margin-bottom: 1rem; } @@ -1673,4 +1719,4 @@ footer { margin-left: auto; margin-right: auto; } -} +} \ No newline at end of file