marvin/marvinblum
1
0
Fork 0
mirror of https://github.com/Kugelschieber/marvinblum.git synced 2026-01-18 06:40:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

Compare commits

base: marvin:9e4d8ac2bfdc1394ce83473a272f7aeab6dc7653
Branches Tags
marvin:master marvin:old
...
compare: marvin:b41b35734f11620f802b83e35c8e80f4281f9c1e
Branches Tags
marvin:master marvin:old

3 Commits
9e4d8ac2bf ... b41b35734f

Author SHA1 Message Date
Marvin Blum
b41b35734f Improved mobile nav. 2024-08-09 14:15:59 +02:00
Marvin Blum
10c752e6e1 Removed burger.html. 2024-08-09 14:06:28 +02:00
Marvin Blum
7675311970 Improved mobile navigation. 2024-08-09 14:05:07 +02:00
6 changed files with 70 additions and 37 deletions
Expand all files Collapse all files

14
assets/js/main.js
View File

@@ -1 +1,13 @@
console.log("Hi!");
console.log("Hi! Welcome to my website.");
document.addEventListener("DOMContentLoaded", () => {
const nav = document.querySelector("#nav");
document.querySelector(".burger").addEventListener("click", () => {
if (nav.classList.contains("open")) {
nav.classList.remove("open");
} else {
nav.classList.add("open");
}
});
});

20
assets/scss/main.scss
View File

