next/previous article/project section rewritten

This commit is contained in:
Vrifox 2020-09-22 14:10:53 +02:00
parent 8f44f2d329
commit fb24b7e480
7 changed files with 46 additions and 97 deletions

View file

@ -7,15 +7,16 @@
html {
scrollbar-width: thin;
scrollbar-color: #ff8282 #3c3c5a; }
scrollbar-color: #ff8282 #3c3c5a;
overflow-x: hidden;
overflow-y: scroll; }
body {
background: #28283c;
color: #f0f0ff;
margin: 0;
font-family: PoppinsLatin, Monaco, Lucida Console, monospace;
display: grid;
overflow-x: hidden; }
display: grid; }
a {
color: #ff8282;
@ -104,48 +105,34 @@ nav {
background: #464669; }
.section-articles {
margin: 20px auto;
margin: 20px auto -50px auto;
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 1rem;
max-width: 720px; }
.section-articles a {
color: white;
text-decoration: none; }
.section-articles article {
background: #3c3c5a;
color: white;
padding: 20px;
margin: 20px 0;
border-radius: 5px;
display: flex;
flex-flow: column;
height: max-content;
transition: background .2s; }
.section-articles article img {
order: -1;
max-width: calc(100% + 40px);
border-radius: 5px;
margin: -20px -20px 20px -20px;
background: #505078;
object-fit: cover;
max-height: 170px; }
.section-articles article h1 {
margin-top: 0px; }
.section-articles article a {
color: white; }
margin: 10px 0; }
.section-articles article a:hover {
text-decoration: underline; }
.section-articles article .meta {
margin: 0; }
.section-articles article .author {
font-style: italic;
color: #c8c8e6; }
.section-articles article:hover {
background: #464669; }
.section-articles .previous-article {
text-align: right; }
@media (max-width: 600px) {
.section-articles {
grid-template-columns: repeat(1, 1fr); } }
.section-articles::after {
content: '';
position: absolute;
width: 100vw;
background: #32324b;
height: 230px;
left: 0;
z-index: -10; }
footer {
background: #1e1e2d;

View file

@ -7,15 +7,16 @@
html {
scrollbar-width: thin;
scrollbar-color: #ff8282 #3c3c5a; }
scrollbar-color: #ff8282 #3c3c5a;
overflow-x: hidden;
overflow-y: scroll; }
body {
background: #28283c;
color: #f0f0ff;
margin: 0;
font-family: PoppinsLatin, Monaco, Lucida Console, monospace;
display: grid;
overflow-x: hidden; }
display: grid; }
a {
color: #ff8282;