Procházet zdrojové kódy

added the best page yet

master
Lynne Megido před 4 měsíci
rodič
revize
0f18491633
Podepsáno: lynnesbian <lynne@bune.city> ID GPG klíče: F0A184B5213D9F90
7 změnil soubory, kde provedl 98 přidání a 1 odebrání
  1. +11
    -1
      _includes/header.html
  2. +40
    -0
      assets/bll.js
  3. binární
      assets/img/bll-leggy.png
  4. binární
      assets/img/bll-send-pics.png
  5. binární
      assets/img/bll-top.png
  6. +33
    -0
      assets/style.css
  7. +14
    -0
      big-leggy-lynne.html

+ 11
- 1
_includes/header.html Zobrazit soubor

@ -1,11 +1,21 @@
<header>
<span class='internal'>
<a href='/' {%- if page.title == "Welcome!" %} class='current'{% endif -%}>Home</a>
{%- for html_page in site.html_pages -%}
{%- 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 -%}
{%- endfor -%}
<span class='more'>
{%- 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'>

+ 40
- 0
assets/bll.js Zobrazit soubor

@ -0,0 +1,40 @@
// ratio of each part's height to the width of the image (1082px)
var ratios = {
"top": 1.3577,
"leggies": 0.7311,
"bottom": 0.2431
}
// ratio of the image's height to its width
var overall_ratio = 2.3318;
var leggy_factor = 0;
function update_sizes() {
let target_height = window.innerHeight - 300;
let width = target_height / overall_ratio;
if (width > window.innerWidth * 0.90) {
width = window.innerWidth * 0.90;
}
dgel('big-leggy-lynne').style.width = `${width}px`;
for (let [part, ratio] of Object.entries(ratios)) {
dgel(`bll-${part}`).style.height = `${ratio * width}px`;
}
let leggy_height = ratios['leggies'] * width;
dgel('bll-leggies').style.height = `${leggy_height + leggy_factor * 25}px`;
}
window.addEventListener('resize', update_sizes);
window.onload = function () {
this.dgel('bll-enlarge').onclick = function () {
leggy_factor++;
update_sizes();
window.scrollTo({
left: 0,
top: document.body.scrollHeight,
behavior: "smooth"
})
}
update_sizes();
}

binární
assets/img/bll-leggy.png Zobrazit soubor

Před Za
Šířka: 1082  |  Výška: 791  |  Velikost: 35 KiB

binární
assets/img/bll-send-pics.png Zobrazit soubor

Před Za
Šířka: 1082  |  Výška: 263  |  Velikost: 14 KiB

binární
assets/img/bll-top.png Zobrazit soubor

Před Za
Šířka: 1082  |  Výška: 1469  |  Velikost: 239 KiB

+ 33
- 0
assets/style.css Zobrazit soubor

@ -173,6 +173,39 @@ html.night #theme-control::before {
content: "Theme: Night";
}
/*this is very silly do not look*/
#big-leggy-lynne {
margin: 40px auto 0;
width: 10px;
}
#big-leggy-lynne div {
width: 100%;
background-size: 100% 100%;
background-repeat: no-repeat;
}
#bll-top {
background: url('/assets/img/bll-top.png');
}
#bll-leggies {
transition: 0.3s all;
background: url('/assets/img/bll-leggy.png');
}
#bll-bottom {
background: url('/assets/img/bll-send-pics.png');
}
#bll-enlarge {
background: mediumpurple;
border: none;
cursor: pointer;
color: white;
font-size: 2em;
padding: 10px;
margin: 30px auto;
display: block;
}
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
#main {
width: 95%;

+ 14
- 0
big-leggy-lynne.html Zobrazit soubor

@ -0,0 +1,14 @@
---
title: Big Leggy Lynne
layout: default
less_important: true
---
<script src='/assets/bll.js'></script>
<!--<h1>She is Already Here</h1>-->
<div id='big-leggy-lynne'>
<div id='bll-top'></div>
<div id='bll-leggies'></div>
<div id='bll-bottom'></div>
</div>
<button id='bll-enlarge'>Enlarge</button>

Načítá se…
Zrušit
Uložit