diff --git a/css-rules.txt b/css-rules.txt index 4fda199..ace29eb 100644 --- a/css-rules.txt +++ b/css-rules.txt @@ -4,6 +4,7 @@ Tab-Headers: 2 Metrics: 3 B2Note: 5 Nav-bar: 980 +cookie-law-wrapper: 1000 fs-modal: 1029 Tooltip: 1030 notification: 1040 diff --git a/library-css/landing-utils.css b/library-css/landing-utils.css index 27ab648..4ca3f7f 100644 --- a/library-css/landing-utils.css +++ b/library-css/landing-utils.css @@ -301,20 +301,20 @@ /* border-radius: 4px;*/ /*}*/ -:root { +.landing { --landing-header-height: var(--navbar-height); --landing-primary-color: var(--primary-color); --landing-default-color: var(--default-color); --landing-default-color-rgb: var(--default-color-rgb); --landing-light-color: var(--light-color); + --landing-light-color-rgb: var(--light-color-rgb); --landing-muted-color: var(--muted-color); --landing-table-color: var(--table-color); --landing-text-primary-color: var(--text-primary-color); - --landing-modal-header-color: rgba(var(--explore-color-rgb), 0.3); - --landing-section-separator-color: rgba(var(--explore-color-rgb), 0.3); + --landing-section-separator-color: rgba(var(--explore-color-rgb), var(--opacity)); } -.landing-column-height { +.landing-sidebar-height { height: calc(100vh - var(--landing-header-height)); } @@ -330,7 +330,7 @@ background-color: var(--landing-table-color); } -.landing-left-column-border { +.landing-left-sidebar-border { border-right: 1px solid var(--landing-muted-color); } @@ -387,20 +387,32 @@ backdrop-filter: saturate(180%) blur(20px); } - #main-tabs-div { background: rgba(var(--landing-default-color-rgb), 0.95); top: 0; position: relative; transition: background-color 0.3s ease-out 0s, top 0.2s ease-out 0s; +} + +#graph_and_feedback { + /*background: rgba(var(--landing-light-color-rgb), 0.95);*/ + background: rgba(var(--landing-default-color-rgb), 0.95); +} + +#main-tabs-div, #graph_and_feedback { -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); + z-index: 979; } @supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { #main-tabs-div { background: rgba(var(--landing-default-color-rgb), 0.80); } + #graph_and_feedback { + /*background: rgba(var(--landing-light-color-rgb), 0.80);*/ + background: rgba(var(--landing-default-color-rgb), 0.80); + } } .landing-section{ min-height: 70vh; @@ -408,17 +420,16 @@ #landing-sections .landing-section:not(:last-child):before{ background-color: var(--landing-section-separator-color); - opacity: 0.3; + opacity: var(--opacity); } #landing-sections .landing-section:not(:last-child){ border-bottom: solid 3px var(--landing-section-separator-color); - + padding-bottom: 80px; } -.landing-modal-header { - background-color: var(--landing-modal-header-color); - padding: 25px 40px; +#landing-sections .landing-section:not(:first-child) { + margin-top: 80px; } .download-from > * { @@ -426,3 +437,17 @@ border: 1px solid var(--landing-muted-color); border-radius: 6px; } + +#right-sidebar-switcher { + top: 50vh !important; +} + +.landing-left-sidebar-width { + width: 100px; +} + +@media only screen and (min-width: 960px) { + .landing-left-sidebar-width { + width: 150px; + } +} \ No newline at end of file