Compare commits
3 Commits
| Author | SHA1 | Date |
|---|---|---|
 ~erin
|
abb6e07056 | |
|
~erin
|
5c0edca9a6 | |
|
~erin
|
d73f80da6d |
|
|
@ -6,9 +6,9 @@
|
|||
|
||||
<body>
|
||||
{% include "navigation.liquid" %}
|
||||
<div class="section">
|
||||
<div class="inner-section">
|
||||
<main>
|
||||
<div class="center">
|
||||
<div class="content">
|
||||
<main>
|
||||
{{ page.content }}
|
||||
{% for post in collections.posts.pages %}
|
||||
<article>
|
||||
|
|
@ -25,9 +25,9 @@
|
|||
</i></p>
|
||||
</article>
|
||||
{% endfor %}
|
||||
</main>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
{% include "footer.liquid" %}
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -6,13 +6,13 @@
|
|||
|
||||
<body>
|
||||
{% include "navigation.liquid" %}
|
||||
<div class="section">
|
||||
<div class="inner-section">
|
||||
<main>
|
||||
{{ page.content }}
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
<div class="center">
|
||||
<div class="content">
|
||||
<main>
|
||||
{{ page.content }}
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
{% include "footer.liquid" %}
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,34 +1,35 @@
|
|||
html {
|
||||
image-rendering: pixelated;
|
||||
image-rendering: crisp-edges;
|
||||
font-size: 16px;
|
||||
font-size: 1.1em;
|
||||
font-family: 'Atkinson Hyperlegible', sans-serif;
|
||||
color: $foreground-color;
|
||||
background: $background-color;
|
||||
line-height: 1.50;
|
||||
background: $background-color;
|
||||
background-image: url("assets/stars4.gif");
|
||||
background-repeat: repeat;
|
||||
}
|
||||
|
||||
/* Smooth scrolling IF user doesn't have a preference due to motion sensitivities */
|
||||
@media screen and (prefers-reduced-motion: no-preference) {
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
@media only screen and (min-width: 600px) {
|
||||
.center {
|
||||
background-color: $background-color;
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
border: 5px solid #96CDFB;
|
||||
}
|
||||
}
|
||||
|
||||
.section {
|
||||
border-radius: 35px;
|
||||
background: $background-color;
|
||||
box-shadow: 5px 5px 17px scale-color($background-color, $lightness: -35%),
|
||||
-5px -5px 17px scale-color($background-color, $lightness: +5%);
|
||||
max-width: 20cm;
|
||||
margin: 0 auto;
|
||||
@media only screen and (max-width: 600px) {
|
||||
.center {
|
||||
background-color: $background-color;
|
||||
text-align: center;
|
||||
margin: 10px;
|
||||
border: 5px solid #96CDFB;
|
||||
}
|
||||
}
|
||||
|
||||
.inner-section {
|
||||
border-radius: 35px;
|
||||
background: $background-color;
|
||||
max-width: 18cm;
|
||||
margin: 0 auto;
|
||||
margin-top: 5mm;
|
||||
padding: 2mm 3mm;
|
||||
.content {
|
||||
margin: 5%;
|
||||
padding: 10px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,17 +1,46 @@
|
|||
@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: 5px;
|
||||
padding: 10px;
|
||||
display: grid;
|
||||
|
||||
li {
|
||||
|
||||
h3 {
|
||||
margin-top: auto;
|
||||
}
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 600px) {
|
||||
footer {
|
||||
margin: 10px;
|
||||
margin-top: 5%;
|
||||
margin-bottom: 5%;
|
||||
border: 5px solid #ABE9B3;
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
margin: auto;
|
||||
padding: 10px;
|
||||
display: grid;
|
||||
|
||||
li {
|
||||
h3 {
|
||||
margin-top: auto;
|
||||
}
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,105 +1,51 @@
|
|||
// Buttons
|
||||
.button {
|
||||
margin-right: 10px;
|
||||
margin-bottom: 25px;
|
||||
@media only screen and (max-width: 600px) {
|
||||
margin: auto;
|
||||
}
|
||||
padding: 10px;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
border-radius: 32px;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
transition: all 0.1s ease-in-out;
|
||||
border-radius: 10px;
|
||||
background: $background-color;
|
||||
box-shadow: 5px 5px 10px scale-color($background-color, $lightness: -35%),
|
||||
-5px -5px 10px scale-color($background-color, $lightness: +5%);
|
||||
h1 {
|
||||
border-bottom: 5px solid #F28FAD;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: linear-gradient(145deg,
|
||||
scale-color($background-color, $lightness: -35%),
|
||||
scale-color($background-color, $lightness: +5%));
|
||||
h2 {
|
||||
margin-top: 1cm;
|
||||
margin-bottom: 0;
|
||||
border-bottom: 3px solid #F8BD96;
|
||||
}
|
||||
|
||||
box-shadow: 5px 5px 10px scale-color($background-color, $lightness: -35%),
|
||||
-5px -5px 10px scale-color($background-color, $lightness: +5%);
|
||||
}
|
||||
&:active {
|
||||
background: linear-gradient(145deg,
|
||||
scale-color($background-color, $lightness: -35%),
|
||||
scale-color($background-color, $lightness: +5%));
|
||||
|
||||
box-shadow: 5px 5px 10px scale-color($background-color, $lightness: -35%),
|
||||
-5px -5px 10px scale-color($background-color, $lightness: +5%);
|
||||
}
|
||||
h3 {
|
||||
margin-top: 1cm;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $accent-color;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: $light-color;
|
||||
}
|
||||
|
||||
ul, ol {
|
||||
color: #C3BAC6;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
margin-left: 5mm;
|
||||
padding-left: 2mm;
|
||||
color: scale-color($foreground-color, $lightness: -10%);
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 4px solid #F28FAD;
|
||||
}
|
||||
|
||||
blockquote blockquote {
|
||||
border-left: 4px solid #F8BD96;
|
||||
}
|
||||
|
||||
blockquote blockquote blockquote {
|
||||
border-left: 4px solid #FAE3B0;
|
||||
}
|
||||
|
||||
blockquote blockquote blockquote blockquote {
|
||||
border-left: 4px solid #ABE9B3;
|
||||
}
|
||||
|
||||
blockquote blockquote blockquote blockquote blockquote {
|
||||
border-left: 4px solid #B5E8E0;
|
||||
}
|
||||
|
||||
blockquote blockquote blockquote blockquote blockquote blockquote {
|
||||
border-left: 4px solid #96CDFB;
|
||||
}
|
||||
|
||||
blockquote blockquote blockquote blockquote blockquote blockquote blockquote {
|
||||
border-left: 4px solid #DDB6F2;
|
||||
}
|
||||
|
||||
code, pre {
|
||||
font-family: "Fira Code", monospace;
|
||||
overflow: auto;
|
||||
border-radius: 10px;
|
||||
padding: 10px;
|
||||
|
||||
background: $background-color !important;
|
||||
box-shadow: inset 5px 5px 10px scale-color($background-color, $lightness: -35%),
|
||||
inset -5px -5px 10px scale-color($background-color, $lightness: +5%);
|
||||
@media only screen and (min-width: 600px) {
|
||||
display: inline-block;
|
||||
max-width: 18cm;
|
||||
}
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
border-bottom: 2px solid #FAE3B0;
|
||||
}
|
||||
|
||||
code {
|
||||
display: inline;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.date {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 600px) {
|
||||
code, pre {
|
||||
display: inline;
|
||||
max-width: 18cm;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 600px) {
|
||||
code, pre {
|
||||
display: inline-block;
|
||||
max-width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
||||
p code {
|
||||
|
|
@ -107,40 +53,37 @@ p code {
|
|||
padding: 5px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 600px) {
|
||||
code {
|
||||
display: inline-block;
|
||||
max-width: 95%;
|
||||
}
|
||||
}
|
||||
blockquote {
|
||||
margin-left: 5mm;
|
||||
padding-left: 2mm;
|
||||
color: #bac6e0; }
|
||||
|
||||
blockquote {
|
||||
border-left: 4px solid #F28FAD; }
|
||||
|
||||
h1 {
|
||||
font-size: 30px;
|
||||
font-weight: normal;
|
||||
border-bottom: 4px solid #F28FAD;
|
||||
}
|
||||
blockquote blockquote {
|
||||
border-left: 4px solid #F8BD96; }
|
||||
|
||||
h2 {
|
||||
font-size: 25px;
|
||||
font-weight: normal;
|
||||
margin-top: 1cm;
|
||||
margin-bottom: 0;
|
||||
border-bottom: 2px solid #F8BD96;
|
||||
}
|
||||
blockquote blockquote blockquote {
|
||||
border-left: 4px solid #FAE3B0; }
|
||||
|
||||
h3 {
|
||||
font-size: 22px;
|
||||
font-weight: normal;
|
||||
margin-top: 1cm;
|
||||
margin-bottom: 0;
|
||||
blockquote blockquote blockquote blockquote {
|
||||
border-left: 4px solid #ABE9B3; }
|
||||
|
||||
blockquote blockquote blockquote blockquote blockquote {
|
||||
border-left: 4px solid #B5E8E0; }
|
||||
|
||||
blockquote blockquote blockquote blockquote blockquote blockquote {
|
||||
border-left: 4px solid #96CDFB; }
|
||||
|
||||
blockquote blockquote blockquote blockquote blockquote blockquote blockquote {
|
||||
border-left: 4px solid #DDB6F2; }
|
||||
|
||||
ul, ol {
|
||||
color: #C3BAC6;
|
||||
}
|
||||
|
||||
::selection {
|
||||
color: $background-color;
|
||||
background: $foreground-color;
|
||||
}
|
||||
|
||||
.tags {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +0,0 @@
|
|||
img {
|
||||
border-radius: 10px;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
box-shadow: 8px 8px 23px #060606,
|
||||
-8px -8px 23px #16161a;
|
||||
}
|
||||
|
|
@ -1,20 +1,26 @@
|
|||
@media only screen and (min-width: 600px) {
|
||||
nav {
|
||||
max-width: 20cm;
|
||||
max-width: 50%;
|
||||
margin: auto;
|
||||
padding-top: 10px;
|
||||
font-size: 20px;
|
||||
margin-top: 25px;
|
||||
margin-bottom: 5%;
|
||||
font-size: 1.3em;
|
||||
border: 5px solid #DDB6F2;
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
margin: auto;
|
||||
padding: 0;
|
||||
padding: 5px;
|
||||
display: grid;
|
||||
grid-auto-flow: column;
|
||||
|
||||
li {
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -22,8 +28,10 @@ nav {
|
|||
|
||||
@media only screen and (max-width: 600px) {
|
||||
nav {
|
||||
font-size: 20px;
|
||||
margin: 10px;
|
||||
list-style: none;
|
||||
font-size: 1.3em;
|
||||
border: 5px solid #DDB6F2;
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
|
|
@ -32,15 +40,22 @@ nav {
|
|||
margin: auto;
|
||||
display: grid;
|
||||
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 10px;
|
||||
grid-auto-rows: minmax(50px, auto);
|
||||
align-content: center;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 10px;
|
||||
grid-auto-rows: minmax(50px, auto);
|
||||
align-content: center;
|
||||
|
||||
li {
|
||||
padding: 0px;
|
||||
margin: auto;
|
||||
li {
|
||||
padding: 0px;
|
||||
margin: auto;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
|
|
@ -1,6 +1,5 @@
|
|||
$background-color: #161320;
|
||||
$foreground-color: #D9E0EE;
|
||||
$light-color: #F5C2E7;
|
||||
$accent-color: #F2CDCD;
|
||||
|
||||
@import '_scss/base', '_scss/formatting', '_scss/navigation', '_scss/footer', '_scss/image';
|
||||
@import '_scss/base', '_scss/formatting', '_scss/footer', '_scss/navigation';
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
#!/bin/zsh
|
||||
rsync -rauz --del --groupmap=erin:www-data --progress _site/ erin@is-cute.ml:~/website
|
||||
rsync -rauz --del --groupmap=erin:www-editors --progress _site/ meow-onion:/mnt/www/website
|
||||
rsync -rauz --del --groupmap=erin:www-editors --progress _site/ meow:/mnt/www/website
|
||||
|
|
|
|||
Loading…
Reference in New Issue