Add files via upload
This commit is contained in:
parent
414aba044d
commit
a880bbd62e
8 changed files with 205 additions and 0 deletions
129
style.css
Normal file
129
style.css
Normal file
|
@ -0,0 +1,129 @@
|
|||
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');
|
||||
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
|
||||
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300&display=swap');
|
||||
:root {
|
||||
--color-bg: #1E1E2E;
|
||||
--color-fg: #D9E0EE;
|
||||
--color-link: #8F9191;
|
||||
--color-link-visited: #F5C2E7;
|
||||
--color-link-hover: #FF79C6 ;
|
||||
}
|
||||
|
||||
html, body {
|
||||
background: var(--color-bg);
|
||||
color: var(--color-fg);
|
||||
font-family: "Ubuntu";
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.vapor {
|
||||
border-radius: 12px;
|
||||
border-style: solid;
|
||||
border-color: #FF79C6;
|
||||
|
||||
}
|
||||
|
||||
.container {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 460px 600px 1fr;
|
||||
grid-template-areas:
|
||||
". left right .";
|
||||
column-gap: 80px;
|
||||
justify-items: center;
|
||||
align-items: center;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
.left-container {
|
||||
grid-area: left;
|
||||
aspect-ratio: 1/1;
|
||||
}
|
||||
|
||||
.right-container {
|
||||
grid-area: right;
|
||||
height: 50%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.gif img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.head {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
font-size: 40px;
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.category {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
.bookmarks {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.links {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
li {
|
||||
font-size: 16px;
|
||||
list-style-type: none;
|
||||
padding: 5px
|
||||
}
|
||||
|
||||
a:link {
|
||||
text-decoration: none;
|
||||
color: var(--color-link);
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: var(--color-link-visited);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--color-link-hover);
|
||||
}
|
||||
|
||||
.blinking {
|
||||
animation: opacity 1s ease-in-out infinite;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@keyframes opacity {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
#Date {
|
||||
|
||||
font-family: 'Bebas Neue';
|
||||
font-size: 40px;
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue