summary refs log tree commit diff
path: root/styles/layout.css
diff options
context:
space:
mode:
Diffstat (limited to 'styles/layout.css')
-rw-r--r--styles/layout.css32
1 files changed, 7 insertions, 25 deletions
diff --git a/styles/layout.css b/styles/layout.css
index f2b2dba..4a64adb 100644
--- a/styles/layout.css
+++ b/styles/layout.css
@@ -1,6 +1,7 @@
 :root {
   --header-height: 400px;
   --header-overlap: 150px;
+  --min-main-overhang: 100px;
   --header-bar-height: 48px;
   --main-width: 600px;
   --footer-spacing: 8px;
@@ -95,7 +96,7 @@ header .headerBackground {
   top: 0;
   left: 0;
   right: 0;
-  height: 400px;
+  height: var(--header-height);
   z-index: -1;
   user-select: none;
 }
@@ -114,7 +115,7 @@ header .headerBackground::after {
   background: rgba(0,0,0,.35);
 }
 
-header:not(.homepage) + h1 {
+header:not(.homepage) ~ h1.pageTitle {
   width: var(--main-width);
   margin: 0 auto;
   padding: var(--text-padding);
@@ -123,40 +124,21 @@ header:not(.homepage) + h1 {
   margin-top: -80px;
 }
 
-main {
-  font-family: Arial, sans-serif;
-}
-
 main.mainColumn {
   width: var(--main-width);
   box-sizing: border-box;
   padding: var(--text-padding);
   margin: 0 auto;
   background: var(--main-background);
-  min-height: calc(var(--header-overlap) + 100px);
+  min-height: calc(var(--header-overlap) + var(--min-main-overhang));
   box-shadow: 0 5px 5px -3px rgba(0,0,0,.2),0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12);
 }
 
-header.homepage + main.mainColumn {
-  min-height: calc(var(--header-overlap) + 100px - var(--header-bar-height));
-}
-
-main.mainColumn aside.infobar {
-  margin: calc(-1 * var(--text-padding));
-  margin-bottom: var(--text-padding);
-  padding: var(--text-padding);
-  background: var(--main-background);
-  height: var(--header-bar-height);
-  width: var(--main-width);
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  border-bottom: solid 1px var(--text-dimmed);
+header.homepage ~ .mainColumn {
+  min-height: calc(var(--header-overlap) + var(--min-main-overhang) - var(--header-bar-height));
 }
 
-main.mainColumn > p:first-child,
-main.mainColumn .infobar + p {
+main.mainColumn > p:first-child {
   margin-top: 0;
 }