lynnesbian/lynnesbian.space
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

changed the way the header is laid out, fixing some really minor bugs

Browse source
This commit is contained in:
Lynne Megido 2020-03-26 15:24:08 +10:00
parent 2ae67f2553
commit 8ab07abbc4
Signed by: lynnesbian
GPG key ID: F0A184B5213D9F90
3 changed files with 51 additions and 37 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
_includes/header.html
View file

@ -2,31 +2,29 @@
<header id='header'>
<h1>Menu</h1>
<span class='internal'>
<div class='lynnesoft desktop'></div>
<a href='/' {%- if page.title == "Welcome!" %} class='current'{% endif -%}>Home</a>
{%- assign main_pages = site.html_pages | where: "less_important", null -%}
{%- assign less_important = site.html_pages | where: "less_important", true -%}
<div class='lynnesoft desktop'></div>
<a href='/' {%- if page.title == "Welcome!" %} class='current'{% endif -%}>Home</a>
{%- assign main_pages = site.html_pages | where: "less_important", null -%}
{%- assign less_important = site.html_pages | where: "less_important", true -%}
{%- for html_page in main_pages -%}
{%- unless html_page.url == '/' -%}
<a href='{{ html_page.url }}' {%- if page.title == html_page.title %} class='current'{% endif -%}>{{ html_page.title }}</a>
{%- endunless -%}
{%- for html_page in main_pages -%}
{%- unless html_page.url == '/' -%}
<a href='{{ html_page.url }}' {%- if page.title == html_page.title %} class='current'{% endif -%}>{{ html_page.title }}</a>
{%- endunless -%}
{%- endfor -%}
<span class='more'>
<div id='show-more'><!--sir... it's the demons again... they're pinging the-->&hellip;</div>
{%- comment -%} todo: maybe make this collapsible? {%- endcomment -%}
{%- for html_page in less_important -%}
<a href='{{ html_page.url }}' {%- if page.title == html_page.title %} class='current'{% endif -%}>{{ html_page.title }}</a>
{%- endfor -%}
<span class='more'>
<div id='show-more'><!--sir... it's the demons again... they're pinging the-->&hellip;</div>
{%- comment -%} todo: maybe make this collapsible? {%- endcomment -%}
{%- for html_page in less_important -%}
<a href='{{ html_page.url }}' {%- if page.title == html_page.title %} class='current'{% endif -%}>{{ html_page.title }}</a>
{%- endfor -%}
</span>
</span>
<span class='other'>
<a href='https://bune.city'>Blog</a><a href='https://github.com/lynnesbian'>GitHub</a><a href='https://git.bune.city/lynnesbian'>Gitea</a>
<div id='spacer'></div>
<span id='theme-control'></span>
</span>
<a href='https://bune.city'>Blog</a><a href='https://github.com/lynnesbian'>GitHub</a><a href='https://git.bune.city/lynnesbian'>Gitea</a>
<span id='theme-control'></span>
<div class='lynnesoft mobile'></div>
</header>

2
assets/big-thicc-quiz-of-the-lynne.js
View file

@ -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,

46
assets/style.css
View file

@ -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;
}