diff --git a/css/_variables.scss b/css/_variables.scss index 44e34c6e1..a6a8b0dab 100644 --- a/css/_variables.scss +++ b/css/_variables.scss @@ -178,9 +178,12 @@ $welcomePageHeaderBackgroundPosition: none; $welcomePageHeaderBackgroundRepeat: none; $welcomePageHeaderBackgroundSize: none; $welcomePageHeaderPaddingBottom: 0px; +$welcomePageHeaderMinHeight: fit-content; $welcomePageHeaderTextMarginTop: 35px; $welcomePageHeaderTextMarginBottom: 35px; +$welcomePageHeaderTextDisplay: flex; +$welcomePageHeaderTextWidth: 650px; $welcomePageHeaderTextTitleMarginBottom: 16px; $welcomePageHeaderTextTitleFontSize: 2.5rem; @@ -195,6 +198,7 @@ $welcomePageHeaderTextDescriptionLineHeight: 24px; $welcomePageHeaderTextDescriptionMarginBottom: 20px; $welcomePageHeaderTextDescriptionAlignSelf: inherit; +$welcomePageEnterRoomDisplay: flex; $welcomePageEnterRoomWidth: 680px; $welcomePageEnterRoomPadding: 25px 30px; $welcomePageEnterRoomBorderRadius: 0px; diff --git a/css/_welcome_page.scss b/css/_welcome_page.scss index 211da17e2..f2b160edf 100644 --- a/css/_welcome_page.scss +++ b/css/_welcome_page.scss @@ -21,18 +21,18 @@ body.welcome-page { align-items: center; display: flex; flex-direction: column; - min-height: fit-content; + min-height: $welcomePageHeaderMinHeight; overflow: hidden; position: relative; text-align: center; .header-text { - display: flex; + display: $welcomePageHeaderTextDisplay; flex-direction: column; margin-top: $watermarkHeight + $welcomePageHeaderTextMarginTop; margin-bottom: $welcomePageHeaderTextMarginBottom; max-width: calc(100% - 40px); - width: 650px; + width: $welcomePageHeaderTextWidth; z-index: $zindex2; } @@ -56,7 +56,7 @@ body.welcome-page { } #enter_room { - display: flex; + display: $welcomePageEnterRoomDisplay; align-items: center; max-width: calc(100% - 40px); width: $welcomePageEnterRoomWidth;