From d2dbda21aa4f0404931c2923282656bc5287bea9 Mon Sep 17 00:00:00 2001 From: parkhojeong Date: Thu, 7 May 2026 16:53:42 +0900 Subject: [PATCH 1/9] Improve community page spacing on mobile and tablet --- landing-pages/site/assets/scss/_community-page.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/landing-pages/site/assets/scss/_community-page.scss b/landing-pages/site/assets/scss/_community-page.scss index 3402469f365..45880e45518 100644 --- a/landing-pages/site/assets/scss/_community-page.scss +++ b/landing-pages/site/assets/scss/_community-page.scss @@ -208,6 +208,10 @@ @media (min-width: calc(#{$tablet} + 1px)) { display: none; } + + .community--header-container{ + margin-top: 40px; + } } From d4661e66f5c7893d4c407bd4da75b3fd8eeabc19 Mon Sep 17 00:00:00 2001 From: parkhojeong Date: Thu, 7 May 2026 16:53:42 +0900 Subject: [PATCH 2/9] Format community page SCSS --- landing-pages/site/assets/scss/_community-page.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/landing-pages/site/assets/scss/_community-page.scss b/landing-pages/site/assets/scss/_community-page.scss index 3402469f365..ca3e0073f8e 100644 --- a/landing-pages/site/assets/scss/_community-page.scss +++ b/landing-pages/site/assets/scss/_community-page.scss @@ -208,6 +208,10 @@ @media (min-width: calc(#{$tablet} + 1px)) { display: none; } + + .community--header-container { + margin-top: 40px; + } } From 58c807707d5742a14e931b0b05fc7fa8026126ee Mon Sep 17 00:00:00 2001 From: parkhojeong Date: Fri, 8 May 2026 22:48:56 +0900 Subject: [PATCH 3/9] Normalize landing page vertical spacing --- .../site/assets/scss/_base-layout.scss | 4 +-- .../site/assets/scss/_case-study.scss | 6 +--- .../site/assets/scss/_community-page.scss | 8 ++--- landing-pages/site/assets/scss/_header.scss | 2 +- .../site/assets/scss/_home-page.scss | 9 ------ landing-pages/site/assets/scss/_layout.scss | 30 +++++++++++++++++++ landing-pages/site/assets/scss/_roadmap.scss | 2 -- .../site/assets/scss/_testimonial.scss | 6 +--- .../site/assets/scss/main-custom.scss | 1 + .../site/content/en/announcements/_index.md | 2 -- .../site/content/en/ecosystem/_index.md | 2 -- 11 files changed, 37 insertions(+), 35 deletions(-) create mode 100644 landing-pages/site/assets/scss/_layout.scss diff --git a/landing-pages/site/assets/scss/_base-layout.scss b/landing-pages/site/assets/scss/_base-layout.scss index f5c82beb41e..15dd89b538d 100644 --- a/landing-pages/site/assets/scss/_base-layout.scss +++ b/landing-pages/site/assets/scss/_base-layout.scss @@ -20,7 +20,7 @@ @import "fonts"; .base-layout { - padding: 91px 0 40px; + padding: 40px 0; &--scrollButton { position: sticky; @@ -66,8 +66,6 @@ @media (max-width: $tablet) { .base-layout { - padding: 76px 0 60px; - &--scrollButton { margin-top: 20px; margin-left: 0; diff --git a/landing-pages/site/assets/scss/_case-study.scss b/landing-pages/site/assets/scss/_case-study.scss index 6d48ca68d9a..7c91f68497e 100644 --- a/landing-pages/site/assets/scss/_case-study.scss +++ b/landing-pages/site/assets/scss/_case-study.scss @@ -20,11 +20,7 @@ .case-study-page { max-width: 790px !important; - margin: 60px auto 0; - - @media (max-width: $mobile) { - margin-top: 40px; - } + margin: 0 auto; } .case-studies-container { diff --git a/landing-pages/site/assets/scss/_community-page.scss b/landing-pages/site/assets/scss/_community-page.scss index ca3e0073f8e..dc0bff45516 100644 --- a/landing-pages/site/assets/scss/_community-page.scss +++ b/landing-pages/site/assets/scss/_community-page.scss @@ -38,7 +38,7 @@ } &--accordion-container { - margin: 60px 18px; + margin: 0 18px 60px; } &--accordion-container .dev-list { @@ -174,7 +174,7 @@ } &--accordion-container { - margin: 40px 0; + margin-bottom: 40px; } &--committers-header { @@ -208,10 +208,6 @@ @media (min-width: calc(#{$tablet} + 1px)) { display: none; } - - .community--header-container { - margin-top: 40px; - } } diff --git a/landing-pages/site/assets/scss/_header.scss b/landing-pages/site/assets/scss/_header.scss index 5cb022bbb9f..a0c8e85e16f 100644 --- a/landing-pages/site/assets/scss/_header.scss +++ b/landing-pages/site/assets/scss/_header.scss @@ -20,7 +20,7 @@ #header { position: relative; - margin: 91px -20px 0; + margin: 0 -20px; min-height: calc(100vh - 91px); // background-color is handled by the canvas animation which draws white/dark background transition: background-color 0.3s ease; diff --git a/landing-pages/site/assets/scss/_home-page.scss b/landing-pages/site/assets/scss/_home-page.scss index 5e4fb94b23a..97ba14790cf 100644 --- a/landing-pages/site/assets/scss/_home-page.scss +++ b/landing-pages/site/assets/scss/_home-page.scss @@ -18,15 +18,6 @@ */ @import "media"; -.home-page-layout { - &.base-layout { - padding-top: 70px; - - @media (max-width: $mobile) { - padding-top: 80px; - } - } -} .home-section-header { margin-top: 80px; margin-bottom: 60px; diff --git a/landing-pages/site/assets/scss/_layout.scss b/landing-pages/site/assets/scss/_layout.scss new file mode 100644 index 00000000000..52a965807c6 --- /dev/null +++ b/landing-pages/site/assets/scss/_layout.scss @@ -0,0 +1,30 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +@import "media"; + +body { + @media (max-width: $tablet) { + padding-top: 80px; // navbar offset on mobile and tablet + } + + @media (min-width: calc(#{$tablet} + 1px)) { + padding-top: 90px; // navbar offset on desktop + } +} diff --git a/landing-pages/site/assets/scss/_roadmap.scss b/landing-pages/site/assets/scss/_roadmap.scss index 98bf488af51..3f647771f34 100644 --- a/landing-pages/site/assets/scss/_roadmap.scss +++ b/landing-pages/site/assets/scss/_roadmap.scss @@ -20,8 +20,6 @@ @import "media"; .roadmap { - margin-top: 40px; - main { padding-left: 40px; } diff --git a/landing-pages/site/assets/scss/_testimonial.scss b/landing-pages/site/assets/scss/_testimonial.scss index c106831fabc..669d7158cc7 100644 --- a/landing-pages/site/assets/scss/_testimonial.scss +++ b/landing-pages/site/assets/scss/_testimonial.scss @@ -20,11 +20,7 @@ .case-study-page { max-width: 790px !important; - margin: 60px auto 0; - - @media (max-width: $mobile) { - margin-top: 40px; - } + margin: 0 auto; } #case-studies-container { diff --git a/landing-pages/site/assets/scss/main-custom.scss b/landing-pages/site/assets/scss/main-custom.scss index ad0d949ef61..356d3fa58d9 100644 --- a/landing-pages/site/assets/scss/main-custom.scss +++ b/landing-pages/site/assets/scss/main-custom.scss @@ -59,6 +59,7 @@ @import "survey"; @import "testimonial"; @import "suggest-change"; +@import "layout"; /* Theme toggle pill (sun/moon) */ .theme-toggle-pill { diff --git a/landing-pages/site/content/en/announcements/_index.md b/landing-pages/site/content/en/announcements/_index.md index 0bafa8f0bde..11039fbaa17 100644 --- a/landing-pages/site/content/en/announcements/_index.md +++ b/landing-pages/site/content/en/announcements/_index.md @@ -8,8 +8,6 @@ menu: --- -  -  # April 24, 2026 diff --git a/landing-pages/site/content/en/ecosystem/_index.md b/landing-pages/site/content/en/ecosystem/_index.md index 7d395f34a85..bf608aff5f8 100644 --- a/landing-pages/site/content/en/ecosystem/_index.md +++ b/landing-pages/site/content/en/ecosystem/_index.md @@ -6,8 +6,6 @@ menu: weight: 30 --- -  -  # Ecosystem From 86592e107b77bd1985bf171d5c81bb2440d2ae4d Mon Sep 17 00:00:00 2001 From: parkhojeong Date: Fri, 8 May 2026 22:50:53 +0900 Subject: [PATCH 4/9] Remove duplicate use case detail styles --- .../site/assets/scss/_testimonial.scss | 30 ------------------- .../site/assets/scss/main-custom.scss | 1 - 2 files changed, 31 deletions(-) delete mode 100644 landing-pages/site/assets/scss/_testimonial.scss diff --git a/landing-pages/site/assets/scss/_testimonial.scss b/landing-pages/site/assets/scss/_testimonial.scss deleted file mode 100644 index 669d7158cc7..00000000000 --- a/landing-pages/site/assets/scss/_testimonial.scss +++ /dev/null @@ -1,30 +0,0 @@ -/** - * Licensed to the Apache Software Foundation (ASF) under one - * or more contributor license agreements. See the NOTICE file - * distributed with this work for additional information - * regarding copyright ownership. The ASF licenses this file - * to you under the Apache License, Version 2.0 (the - * "License"); you may not use this file except in compliance - * with the License. You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - @import "media"; - - .case-study-page { - max-width: 790px !important; - margin: 0 auto; - } - - #case-studies-container { - display: flex; - justify-content: center; - flex-wrap: wrap; - } diff --git a/landing-pages/site/assets/scss/main-custom.scss b/landing-pages/site/assets/scss/main-custom.scss index 356d3fa58d9..f133eeca6c8 100644 --- a/landing-pages/site/assets/scss/main-custom.scss +++ b/landing-pages/site/assets/scss/main-custom.scss @@ -57,7 +57,6 @@ @import "four-oh-four"; @import "docs"; @import "survey"; -@import "testimonial"; @import "suggest-change"; @import "layout"; From 897675e2cb1b852fd1518c178227567865202685 Mon Sep 17 00:00:00 2001 From: parkhojeong Date: Fri, 8 May 2026 23:21:27 +0900 Subject: [PATCH 5/9] Normalize landing page vertical spacing --- landing-pages/site/assets/scss/_header.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/landing-pages/site/assets/scss/_header.scss b/landing-pages/site/assets/scss/_header.scss index a0c8e85e16f..7bb115779b8 100644 --- a/landing-pages/site/assets/scss/_header.scss +++ b/landing-pages/site/assets/scss/_header.scss @@ -85,7 +85,7 @@ @media (max-width: $tablet) { #header { - margin: 77px -20px 0; + margin: 0 -20px; min-height: calc(100vh - 77px); } #header-canvas { From ba94eb73de2293876396c9c05c7ae1891b1a1adc Mon Sep 17 00:00:00 2001 From: parkhojeong Date: Tue, 12 May 2026 18:05:49 +0900 Subject: [PATCH 6/9] Introduce navbar height variables for landing pages --- landing-pages/site/assets/scss/_base-layout.scss | 2 +- landing-pages/site/assets/scss/_community-page.scss | 4 ++-- landing-pages/site/assets/scss/_content-drawer.scss | 2 +- landing-pages/site/assets/scss/_four-oh-four.scss | 2 +- landing-pages/site/assets/scss/_header.scss | 4 ++-- landing-pages/site/assets/scss/_navbar.scss | 4 ++-- landing-pages/site/assets/scss/_roadmap.scss | 8 ++++---- .../site/assets/scss/{_layout.scss => _shared.scss} | 8 ++++++-- landing-pages/site/assets/scss/main-custom.scss | 2 +- 9 files changed, 20 insertions(+), 16 deletions(-) rename landing-pages/site/assets/scss/{_layout.scss => _shared.scss} (79%) diff --git a/landing-pages/site/assets/scss/_base-layout.scss b/landing-pages/site/assets/scss/_base-layout.scss index 15dd89b538d..88a1c6905b2 100644 --- a/landing-pages/site/assets/scss/_base-layout.scss +++ b/landing-pages/site/assets/scss/_base-layout.scss @@ -20,7 +20,7 @@ @import "fonts"; .base-layout { - padding: 40px 0; + padding: $landing-page-spacing-y 0; &--scrollButton { position: sticky; diff --git a/landing-pages/site/assets/scss/_community-page.scss b/landing-pages/site/assets/scss/_community-page.scss index dc0bff45516..d556ffd21ae 100644 --- a/landing-pages/site/assets/scss/_community-page.scss +++ b/landing-pages/site/assets/scss/_community-page.scss @@ -94,8 +94,8 @@ overflow-y: auto; height: 100px; padding-left: 30px; - max-height: -webkit-calc(100vh - 91px); - max-height: calc(100vh - 91px); + max-height: -webkit-calc(100vh - #{$navbar-height-desktop}); + max-height: calc(100vh - #{$navbar-height-desktop}); font-size: 14px; line-height: 1.43; } diff --git a/landing-pages/site/assets/scss/_content-drawer.scss b/landing-pages/site/assets/scss/_content-drawer.scss index 297da40a826..4a10147af7e 100644 --- a/landing-pages/site/assets/scss/_content-drawer.scss +++ b/landing-pages/site/assets/scss/_content-drawer.scss @@ -37,7 +37,7 @@ .content-drawer-container { position: fixed; - top: 77px; + top: $navbar-height-mobile; left: 0; width: 100%; height: 100%; diff --git a/landing-pages/site/assets/scss/_four-oh-four.scss b/landing-pages/site/assets/scss/_four-oh-four.scss index 207099bf369..23abfbd3fb5 100644 --- a/landing-pages/site/assets/scss/_four-oh-four.scss +++ b/landing-pages/site/assets/scss/_four-oh-four.scss @@ -18,7 +18,7 @@ */ .four-oh-four { - height: calc(100vh - 91px); + height: calc(100vh - #{$navbar-height-desktop}); position: relative; &__text-container { diff --git a/landing-pages/site/assets/scss/_header.scss b/landing-pages/site/assets/scss/_header.scss index 7bb115779b8..533f2ae54d3 100644 --- a/landing-pages/site/assets/scss/_header.scss +++ b/landing-pages/site/assets/scss/_header.scss @@ -21,7 +21,7 @@ #header { position: relative; margin: 0 -20px; - min-height: calc(100vh - 91px); + min-height: calc(100vh - #{$navbar-height-desktop}); // background-color is handled by the canvas animation which draws white/dark background transition: background-color 0.3s ease; } @@ -86,7 +86,7 @@ @media (max-width: $tablet) { #header { margin: 0 -20px; - min-height: calc(100vh - 77px); + min-height: calc(100vh - #{$navbar-height-mobile}); } #header-canvas { .text-area { diff --git a/landing-pages/site/assets/scss/_navbar.scss b/landing-pages/site/assets/scss/_navbar.scss index 0de6e6f114b..445575b66d4 100644 --- a/landing-pages/site/assets/scss/_navbar.scss +++ b/landing-pages/site/assets/scss/_navbar.scss @@ -138,10 +138,10 @@ &__drawer { position: fixed; - top: 77px; + top: $navbar-height-mobile; left: 0; width: 100%; - height: calc(100% - 77px); + height: calc(100% - #{$navbar-height-mobile}); background-color: white; transform: translateX(100%); transition: 0.2s ease-out; diff --git a/landing-pages/site/assets/scss/_roadmap.scss b/landing-pages/site/assets/scss/_roadmap.scss index 3f647771f34..440139cb00a 100644 --- a/landing-pages/site/assets/scss/_roadmap.scss +++ b/landing-pages/site/assets/scss/_roadmap.scss @@ -46,9 +46,9 @@ .td-sidebar { position: sticky; - top: 91px; + top: $navbar-height-desktop; height: fit-content; - max-height: calc(100vh - 91px); + max-height: calc(100vh - #{$navbar-height-desktop}); max-width: 270px; min-width: 270px; width: 100%; @@ -200,12 +200,12 @@ .wy-nav-side-toc { position: sticky; - top: 91px; + top: $navbar-height-desktop; overflow-x: hidden; overflow-y: auto; width: 280px; height: fit-content; - max-height: calc(100vh - 91px); + max-height: calc(100vh - #{$navbar-height-desktop}); font-size: 14px; line-height: 1.43; diff --git a/landing-pages/site/assets/scss/_layout.scss b/landing-pages/site/assets/scss/_shared.scss similarity index 79% rename from landing-pages/site/assets/scss/_layout.scss rename to landing-pages/site/assets/scss/_shared.scss index 52a965807c6..63cb51f6d84 100644 --- a/landing-pages/site/assets/scss/_layout.scss +++ b/landing-pages/site/assets/scss/_shared.scss @@ -19,12 +19,16 @@ @import "media"; +$navbar-height-desktop: 90px; +$navbar-height-mobile: 80px; +$landing-page-spacing-y: 40px; + body { @media (max-width: $tablet) { - padding-top: 80px; // navbar offset on mobile and tablet + padding-top: $navbar-height-mobile; // navbar offset on mobile and tablet } @media (min-width: calc(#{$tablet} + 1px)) { - padding-top: 90px; // navbar offset on desktop + padding-top: $navbar-height-desktop; // navbar offset on desktop } } diff --git a/landing-pages/site/assets/scss/main-custom.scss b/landing-pages/site/assets/scss/main-custom.scss index f133eeca6c8..ff0a4e42a25 100644 --- a/landing-pages/site/assets/scss/main-custom.scss +++ b/landing-pages/site/assets/scss/main-custom.scss @@ -21,6 +21,7 @@ @import url('/external/css/Rubik.css'); @import url('/external/css/Roboto.css'); @import url('/external/css/RobotoMono.css'); +@import "shared"; @import "typography"; @import "accordion"; @import "buttons"; @@ -58,7 +59,6 @@ @import "docs"; @import "survey"; @import "suggest-change"; -@import "layout"; /* Theme toggle pill (sun/moon) */ .theme-toggle-pill { From 56ca38f231261e523716b55d3489b1897af35ac2 Mon Sep 17 00:00:00 2001 From: parkhojeong Date: Tue, 12 May 2026 18:06:31 +0900 Subject: [PATCH 7/9] Make landing page navbar sticky --- landing-pages/site/assets/scss/_navbar.scss | 10 +++++++--- landing-pages/site/assets/scss/_shared.scss | 10 ---------- 2 files changed, 7 insertions(+), 13 deletions(-) diff --git a/landing-pages/site/assets/scss/_navbar.scss b/landing-pages/site/assets/scss/_navbar.scss index 445575b66d4..17b63bddfb6 100644 --- a/landing-pages/site/assets/scss/_navbar.scss +++ b/landing-pages/site/assets/scss/_navbar.scss @@ -19,13 +19,17 @@ @import "colors"; @import "media"; -.navbar { - position: fixed; +header { + position: sticky; top: 0; + z-index: 32; +} + +.navbar { + position: static; width: 100%; background-color: white; border-bottom: solid 1px map-get($colors, very-light-pink); - z-index: 32; padding: 14px 60px; flex-wrap: nowrap; align-items: center; diff --git a/landing-pages/site/assets/scss/_shared.scss b/landing-pages/site/assets/scss/_shared.scss index 63cb51f6d84..9851de3bd1f 100644 --- a/landing-pages/site/assets/scss/_shared.scss +++ b/landing-pages/site/assets/scss/_shared.scss @@ -22,13 +22,3 @@ $navbar-height-desktop: 90px; $navbar-height-mobile: 80px; $landing-page-spacing-y: 40px; - -body { - @media (max-width: $tablet) { - padding-top: $navbar-height-mobile; // navbar offset on mobile and tablet - } - - @media (min-width: calc(#{$tablet} + 1px)) { - padding-top: $navbar-height-desktop; // navbar offset on desktop - } -} From a397e40ba56332eef26cedee776afa7ea89bb13d Mon Sep 17 00:00:00 2001 From: parkhojeong Date: Thu, 14 May 2026 11:30:21 +0900 Subject: [PATCH 8/9] Apply consistent navbar spacing across pages --- landing-pages/site/assets/scss/_base-layout.scss | 8 ++++++++ landing-pages/site/assets/scss/_navbar.scss | 10 +++------- 2 files changed, 11 insertions(+), 7 deletions(-) diff --git a/landing-pages/site/assets/scss/_base-layout.scss b/landing-pages/site/assets/scss/_base-layout.scss index 88a1c6905b2..c03c4380590 100644 --- a/landing-pages/site/assets/scss/_base-layout.scss +++ b/landing-pages/site/assets/scss/_base-layout.scss @@ -19,6 +19,14 @@ @import "media"; @import "fonts"; +body { + padding-top: $navbar-height-desktop; + + @media (max-width: $tablet) { + padding-top: $navbar-height-mobile; + } +} + .base-layout { padding: $landing-page-spacing-y 0; diff --git a/landing-pages/site/assets/scss/_navbar.scss b/landing-pages/site/assets/scss/_navbar.scss index 17b63bddfb6..445575b66d4 100644 --- a/landing-pages/site/assets/scss/_navbar.scss +++ b/landing-pages/site/assets/scss/_navbar.scss @@ -19,17 +19,13 @@ @import "colors"; @import "media"; -header { - position: sticky; - top: 0; - z-index: 32; -} - .navbar { - position: static; + position: fixed; + top: 0; width: 100%; background-color: white; border-bottom: solid 1px map-get($colors, very-light-pink); + z-index: 32; padding: 14px 60px; flex-wrap: nowrap; align-items: center; From 6856b6eaef3044c8dff81bda0d45603fd93fa1a4 Mon Sep 17 00:00:00 2001 From: parkhojeong Date: Sat, 16 May 2026 22:08:50 +0900 Subject: [PATCH 9/9] Rename navbar-height vars to fixed-header-offset --- landing-pages/site/assets/scss/_base-layout.scss | 4 ++-- landing-pages/site/assets/scss/_community-page.scss | 4 ++-- landing-pages/site/assets/scss/_content-drawer.scss | 2 +- landing-pages/site/assets/scss/_four-oh-four.scss | 2 +- landing-pages/site/assets/scss/_header.scss | 4 ++-- landing-pages/site/assets/scss/_navbar.scss | 4 ++-- landing-pages/site/assets/scss/_roadmap.scss | 8 ++++---- landing-pages/site/assets/scss/_shared.scss | 4 ++-- 8 files changed, 16 insertions(+), 16 deletions(-) diff --git a/landing-pages/site/assets/scss/_base-layout.scss b/landing-pages/site/assets/scss/_base-layout.scss index c03c4380590..d5b07e7d1cc 100644 --- a/landing-pages/site/assets/scss/_base-layout.scss +++ b/landing-pages/site/assets/scss/_base-layout.scss @@ -20,10 +20,10 @@ @import "fonts"; body { - padding-top: $navbar-height-desktop; + padding-top: $fixed-header-offset-desktop; @media (max-width: $tablet) { - padding-top: $navbar-height-mobile; + padding-top: $fixed-header-offset-mobile; } } diff --git a/landing-pages/site/assets/scss/_community-page.scss b/landing-pages/site/assets/scss/_community-page.scss index d556ffd21ae..0952360b3b0 100644 --- a/landing-pages/site/assets/scss/_community-page.scss +++ b/landing-pages/site/assets/scss/_community-page.scss @@ -94,8 +94,8 @@ overflow-y: auto; height: 100px; padding-left: 30px; - max-height: -webkit-calc(100vh - #{$navbar-height-desktop}); - max-height: calc(100vh - #{$navbar-height-desktop}); + max-height: -webkit-calc(100vh - #{$fixed-header-offset-desktop}); + max-height: calc(100vh - #{$fixed-header-offset-desktop}); font-size: 14px; line-height: 1.43; } diff --git a/landing-pages/site/assets/scss/_content-drawer.scss b/landing-pages/site/assets/scss/_content-drawer.scss index 4a10147af7e..e053e80f525 100644 --- a/landing-pages/site/assets/scss/_content-drawer.scss +++ b/landing-pages/site/assets/scss/_content-drawer.scss @@ -37,7 +37,7 @@ .content-drawer-container { position: fixed; - top: $navbar-height-mobile; + top: $fixed-header-offset-mobile; left: 0; width: 100%; height: 100%; diff --git a/landing-pages/site/assets/scss/_four-oh-four.scss b/landing-pages/site/assets/scss/_four-oh-four.scss index 23abfbd3fb5..c46e0cf798f 100644 --- a/landing-pages/site/assets/scss/_four-oh-four.scss +++ b/landing-pages/site/assets/scss/_four-oh-four.scss @@ -18,7 +18,7 @@ */ .four-oh-four { - height: calc(100vh - #{$navbar-height-desktop}); + height: calc(100vh - #{$fixed-header-offset-desktop}); position: relative; &__text-container { diff --git a/landing-pages/site/assets/scss/_header.scss b/landing-pages/site/assets/scss/_header.scss index 533f2ae54d3..bf4d92c4198 100644 --- a/landing-pages/site/assets/scss/_header.scss +++ b/landing-pages/site/assets/scss/_header.scss @@ -21,7 +21,7 @@ #header { position: relative; margin: 0 -20px; - min-height: calc(100vh - #{$navbar-height-desktop}); + min-height: calc(100vh - #{$fixed-header-offset-desktop}); // background-color is handled by the canvas animation which draws white/dark background transition: background-color 0.3s ease; } @@ -86,7 +86,7 @@ @media (max-width: $tablet) { #header { margin: 0 -20px; - min-height: calc(100vh - #{$navbar-height-mobile}); + min-height: calc(100vh - #{$fixed-header-offset-mobile}); } #header-canvas { .text-area { diff --git a/landing-pages/site/assets/scss/_navbar.scss b/landing-pages/site/assets/scss/_navbar.scss index 445575b66d4..d72c1a9a31a 100644 --- a/landing-pages/site/assets/scss/_navbar.scss +++ b/landing-pages/site/assets/scss/_navbar.scss @@ -138,10 +138,10 @@ &__drawer { position: fixed; - top: $navbar-height-mobile; + top: $fixed-header-offset-mobile; left: 0; width: 100%; - height: calc(100% - #{$navbar-height-mobile}); + height: calc(100% - #{$fixed-header-offset-mobile}); background-color: white; transform: translateX(100%); transition: 0.2s ease-out; diff --git a/landing-pages/site/assets/scss/_roadmap.scss b/landing-pages/site/assets/scss/_roadmap.scss index 440139cb00a..9eddf6541bd 100644 --- a/landing-pages/site/assets/scss/_roadmap.scss +++ b/landing-pages/site/assets/scss/_roadmap.scss @@ -46,9 +46,9 @@ .td-sidebar { position: sticky; - top: $navbar-height-desktop; + top: $fixed-header-offset-desktop; height: fit-content; - max-height: calc(100vh - #{$navbar-height-desktop}); + max-height: calc(100vh - #{$fixed-header-offset-desktop}); max-width: 270px; min-width: 270px; width: 100%; @@ -200,12 +200,12 @@ .wy-nav-side-toc { position: sticky; - top: $navbar-height-desktop; + top: $fixed-header-offset-desktop; overflow-x: hidden; overflow-y: auto; width: 280px; height: fit-content; - max-height: calc(100vh - #{$navbar-height-desktop}); + max-height: calc(100vh - #{$fixed-header-offset-desktop}); font-size: 14px; line-height: 1.43; diff --git a/landing-pages/site/assets/scss/_shared.scss b/landing-pages/site/assets/scss/_shared.scss index 9851de3bd1f..65a81a1e0b0 100644 --- a/landing-pages/site/assets/scss/_shared.scss +++ b/landing-pages/site/assets/scss/_shared.scss @@ -19,6 +19,6 @@ @import "media"; -$navbar-height-desktop: 90px; -$navbar-height-mobile: 80px; +$fixed-header-offset-desktop: 90px; +$fixed-header-offset-mobile: 80px; $landing-page-spacing-y: 40px;