erin
/
website
1
1
Fork 0
Code Issues Pull Requests Releases Activity

Basic redesign

This commit is contained in:
~erin 2022-06-19 19:34:24 -04:00
parent 64c9f498e3
commit 6daf5f434c
No known key found for this signature in database
GPG Key ID: DA70E064A8C70F44
9 changed files with 85 additions and 160 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
_includes/footer.liquid
View File

@ -1,50 +1,44 @@
<footer class="section"> <div class="footer">
<div class="inner-section"> <footer>
<ul> <ul class="container">
<li><h3>Copyright:</h3></li> <li class="item-left">
<h3>Copyright:</h3>
<li><a class="license" href="/cnpl.html">© CNPLv7+</a></li> <p>Code licensed under the <span><a class="license" href="/cnpl.html">© CNPLv7+</a></span></p>
<li>
<!--<p>Pride badges by <span><a href="https://matthil.de/">matthilde</a></span> under public domain</p>--> <!--<p>Pride badges by <span><a href="https://matthil.de/">matthilde</a></span> under public domain</p>-->
<p>Fira Code Font <span><a href="https://github.com/tonsky/FiraCode/blob/master/LICENSE">SIL Open Font License</a></span></p> <p>Fira Code Font <span><a href="https://github.com/tonsky/FiraCode/blob/master/LICENSE">SIL Open Font License</a></span></p>
<p>Generated using <span><a href="https://cobalt-org.github.io/">cobalt</a></span></p> <p>Generated using <span><a href="https://cobalt-org.github.io/">cobalt</a></span></p>
</li> </li>
<li><h3>Mirrors:</h3></li> <li class="item-middle">
<h3>Mirrors:</h3>
<li> <b><a href="http://pqr366modvw3zz3io4s3azvketwmubcnviw4tt7okyzrmoleh5gjbqyd.onion">Onion</a></b>
<a href="http://pqr366modvw3zz3io4s3azvketwmubcnviw4tt7okyzrmoleh5gjbqyd.onion">Onion</a> <br>
<a href="gemini://the-system.eu.org">Gemini</a> <b><a href="gemini://the-system.eu.org">Gemini</a></b>
</li> </li>
<li><h3> <li class="item-right">
<span><a href="https://emreed.net/LowTech_Directory.html">🔗</a> <h3>Webrings</h3>
</span> Low-Tech Webring: <h4>
</h3></li> <span><a href="https://emreed.net/LowTech_Directory.html">🔗</a>
</span> Low-Tech Webring:
</h4>
<li> <a href="https://sadgrl.online">Sadness</a>
<a href="https://sadgrl.online">Sadness</a> <span><--></span>
<span><--></span> <a href="https://mrshll.com">mrshll</a>
<a href="https://mrshll.com">mrshll</a>
</li>
<li><h3> <h4>
<span><a href="https://ring.bicompact.space">🔗</a> <span><a href="https://ring.bicompact.space">🔗</a>
</span> Armisael Webring: </span> Armisael Webring:
</h3></li> </h4>
<li>
<a href="https://5snb.club">5225225</a>
<span><--></span>
<a href="https://unix.lgbt/~kakuko/sanctuary">syntropy</a>
</li>
<li class="badges"> <a href="https://5snb.club">5225225</a>
<img src="/assets/badges/queer.png" alt="Maintained by a queer folk" width="64" height="32"> <span><--></span>
<img src="/assets/badges/socks.png" alt="Always wear your programming socks" width="129" heigh="38"> <a href="https://unix.lgbt/~kakuko/sanctuary">syntropy</a>
<img src="/assets/badges/estrogen.webp" alt="powered by estrogen" width="179" height="62"> </li>
</li>
</ul> </ul>
</div>
<a rel="me" href="https://transmom.love/@erin" style="display:none"></a> <a rel="me" href="https://transmom.love/@erin" style="display:none"></a>
</footer> </footer>
</div>

2
_includes/navigation.liquid
View File

@ -1,3 +1,4 @@
<div class="menu">
<nav> <nav>
<ul> <ul>
<li class="one"><a class="button" href="/">Home</a></li> <li class="one"><a class="button" href="/">Home</a></li>
@ -8,3 +9,4 @@
<li class="six"><a class="button" href="/rss.xml">RSS</a></li> <li class="six"><a class="button" href="/rss.xml">RSS</a></li>
</ul> </ul>
</nav> </nav>
</div>

8
_layouts/default.liquid
View File

@ -5,14 +5,14 @@
</head> </head>
<body> <body>
{% include "navigation.liquid" %}
<div class="center">
<div class="content"> <div class="content">
{% include "navigation.liquid" %}
<div class="main">
<main> <main>
{{ page.content }} {{ page.content }}
</main> </main>
</div> </div>
</div>
{% include "footer.liquid" %} {% include "footer.liquid" %}
</div>
</body> </body>
</html> </html>

