diff --git a/_data/contact.yml b/_data/contact.yml index ff5bddd..354e464 100644 --- a/_data/contact.yml +++ b/_data/contact.yml @@ -1,7 +1,7 @@ - heading: Social entries: - [lynne@bune.city, "mailto:lynne@bune.city"] - - ["@lynnesbian@fedi.lynnesbian.space", https://fedi.lynnesbian.space/@lynnesbian] + - ["@lynnesbian@fedi.lynnesbian.space", https://fedi.lynnesbian.space/@lynnesbian] - [My blog, https://bune.city] - heading: Computer Junk @@ -14,7 +14,7 @@ entries: - [Steam, https://steamcommunity.com/id/lynnesbian] - [Xbox, "https://account.xbox.com/en-au/profile?gamertag=lynnesbian"] - - [SW-4030-6532-7056 (Switch), null] + - [SW-4030-6532-7056 (Switch), null] - heading: Other entries: diff --git a/_includes/header.html b/_includes/header.html index c09a4b8..79cc880 100644 --- a/_includes/header.html +++ b/_includes/header.html @@ -1,6 +1,8 @@ -
+
☰
+ diff --git a/_layouts/default.html b/_layouts/default.html index e89df75..08cd08c 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -3,6 +3,7 @@ + {% if page.layout == 'project' %}Projects - {% endif %}{{ page.title | default: "lynnesbian dot space" }} diff --git a/_projects/fedibooks.md b/_projects/fedibooks.md index a5429fc..3611c3b 100644 --- a/_projects/fedibooks.md +++ b/_projects/fedibooks.md @@ -1,6 +1,6 @@ --- name: FediBooks -description: A web UI for creating "ebooks bots"; bots that learn from your posts and use Markov chains to generate similar posts +description: A web UI for creating "ebooks bots" - bots that learn from your posts and use Markov chains to generate similar posts. source: https://github.com/Lynnesbian/FediBooks website: https://fedibooks.com screenshots: [fedibooks-home.png, fedibooks-bots.png, fedibooks-chat.png] diff --git a/assets/img/lynnesoft-square-small.png b/assets/img/lynnesoft-square-small.png new file mode 100644 index 0000000..45b0f20 Binary files /dev/null and b/assets/img/lynnesoft-square-small.png differ diff --git a/assets/img/lynnesoft-square.png b/assets/img/lynnesoft-square.png new file mode 100644 index 0000000..a1f53bd Binary files /dev/null and b/assets/img/lynnesoft-square.png differ diff --git a/assets/script.js b/assets/script.js index d79aa67..65aa570 100644 --- a/assets/script.js +++ b/assets/script.js @@ -60,4 +60,10 @@ window.addEventListener('DOMContentLoaded', (event) => { theme_set(!theme_get()); update_page_theme(); }; + + dgel('hamburger').onclick = function () { + this.classList.toggle('active'); + dgel('header').classList.toggle('active'); + dgel('main').classList.toggle('active'); + } }); diff --git a/assets/style.css b/assets/style.css index 920d1a0..dd9b52a 100644 --- a/assets/style.css +++ b/assets/style.css @@ -48,9 +48,6 @@ p, ul { margin: 20px auto; line-height: 1.3em; } -p, ul { - font-size: 120%; -} li { margin-top: 3px; } @@ -77,7 +74,7 @@ html.night a { background-size: 2px; } .project, .donation-method { - flex: 1 0 400px; + flex: 1 1 400px; padding: 10px; padding-bottom: 30px; margin: 10px; @@ -132,14 +129,18 @@ header { justify-content: space-between; flex-wrap: wrap; } +header h1 { + display: none; + color: white; + font-size: 2em; +} header span { display: inline-block; } header a { color: white; display: inline-block; - padding: 5px 15px; -} + padding: 5px 15px;} header span:not(#theme-control), header a { height: 100%; } @@ -161,13 +162,31 @@ html.night header a:hover { background-color: #0008; } -#lynnesoft { +.lynnesoft { background: center/contain url('/assets/img/lynnesoft.png') no-repeat; - height: 32px; + height: 30px; width: 32px; display: inline-block; vertical-align: top; } +.lynnesoft.mobile { + display: none; + margin: 0 auto; +} + +#hamburger { + display: none; + color: mediumpurple; + font-size: 2em; + position: fixed; + top: 10px; + left: 10px; + z-index: 1; + transition: 0.2s all; +} +#hamburger.active { + color: white; +} #theme-control { color: white; @@ -224,18 +243,94 @@ html.night #theme-control::before { @media only screen and (min-device-width : 320px) and (max-device-width : 480px) { #main { - width: 95%; + width: 90%; + } + ul { + padding-left: 15px; } p, ul { line-height: 1.6em; } - header { - padding: 0; - } - h1 { - margin-top: 0; - } #screenshots a { max-width: 100%; } -} + + .lynnesoft.desktop { + display: none; + } + .lynnesoft.mobile { + display: block; + } + #hamburger { + display: inline-block; + touch-action: manipulation; + } + header { + flex-direction: column; + flex-wrap: nowrap; + overflow-y:scroll; + padding: 0; + position: fixed; + width: 100vw; + height: 100vh; + top: 0; + 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; */ + } + header.active { + left: 0; + } + html.night header { + background: black; + } + header h1 { + display: block; + } + header span { + width: 100%; + } + header span:not(#theme-control), header a { + height: unset; + } + header a { + display: block; + } + header > span { + padding-bottom: 20px; + } + + #theme-control { + width: max-content; + margin: 0 auto; + display: block; + touch-action: manipulation; + } + + #main.active { + pointer-events: none; + opacity: 0; + } + + .project, .donation-method { + margin: 10px 0; + } + .project { + padding-bottom: unset; + } + .project p { + margin-bottom: 0; + } + .project .footer { + position: relative; + } + .project .footer a { + display: block; + text-align: center; + margin: 3px 0; + } + .project .footer a:not(:last-child)::after { + content: ""; + } +} \ No newline at end of file