Switch to Catppuccin theme

This commit is contained in:
~erin 2022-04-19 18:37:14 -04:00
parent 54f054fb45
commit 0190c1de90
No known key found for this signature in database
GPG Key ID: DA70E064A8C70F44
3 changed files with 25 additions and 20 deletions

View File

@ -17,8 +17,8 @@ html {
.section {
border-radius: 35px;
background: $background-color;
box-shadow: 5px 5px 17px #060606,
-5px -5px 17px #16161a;
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;
}

View File

@ -15,31 +15,37 @@
transition: all 0.1s ease-in-out;
border-radius: 10px;
background: $background-color;
box-shadow: 5px 5px 10px #060606,
-5px -5px 10px #16161a;
box-shadow: 5px 5px 10px scale-color($background-color, $lightness: -35%),
-5px -5px 10px scale-color($background-color, $lightness: +5%);
&:hover {
background: linear-gradient(145deg, #0f0f11, #0d0d0e);
box-shadow: 5px 5px 10px #060606,
-5px -5px 10px #16161a;
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%);
}
&:active {
background: linear-gradient(145deg, #0d0d0e, #0f0f11);
box-shadow: 5px 5px 10px #060606,
-5px -5px 10px #16161a;
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%);
}
}
a {
color: $light-color;
color: $accent-color;
}
a:visited {
color: scale-color($light-color, $lightness: -15%);
color: $light-color;
}
ul, ol {
color: scale-color($foreground-color, $lightness: -20%);
color: #C3BAC6;
}
blockquote {
@ -83,8 +89,8 @@ code, pre {
padding: 10px;
background: $background-color !important;
box-shadow: inset 5px 5px 10px #070708,
inset -5px -5px 10px #151518;
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;

View File

@ -1,7 +1,6 @@
$background-color: #0E0E10;
$foreground-color: #F9F8F8;
$light-color: #E2ADF2;
$dark-color: #2A1E5C;
$accent-color: #EE4266;
$background-color: #161320;
$foreground-color: #D9E0EE;
$light-color: #F5C2E7;
$accent-color: #F2CDCD;
@import '_scss/base', '_scss/formatting', '_scss/navigation', '_scss/footer', '_scss/image';