@@ -119,6 +119,8 @@ nav {
gap: 20px;
margin: 0;
padding: 0;
overflow: hidden;
transition: all .5s;
li {
list-style: none;
@@ -149,6 +151,22 @@ nav {
@media screen and (max-width: 580px) {
flex-direction: column;
max-height: 0;
}
}
.open {
max-height: 220px;
}
.burger {
display: none;
width: 42px;
height: 42px;
cursor: pointer;
@media screen and (max-width: 580px) {
display: inline;
}
}
@@ -186,7 +204,7 @@ nav {
}
@media screen and (max-width: 420px) {
padding: 20px;
padding: 0 20px;
}
}

2
static/web/main.css
View File

@@ -1 +1 @@
@font-face{font-family:"Open Sans";font-style:italic;font-weight:normal;font-stretch:100%;font-display:swap;src:url("../font/OpenSans-Italic.ttf") format("truetype")}@font-face{font-family:"Open Sans";font-style:normal;font-weight:normal;font-stretch:100%;font-display:swap;src:url("../font/OpenSans-Regular.ttf") format("truetype")}@font-face{font-family:"Open Sans";font-style:normal;font-weight:bold;font-stretch:100%;font-display:swap;src:url("../font/OpenSans-Bold.ttf") format("truetype")}@font-face{font-family:"Open Sans";font-style:italic;font-weight:bold;font-stretch:100%;font-display:swap;src:url("../font/OpenSans-BoldItalic.ttf") format("truetype")}*{box-sizing:border-box;font-family:"Open Sans",sans-serif;font-size:18px;line-height:2;color:#0f0f0f}@media screen and (max-width: 890px){*{font-size:16px}}body{margin:0;padding:0 0 160px 0}h1,h2{font-size:32px;margin:0 0 40px 0;font-weight:normal}h1 a,h2 a{font-size:32px}@media screen and (max-width: 890px){h1 a,h2 a{font-size:26px}}@media screen and (max-width: 890px){h1,h2{font-size:26px;margin:0 0 20px 0}}h2{margin:40px 0;font-size:26px}@media screen and (max-width: 890px){h2{font-size:20px;margin:20px 0}}a{text-decoration:none;transition:all .3s;color:#717171}a:hover{color:#0f0f0f}p,ul{margin:20px 0}img{display:block;max-width:80%;margin:40px auto}pre{max-width:80%;margin:40px auto;padding:20px;border-width:1px 1px 1px 2px;border-style:solid;border-color:#c0d9f0;border-radius:8px;overflow-x:auto;font-size:14px}code{font-family:"Courier New",Courier,monospace}hr{margin:40px 0;height:2px;background:#e6e6e6;border-width:0}blockquote{margin:40px 0 40px 40px;padding:10px 20px;border-width:0 0 0 2px;border-style:solid;border-color:#c0d9f0}nav{padding:80px 40px;background:#c0d9f0}nav .content{display:flex;justify-content:space-between;align-items:center;max-width:1000px;margin:0 auto}nav .content ul{display:flex;gap:20px;margin:0;padding:0}nav .content ul li{list-style:none;margin:0;padding:0}nav .content ul li a{color:#0f0f0f}nav .content ul li a svg{fill:#0f0f0f;transition:all .3s}nav .content ul li a:hover{color:#717171}nav .content ul li a:hover svg{fill:#717171}@media screen and (max-width: 890px){nav .content ul{gap:10px}}@media screen and (max-width: 580px){nav .content ul{flex-direction:column}}nav .content .contact{display:inline-block;padding:8px 16px;border-radius:8px;border:2px solid #0f0f0f;color:#0f0f0f;transition:all .3s}nav .content .contact:hover{background:#0f0f0f;color:#fff}@media screen and (max-width: 890px){nav .content .contact{padding:4px 8px}}@media screen and (max-width: 890px){nav .content{padding:40px;align-items:flex-start}}@media screen and (max-width: 420px){nav .content{padding:20px 0}}@media screen and (max-width: 890px){nav{padding:0}}@media screen and (max-width: 420px){nav{padding:20px}}section{max-width:1080px;margin:80px auto 0 auto;padding:0 40px}@media screen and (max-width: 890px){section{margin:40px auto 0 auto}}@media screen and (max-width: 420px){section{padding:0 20px}}footer{max-width:1080px;margin:80px auto 0 auto;padding:0 40px}footer .content{max-width:1000px;margin:0 auto;border-style:solid;border-width:2px 0 0 0;border-color:#e6e6e6;padding:40px 0}@media screen and (max-width: 420px){footer{padding:0 20px}}.intro{background:#c0d9f0;max-width:100%;padding:0 40px 80px 40px;margin:0}.intro article{max-width:1000px;margin:0 auto;display:flex;gap:40px;justify-content:flex-start;align-items:center}.intro article h1{margin:0}.intro article img{max-width:196px;max-height:196px;aspect-ratio:1;border-radius:8px}@media screen and (max-width: 890px){.intro article img{max-width:142px;max-height:142px}}@media screen and (max-width: 600px){.intro article img{margin:0}}@media screen and (max-width: 600px){.intro article{flex-direction:column;align-items:flex-start}}@media screen and (max-width: 600px){.intro{padding:0 40px 40px 40px}}@media screen and (max-width: 420px){.intro{padding:0 20px 40px 20px}}.blog-entry{margin-bottom:0}.blog-entry p{margin:0;color:#717171}.blog-entry h2{margin:0}.blog-entry a{color:#0f0f0f;font-size:26px}.blog-entry a:hover{color:#717171}@media screen and (max-width: 890px){.blog-entry a{font-size:20px}}/*# sourceMappingURL=main.css.map */
@font-face{font-family:"Open Sans";font-style:italic;font-weight:normal;font-stretch:100%;font-display:swap;src:url("../font/OpenSans-Italic.ttf") format("truetype")}@font-face{font-family:"Open Sans";font-style:normal;font-weight:normal;font-stretch:100%;font-display:swap;src:url("../font/OpenSans-Regular.ttf") format("truetype")}@font-face{font-family:"Open Sans";font-style:normal;font-weight:bold;font-stretch:100%;font-display:swap;src:url("../font/OpenSans-Bold.ttf") format("truetype")}@font-face{font-family:"Open Sans";font-style:italic;font-weight:bold;font-stretch:100%;font-display:swap;src:url("../font/OpenSans-BoldItalic.ttf") format("truetype")}*{box-sizing:border-box;font-family:"Open Sans",sans-serif;font-size:18px;line-height:2;color:#0f0f0f}@media screen and (max-width: 890px){*{font-size:16px}}body{margin:0;padding:0 0 160px 0}h1,h2{font-size:32px;margin:0 0 40px 0;font-weight:normal}h1 a,h2 a{font-size:32px}@media screen and (max-width: 890px){h1 a,h2 a{font-size:26px}}@media screen and (max-width: 890px){h1,h2{font-size:26px;margin:0 0 20px 0}}h2{margin:40px 0;font-size:26px}@media screen and (max-width: 890px){h2{font-size:20px;margin:20px 0}}a{text-decoration:none;transition:all .3s;color:#717171}a:hover{color:#0f0f0f}p,ul{margin:20px 0}img{display:block;max-width:80%;margin:40px auto}pre{max-width:80%;margin:40px auto;padding:20px;border-width:1px 1px 1px 2px;border-style:solid;border-color:#c0d9f0;border-radius:8px;overflow-x:auto;font-size:14px}code{font-family:"Courier New",Courier,monospace}hr{margin:40px 0;height:2px;background:#e6e6e6;border-width:0}blockquote{margin:40px 0 40px 40px;padding:10px 20px;border-width:0 0 0 2px;border-style:solid;border-color:#c0d9f0}nav{padding:80px 40px;background:#c0d9f0}nav .content{display:flex;justify-content:space-between;align-items:center;max-width:1000px;margin:0 auto}nav .content ul{display:flex;gap:20px;margin:0;padding:0;overflow:hidden;transition:all .5s}nav .content ul li{list-style:none;margin:0;padding:0}nav .content ul li a{color:#0f0f0f}nav .content ul li a svg{fill:#0f0f0f;transition:all .3s}nav .content ul li a:hover{color:#717171}nav .content ul li a:hover svg{fill:#717171}@media screen and (max-width: 890px){nav .content ul{gap:10px}}@media screen and (max-width: 580px){nav .content ul{flex-direction:column;max-height:0}}nav .content .open{max-height:220px}nav .content .burger{display:none;width:42px;height:42px;cursor:pointer}@media screen and (max-width: 580px){nav .content .burger{display:inline}}nav .content .contact{display:inline-block;padding:8px 16px;border-radius:8px;border:3px solid #0f0f0f;color:#0f0f0f;transition:all .3s;font-weight:600}nav .content .contact:hover{background:#0f0f0f;color:#fff}@media screen and (max-width: 890px){nav .content .contact{padding:4px 8px}}@media screen and (max-width: 890px){nav .content{padding:40px;align-items:flex-start}}@media screen and (max-width: 420px){nav .content{padding:20px 0}}@media screen and (max-width: 890px){nav{padding:0}}@media screen and (max-width: 420px){nav{padding:0 20px}}section{max-width:1080px;margin:80px auto 0 auto;padding:0 40px}@media screen and (max-width: 890px){section{margin:40px auto 0 auto}}@media screen and (max-width: 420px){section{padding:0 20px}}footer{max-width:1080px;margin:80px auto 0 auto;padding:0 40px}footer .content{max-width:1000px;margin:0 auto;border-style:solid;border-width:2px 0 0 0;border-color:#e6e6e6;padding:40px 0}@media screen and (max-width: 420px){footer{padding:0 20px}}.intro{background:#c0d9f0;max-width:100%;padding:0 40px 80px 40px;margin:0}.intro article{max-width:1000px;margin:0 auto;display:flex;gap:40px;justify-content:flex-start;align-items:center}.intro article h1{margin:0}.intro article img{max-width:196px;max-height:196px;aspect-ratio:1;border-radius:8px}@media screen and (max-width: 890px){.intro article img{max-width:142px;max-height:142px}}@media screen and (max-width: 600px){.intro article img{margin:0}}@media screen and (max-width: 600px){.intro article{flex-direction:column;align-items:flex-start}}@media screen and (max-width: 600px){.intro{padding:0 40px 40px 40px}}@media screen and (max-width: 420px){.intro{padding:0 20px 40px 20px}}.blog-entry{margin-bottom:0}.blog-entry p{margin:0;color:#717171}.blog-entry h2{margin:0}.blog-entry a{color:#0f0f0f;font-size:26px}.blog-entry a:hover{color:#717171}@media screen and (max-width: 890px){.blog-entry a{font-size:20px}}/*# sourceMappingURL=main.css.map */

2
static/web/main.css.map
View File

@@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../../assets/scss/_font.scss","../../assets/scss/main.scss"],"names":[],"mappings":"AAAA,WACI,wBACA,kBACA,mBACA,kBACA,kBACA,0DAGJ,WACI,wBACA,kBACA,mBACA,kBACA,kBACA,2DAGJ,WACI,wBACA,kBACA,iBACA,kBACA,kBACA,wDAGJ,WACI,wBACA,kBACA,iBACA,kBACA,kBACA,8DCzBJ,EACC,sBACA,mCACA,eACA,cACA,MAVW,QAYX,qCAPD,EAQE,gBAIF,KACC,SACA,oBAGD,MACC,eACA,kBACA,mBAEA,UACC,eAEA,qCAHD,UAIE,gBAIF,qCAbD,MAcE,eACA,mBAIF,GACC,cACA,eAEA,qCAJD,GAKE,eACA,eAIF,EACC,qBACA,mBACA,MArDW,QAuDX,QACC,MAzDU,QA6DZ,KACC,cAGD,IACC,cACA,cACA,iBAGD,IACC,cACA,iBACA,aACA,6BACA,mBACA,aA1EW,QA2EX,cA/Ec,IAgFd,gBACA,eAGD,KACC,4CAGD,GACC,cACA,WACA,WAxFW,QAyFX,eAGD,WACC,wBACA,kBACA,uBACA,mBACA,aAhGW,QAmGZ,IACC,kBACA,WArGW,QAuGX,aACC,aACA,8BACA,mBACA,iBACA,cAEA,gBACC,aACA,SACA,SACA,UAEA,mBACC,gBACA,SACA,UAEA,qBACC,MA7HO,QA+HP,yBACC,KAhIM,QAiIN,mBAGD,2BACC,MApIM,QAsIN,+BACC,KAvIK,QA6IT,qCA7BD,gBA8BE,UAGD,qCAjCD,gBAkCE,uBAIF,sBACC,qBACA,iBACA,cA3JY,IA4JZ,yBACA,MA5JS,QA6JT,mBAEA,4BACC,WAhKQ,QAiKR,WAGD,qCAbD,sBAcE,iBAIF,qCA/DD,aAgEE,aACA,wBAGD,qCApED,aAqEE,gBAIF,qCA7ED,IA8EE,WAGD,qCAjFD,IAkFE,cAIF,QACC,iBACA,wBACA,eAEA,qCALD,QAME,yBAGD,qCATD,QAUE,gBAIF,OACC,iBACA,wBACA,eAEA,gBACC,iBACA,cACA,mBACA,uBACA,aAlNU,QAmNV,eAGD,qCAdD,OAeE,gBAIF,OACC,WA3NW,QA4NX,eACA,yBACA,SAEA,eACC,iBACA,cACA,aACA,SACA,2BACA,mBAEA,kBACC,SAGD,mBACC,gBACA,iBACA,eACA,cApPY,IAsPZ,qCAND,mBAOE,gBACA,kBAGD,qCAXD,mBAYE,UAIF,qCA5BD,eA6BE,sBACA,wBAIF,qCAxCD,OAyCE,0BAGD,qCA5CD,OA6CE,0BAIF,YACC,gBAEA,cACC,SACA,MAlRU,QAqRX,eACC,SAGD,cACC,MA3RU,QA4RV,eAEA,oBACC,MA9RS,QAiSV,qCARD,cASE","file":"main.css"}
{"version":3,"sourceRoot":"","sources":["../../assets/scss/_font.scss","../../assets/scss/main.scss"],"names":[],"mappings":"AAAA,WACI,wBACA,kBACA,mBACA,kBACA,kBACA,0DAGJ,WACI,wBACA,kBACA,mBACA,kBACA,kBACA,2DAGJ,WACI,wBACA,kBACA,iBACA,kBACA,kBACA,wDAGJ,WACI,wBACA,kBACA,iBACA,kBACA,kBACA,8DCzBJ,EACC,sBACA,mCACA,eACA,cACA,MAVW,QAYX,qCAPD,EAQE,gBAIF,KACC,SACA,oBAGD,MACC,eACA,kBACA,mBAEA,UACC,eAEA,qCAHD,UAIE,gBAIF,qCAbD,MAcE,eACA,mBAIF,GACC,cACA,eAEA,qCAJD,GAKE,eACA,eAIF,EACC,qBACA,mBACA,MArDW,QAuDX,QACC,MAzDU,QA6DZ,KACC,cAGD,IACC,cACA,cACA,iBAGD,IACC,cACA,iBACA,aACA,6BACA,mBACA,aA1EW,QA2EX,cA/Ec,IAgFd,gBACA,eAGD,KACC,4CAGD,GACC,cACA,WACA,WAxFW,QAyFX,eAGD,WACC,wBACA,kBACA,uBACA,mBACA,aAhGW,QAmGZ,IACC,kBACA,WArGW,QAuGX,aACC,aACA,8BACA,mBACA,iBACA,cAEA,gBACC,aACA,SACA,SACA,UACA,gBACA,mBAEA,mBACC,gBACA,SACA,UAEA,qBACC,MA/HO,QAiIP,yBACC,KAlIM,QAmIN,mBAGD,2BACC,MAtIM,QAwIN,+BACC,KAzIK,QA+IT,qCA/BD,gBAgCE,UAGD,qCAnCD,gBAoCE,sBACA,cAIF,mBACC,iBAGD,qBACC,aACA,WACA,YACA,eAEA,qCAND,qBAOE,gBAIF,sBACC,qBACA,iBACA,cA7KY,IA8KZ,yBACA,MA9KS,QA+KT,mBACA,gBAEA,4BACC,WAnLQ,QAoLR,WAGD,qCAdD,sBAeE,iBAIF,qCAlFD,aAmFE,aACA,wBAGD,qCAvFD,aAwFE,gBAIF,qCAhGD,IAiGE,WAGD,qCApGD,IAqGE,gBAIF,QACC,iBACA,wBACA,eAEA,qCALD,QAME,yBAGD,qCATD,QAUE,gBAIF,OACC,iBACA,wBACA,eAEA,gBACC,iBACA,cACA,mBACA,uBACA,aArOU,QAsOV,eAGD,qCAdD,OAeE,gBAIF,OACC,WA9OW,QA+OX,eACA,yBACA,SAEA,eACC,iBACA,cACA,aACA,SACA,2BACA,mBAEA,kBACC,SAGD,mBACC,gBACA,iBACA,eACA,cAvQY,IAyQZ,qCAND,mBAOE,gBACA,kBAGD,qCAXD,mBAYE,UAIF,qCA5BD,eA6BE,sBACA,wBAIF,qCAxCD,OAyCE,0BAGD,qCA5CD,OA6CE,0BAIF,YACC,gBAEA,cACC,SACA,MArSU,QAwSX,eACC,SAGD,cACC,MA9SU,QA+SV,eAEA,oBACC,MAjTS,QAoTV,qCARD,cASE","file":"main.css"}

2
static/web/main.min.js vendored
View File

@@ -1 +1 @@
(()=>{console.log("Hi!");})();
(()=>{console.log("Hi! Welcome to my website.");document.addEventListener("DOMContentLoaded",()=>{let e=document.querySelector("#nav");document.querySelector(".burger").addEventListener("click",()=>{e.classList.contains("open")?e.classList.remove("open"):e.classList.add("open")})});})();

5
tpl/nav.html
View File

@@ -1,6 +1,8 @@
<nav>
<div class="content">
<ul>
<div style="display: flex;flex-direction: column;gap: 4px;">
<svg class="burger" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512" xml:space="preserve"><g><g><circle cx="290.909" cy="104.727" r="11.636"/></g></g><g><g><circle cx="151.273" cy="104.727" r="11.636"/></g></g><g><g><circle cx="256" cy="151.273" r="11.636"/></g></g><g><g><circle cx="325.818" cy="151.273" r="11.636"/></g></g><g><g><circle cx="360.727" cy="104.727" r="11.636"/></g></g><g><g><circle cx="395.636" cy="151.273" r="11.636"/></g></g><g><g><circle cx="116.364" cy="151.273" r="11.636"/></g></g><g><g><circle cx="221.091" cy="104.727" r="11.636"/></g></g><g><g><circle cx="186.182" cy="151.273" r="11.636"/></g></g><g><g><path d="M256,11.636c-132.655,0-232.727,65.164-232.727,151.273v23.273c0,19.782,15.127,34.909,34.909,34.909h395.636c19.782,0,34.909-15.127,34.909-34.909v-23.273C488.727,76.8,388.655,11.636,256,11.636z M465.455,186.182c0,6.982-4.655,11.636-11.636,11.636H58.182c-6.982,0-11.636-4.655-11.636-11.636v-23.273c0-72.146,91.927-128,209.455-128s209.455,55.854,209.455,128V186.182z"/></g></g><g><g><path d="M477.091,244.364h-26.764c-15.127,0-30.255,5.818-40.727,17.455l-23.273,23.273c-13.964,13.964-36.073,13.964-48.873,0l-23.273-23.273c-10.473-10.473-25.6-17.455-40.727-17.455H34.909c-6.982,0-11.636,4.655-11.636,11.636c0,6.982,4.655,11.636,11.636,11.636h236.218c9.309,0,18.618,3.491,24.436,10.473l23.273,23.273c11.636,11.636,26.764,17.455,40.727,17.455c13.964,0,30.255-5.818,40.727-17.455l23.273-23.273c6.982-6.982,15.127-10.473,24.436-10.473h29.091c6.982,0,11.636-4.655,11.636-11.636C488.727,249.018,484.073,244.364,477.091,244.364z"/></g></g><g><g><path d="M453.818,384H58.182c-19.782,0-34.909,15.127-34.909,34.909v23.273c0,32.582,25.6,58.182,58.182,58.182h349.091c32.582,0,58.182-25.6,58.182-58.182v-23.273C488.727,399.127,473.6,384,453.818,384z M465.455,442.182c0,19.782-15.127,34.909-34.909,34.909H81.455c-19.782,0-34.909-15.127-34.909-34.909v-23.273c0-6.982,4.655-11.636,11.636-11.636h395.636c6.982,0,11.636,4.655,11.636,11.636V442.182z"/></g></g><g><g><path d="M477.091,290.909h-23.273c-6.982,0-11.636,4.655-11.636,11.636s4.655,11.636,11.636,11.636h23.273c6.982,0,11.636,4.655,11.636,11.636s-4.655,11.636-11.636,11.636H34.909c-6.982,0-11.636-4.655-11.636-11.636s4.655-11.636,11.636-11.636h232.727c6.982,0,11.636-4.655,11.636-11.636s-4.655-11.636-11.636-11.636H34.909C15.127,290.909,0,306.036,0,325.818c0,19.782,15.127,34.909,34.909,34.909h442.182c19.782,0,34.909-15.127,34.909-34.909C512,306.036,496.873,290.909,477.091,290.909z"/></g></g></svg>
<ul id="nav">
<li>
<a href="/">Home</a>
</li>
@@ -32,6 +34,7 @@
</a>
</li>
</ul>
</div>
<div>
<a href="mailto:marvin.blum@emvi.com" class="contact">Contact me</a>
</div>