37
_scss/_base.scss
View File

@ -3,33 +3,28 @@ html {
font-size: 1.1em; font-size: 1.1em;
font-family: 'Atkinson Hyperlegible', sans-serif; font-family: 'Atkinson Hyperlegible', sans-serif;
color: $foreground-color; color: $foreground-color;
background: $background-color;
line-height: 1.50; line-height: 1.50;
background-image: url("assets/stars4.gif"); background-image: url('/assets/mushrooms.jpg');
background-repeat: repeat;
} }
@media only screen and (min-width: 600px) { .header { grid-area: header; }
.center { .menu { grid-area: menu; }
background-color: $background-color; .main {
width: 50%; grid-area: main;
text-align: center; background: $background-color;
margin: auto;
border: 5px solid #96CDFB;
}
}
@media only screen and (max-width: 600px) {
.center {
background-color: $background-color;
text-align: center;
margin: 10px; margin: 10px;
border: 5px solid #96CDFB; margin-left: 0px;
} padding: 20px;
border-radius: 2px;
} }
.footer { grid-area: footer; }
.content { .content {
margin: 5%; display: grid;
grid-template-areas:
'header header header header header header'
'menu main main main main main'
'menu footer footer footer footer footer';
gap: 10px;
padding: 10px; padding: 10px;
text-align: left;
} }

65
_scss/_footer.scss
View File

@ -1,52 +1,27 @@
@media only screen and (min-width: 600px) {
footer {
margin: auto;
margin-top: 5%;
margin-bottom: 5%;
width: 20%;
border: 5px solid #ABE9B3;
ul {
list-style: none;
margin: auto;
padding: 10px;
display: grid;
li {
h3 {
padding-top: 15px;
margin-top: auto;
}
text-align: center;
}
}
}
}
@media only screen and (max-width: 600px) {
footer { footer {
background: $background-color;
h1, h2, h3 { margin-left: 0px; margin-top: 0px;}
h4 { margin-left: 0px; }
padding: 20px;
margin: 10px; margin: 10px;
margin-top: 5%; margin-left: auto;
margin-bottom: 5%; border-radius: 2px;
border: 5px solid #ABE9B3;
ul { ul {
list-style: none; list-style: none;
margin: auto; color: $foreground-color;
padding: 10px; }
display: grid;
li { .item-left { grid-area: item-left; };
h3 { .item-middle { grid-area: item-middle; };
margin-top: auto; .item-right { grid-area: item-right; };
}
text-align: center; .container {
} margin: 0px;
padding-left: 0px;
display: grid;
grid-template-columns: 500px 250px 250px;
grid-template-rows: auto;
grid-template-areas: "item-left item-middle item-right";
} }
} }
}
.badges {
padding-top: 15px;
}

7
_scss/_formatting.scss
View File

@ -1,16 +1,13 @@
h1 {
border-bottom: 5px solid #F28FAD;
}
h2 { h2 {
margin-top: 1cm; margin-top: 1cm;
margin-bottom: 0; margin-bottom: 0;
border-bottom: 3px solid #F8BD96; margin-left: 5px;
} }
h3 { h3 {
margin-top: 1cm; margin-top: 1cm;
margin-bottom: 0; margin-bottom: 0;
margin-left: 10px;
} }
a { a {

46
_scss/_navigation.scss
View File

@ -1,11 +1,8 @@
@media only screen and (min-width: 600px) {
nav { nav {
max-width: 50%; margin: 10px;
margin: auto; border-radius: 2px;
margin-top: 25px; padding: 20px;
margin-bottom: 5%; background: $background-color;
font-size: 1.3em;
border: 5px solid #DDB6F2;
ul { ul {
list-style: none; list-style: none;
@ -24,38 +21,3 @@ nav {
} }
} }
} }
}
@media only screen and (max-width: 600px) {
nav {
margin: 10px;
list-style: none;
font-size: 1.3em;
border: 5px solid #DDB6F2;
ul {
list-style: none;
padding: 0px;
margin: auto;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 10px;
grid-auto-rows: minmax(50px, auto);
align-content: center;
li {
padding: 0px;
margin: auto;
font-weight: bold;
text-align: center;
a {
text-decoration: none;
}
}
}
}
}

BIN
assets/mushrooms.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 612 KiB

6
style.scss
View File

@ -1,5 +1,5 @@
$background-color: #161320; $background-color: #F9F6F0;
$foreground-color: #D9E0EE; $foreground-color: #241A11;
$accent-color: #F2CDCD; $accent-color: #cd2b29;
@import '_scss/base', '_scss/formatting', '_scss/footer', '_scss/navigation'; @import '_scss/base', '_scss/formatting', '_scss/footer', '_scss/navigation';