Page MenuHomePhorge

main.css
No OneTemporary

Authored By
Unknown
Size
3 KB
Referenced Files
None
Subscribers
None

main.css

@import "gruvbox.css";
@import "prism.css";
@import "iosevka.css";
html, body {
margin: 0;
padding: 0;
}
body {
font-family: iosevka-adaedra-text, ui-sans-serif, sans-serif;
font-size: 16px;
background-color: var(--gb-bg0-hard);
color: var(--gb-fg0);
--reindeer: #DDCBA4;
}
::selection {
color: var(--gb-fg0);
background-color: var(--gb-light-gray);
}
a {
color: var(--gb-light-blue);
&:visited {
color: var(--gb-light-purple);
}
}
h1 {
font-size: 3rem;
line-height: 1.5em;
font-weight: normal;
padding: 0;
margin: 0;
}
code {
font-family: iosevka-adaedra-fixed, ui-monospace, monospace;
font-weight: normal;
white-space: nowrap;
hyphens: none;
&::before {
content: "\2E22";
}
&::after {
content: "\2E25";
}
&::before, &::after {
margin-inline: 0.15em;
color: var(--gb-fg4);
}
pre &::before, pre &::after {
display: none;
}
}
pre {
border: 1px solid var(--gb-fg2);
background-color: var(--gb-bg0);
padding: 0.5em;
line-height: 1.25em;
overflow-y: auto;
scrollbar-width: thin;
code {
white-space: pre;
}
}
.wrapper {
margin: 0 auto;
padding: 1em;
max-width: 100ex;
}
p {
text-align: justify;
hyphens: auto;
}
ul {
margin: 0;
padding-block: 0;
padding-inline: 2em 0;
}
li {
list-style-type: none;
text-align: justify;
hyphens: auto;
&::before {
display: inline-block;
content: "\2043";
width: 1em;
margin-inline-start: -1em;
color: var(--gb-fg2);
}
}
article img {
max-width: 100%;
}
.articleList {
display: grid;
grid-template-columns: auto 1fr;
gap: 0.5em 0;
& > div {
display: grid;
grid-column: 1 / span 2;
grid-template-columns: subgrid;
}
span {
text-align: right;
color: var(--gb-fg2);
}
a {
text-decoration: none;
}
}
.socials {
line-height: 1.5rem;
a {
text-decoration: none;
}
svg {
vertical-align: text-bottom;
margin-inline-end: 0.5em;
font-size: 1.25rem;
}
}
.note {
--note-color: var(--gb-light-aqua);
background-color: color-mix(in srgb, var(--note-color) 10%, var(--gb-bg0-hard));
margin-inline: -1em;
padding-inline: 1em;
padding-block: 1em;
min-height: 2em;
p {
margin-block: 0;
margin-inline: 3em 0;
}
& > svg {
color: var(--note-color);
font-size: 2rem;
float: left;
}
&.warning {
--note-color: var(--gb-light-orange);
}
&.update {
--note-color: var(--gb-light-purple);
}
}
.home {
line-height: 1.1em;
header {
display: grid;
grid-template-columns: 1fr 10em;
div {
align-self: center;
}
img {
width: 100%;
}
}
h1 {
font-size: 3rem;
line-height: 1.1em;
color: var(--reindeer);
}
h2 {
font-weight: normal;
margin-block: 2em 0.5em;
}
footer {
margin-block-start: 5em;
color: var(--gb-fg2);
hr {
display: none;
}
}
}
nav {
font-size: 1.25em;
margin-block-end: 2em;
line-height: 2em;
a, a:visited {
color: var(--reindeer);
text-decoration: none;
}
img {
height: 2em;
display: inline-block;
vertical-align: bottom;
border-radius: 10%;
}
}
article {
line-height: 2em;
header {
color: var(--gb-fg2);
margin-block-end: 3em;
}
h1 {
color: var(--gb-fg0);
}
}

File Metadata

Mime Type
text/plain
Expires
Sun, Oct 25, 16:41 (1 d, 15 h)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
106
Default Alt Text
main.css (3 KB)

Event Timeline