diff --git a/_includes/header.html b/_includes/header.html index 1f00f2a..7680591 100644 --- a/_includes/header.html +++ b/_includes/header.html @@ -2,31 +2,29 @@ diff --git a/assets/big-thicc-quiz-of-the-lynne.js b/assets/big-thicc-quiz-of-the-lynne.js index bfa5e09..86ac27c 100644 --- a/assets/big-thicc-quiz-of-the-lynne.js +++ b/assets/big-thicc-quiz-of-the-lynne.js @@ -21,7 +21,7 @@ var questions = { "have accidentally stolen a library book before": true, "am allergic to gluten": true, "can draw The Cool S": false, - "have written several games for the TI-84+ calculator": true, + "have written several games for the TI-84+ calculator": true, // https://git.bune.city/lynnesbian/ti-basic "can play the trumpet": true, "can play the ukelele": false, "never have to look at the keyboard when typing": false, diff --git a/assets/style.css b/assets/style.css index 9e82d27..3045286 100644 --- a/assets/style.css +++ b/assets/style.css @@ -126,7 +126,7 @@ header { color: white; padding: 0 30px; display: flex; - justify-content: space-between; + /* justify-content: space-between; */ flex-wrap: wrap; user-select: none; } @@ -135,10 +135,6 @@ header h1 { color: white; font-size: 2em; } -header span { - display: inline-block; - text-align: center; -} header a, #show-more { color: white; display: inline-block; @@ -162,6 +158,14 @@ hrml.night #show-more:hover { background-color: #0008; } +.more { + display: contents; +} + +#spacer { + flex-grow: 1; +} + #show-more { display: none; padding: 5px; @@ -170,14 +174,18 @@ hrml.night #show-more:hover { .lynnesoft { background: center/contain url('/assets/img/lynnesoft.png') no-repeat; - height: 30px; + height: 32px; width: 32px; display: inline-block; vertical-align: top; } +.lynnesoft.desktop { + margin-right: 10px; +} .lynnesoft.mobile { display: none; margin: 0 auto; + min-height: 32px; } #hamburger { @@ -222,8 +230,10 @@ html.night #hb-icon { color: white; border: thin white solid; border-radius: 2px; - padding: 2px 10px; + padding: 2px 7px; cursor: pointer; + height: max-content; + margin: auto 0; } #theme-control::before { content: "Theme: Day"; @@ -360,9 +370,6 @@ button, a.button { touch-action: manipulation; } header { - flex-direction: column; - flex-wrap: nowrap; - overflow-y:scroll; padding: 0; position: fixed; width: 100vw; @@ -371,7 +378,9 @@ button, a.button { left: -100vw; justify-content: start; transition: 0.2s all; - /* background: 50% calc(100% - 5px) / 32px 32px url('/assets/img/lynnesoft-square-small.png') mediumpurple no-repeat; */ + flex-direction: column; + flex-wrap: nowrap; + overflow-y: auto; } header.active { left: 0; @@ -382,9 +391,6 @@ button, a.button { header h1 { display: block; } - header span { - width: 100%; - } header span:not(#theme-control), header a { height: unset; } @@ -395,6 +401,16 @@ button, a.button { padding-bottom: 20px; } + header a { + text-align: center; + padding: 10px 0; + } + + #spacer { + flex-grow: 0; + flex-basis: 50px; + } + .more a { display: block; } @@ -404,7 +420,7 @@ button, a.button { #theme-control { width: max-content; - margin: 0 auto; + margin: 20px auto; display: block; touch-action: manipulation; }