diff --git a/assets/stylesheets/components/_app.scss b/assets/stylesheets/components/_app.scss index 2295de19..ee76fe2f 100644 --- a/assets/stylesheets/components/_app.scss +++ b/assets/stylesheets/components/_app.scss @@ -1,3 +1,7 @@ +html._booting { background: $contentBackground; } +body._max-width { background: none; } +html._booting body._max-width { background: $documentBackground; } + ._app { position: relative; z-index: 1; @@ -12,6 +16,7 @@ ._max-width & { margin: 0 auto; max-width: $maxWidth; + background: $contentBackground; box-shadow: 1px 0 $headerBorder, -1px 0 $headerBorder; } } diff --git a/assets/stylesheets/global/_base.scss b/assets/stylesheets/global/_base.scss index 46fadcc1..659b8615 100644 --- a/assets/stylesheets/global/_base.scss +++ b/assets/stylesheets/global/_base.scss @@ -1,7 +1,7 @@ html { height: 100%; font-size: 100%; - background: $contentBackground; + background: $documentBackground; @media #{$mediumScreen} { font-size: 93.75%; } } @@ -17,6 +17,7 @@ body { color: $textColor; word-wrap: break-word; overflow-wrap: break-word; + background: $contentBackground; touch-action: manipulation; -webkit-tap-highlight-color: rgba(black, 0); -webkit-touch-callout: none; diff --git a/assets/stylesheets/global/_variables-dark.scss b/assets/stylesheets/global/_variables-dark.scss index 002e3be6..17129d9f 100644 --- a/assets/stylesheets/global/_variables-dark.scss +++ b/assets/stylesheets/global/_variables-dark.scss @@ -10,6 +10,7 @@ $headerHeight: 3rem; $sidebarWidth: 20rem; $sidebarMediumWidth: 16rem; +$documentBackground: #222; $contentBackground: #33373a; $textColor: #cbd0d0; diff --git a/assets/stylesheets/global/_variables.scss b/assets/stylesheets/global/_variables.scss index 05426f02..bbdedf9f 100644 --- a/assets/stylesheets/global/_variables.scss +++ b/assets/stylesheets/global/_variables.scss @@ -10,6 +10,7 @@ $headerHeight: 3rem; $sidebarWidth: 20rem; $sidebarMediumWidth: 16rem; +$documentBackground: #f3f3f3; $contentBackground: #fff; $textColor: #333;