134 lines
2.2 KiB
SCSS
134 lines
2.2 KiB
SCSS
|
$text-color: black;
|
||
|
$background-color: white;
|
||
|
$link-color: black;
|
||
|
$base_url: "https://tilde.town/~ydreniv";
|
||
|
|
||
|
@font-face {
|
||
|
font-family: 'Old English';
|
||
|
src: url($base_url + "/fonts/OldLondon.ttf");
|
||
|
font-weight: normal;
|
||
|
font-style: normal;
|
||
|
}
|
||
|
|
||
|
body {
|
||
|
margin: 4em;
|
||
|
color: $text-color;
|
||
|
background-color: $background-color;
|
||
|
font-family: serif;
|
||
|
text-align: justify;
|
||
|
}
|
||
|
|
||
|
h1 {
|
||
|
margin: 0;
|
||
|
}
|
||
|
|
||
|
a {
|
||
|
color: $link-color;
|
||
|
font-weight: bold;
|
||
|
}
|
||
|
|
||
|
article {
|
||
|
padding: 1em;
|
||
|
border: 1px solid $text-color;
|
||
|
|
||
|
.last-updated {
|
||
|
margin-top: 0;
|
||
|
font-style: italic;
|
||
|
}
|
||
|
|
||
|
pre {
|
||
|
padding: 1rem;
|
||
|
overflow: auto;
|
||
|
}
|
||
|
// The line numbers already provide some kind of left/right padding
|
||
|
pre[data-linenos] {
|
||
|
padding: 1rem 0;
|
||
|
}
|
||
|
pre table td {
|
||
|
padding: 0;
|
||
|
}
|
||
|
// The line number cells
|
||
|
pre table td:nth-of-type(1) {
|
||
|
text-align: center;
|
||
|
user-select: none;
|
||
|
}
|
||
|
pre mark {
|
||
|
// If you want your highlights to take the full width.
|
||
|
display: block;
|
||
|
// The default background colour of a mark is bright yellow
|
||
|
background-color: rgba(254, 252, 232, 0.9);
|
||
|
}
|
||
|
pre table {
|
||
|
width: 100%;
|
||
|
border-collapse: collapse;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
header {
|
||
|
padding-bottom: 1em;
|
||
|
|
||
|
#title-date {
|
||
|
display: flex;
|
||
|
flex-flow: row nowrap;
|
||
|
gap: 2em;
|
||
|
justify-content: space-between;
|
||
|
align-items: flex-end;
|
||
|
margin-bottom: 1em;
|
||
|
border-bottom: 1px solid $text-color;
|
||
|
|
||
|
.newspaper-title {
|
||
|
margin: 0;
|
||
|
font-family: "Old English", serif;
|
||
|
font-size: 4em;
|
||
|
a {
|
||
|
text-decoration: none;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
nav {
|
||
|
width: 100%;
|
||
|
padding: .4em 0;
|
||
|
border-top: 3px double $text-color;
|
||
|
border-bottom: 1px solid $text-color;
|
||
|
|
||
|
ul {
|
||
|
display: flex;
|
||
|
flex-flow: row nowrap;
|
||
|
gap: 2em;
|
||
|
justify-content: space-between;
|
||
|
|
||
|
list-style-type: none;
|
||
|
margin: 0;
|
||
|
padding: 0;
|
||
|
|
||
|
li {
|
||
|
display: inline-block;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.pagination-navigation {
|
||
|
margin: auto;
|
||
|
|
||
|
ul {
|
||
|
list-style-type: none;
|
||
|
margin: 0 auto;
|
||
|
padding: 0;
|
||
|
width: fit-content;
|
||
|
}
|
||
|
|
||
|
li {
|
||
|
display: inline-block;
|
||
|
// border: 1px solid black;
|
||
|
margin: 0;
|
||
|
padding: .2em .5em;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
footer {
|
||
|
img {
|
||
|
filter: grayscale(100%);
|
||
|
}
|
||
|
}
|