fix missing scss inclues

This commit is contained in:
yuki 2025-12-08 03:05:31 -03:00
parent 1233e87de6
commit 81412117d8
Signed by: yuki
GPG key ID: 0C98E6FF04EC3915
4 changed files with 274 additions and 0 deletions

39
_includes/scss/404.scss Normal file
View file

@ -0,0 +1,39 @@
@use "sass:color" as c;
@use "general" as *;
@use "fonts" as *;
@use "main-palette" as mp;
#fof {
border: none;
.fof {
display: flex;
justify-content: flex-start;
flex-direction: column;
width: 100%;
h1 {
margin: 10px 10px 0px 10px;
font-family: $ll;
text-align: center;
text-decoration: none;
}
img {
max-width: fit-content;
display: block;
margin: auto;
}
.fof-foot {
display: flex;
justify-content: flex-start;
flex-direction: row;
justify-content: space-between;
width: 780px;
margin: 0px auto;
p {
font-family:
$ll, "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
font-size: 1.2em;
}
}
}
}

79
_includes/scss/body.scss Normal file
View file

@ -0,0 +1,79 @@
@use "sass:color" as c;
@use "general" as *;
@use "fonts" as *;
@use "main-palette" as mp;
body {
color: mp.$text;
background-color: mp.$bg;
/*background-image: url("/img/bgpat.png");
background-repeat: repeat;*/
a {
color: mp.$link;
}
a:hover {
color: c.adjust($color: mp.$link, $saturation: 4%, $lightness: 10%);
}
p {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
font-size: $psize;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: $ll, "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
font-weight: bold;
text-decoration: underline;
text-decoration-color: mp.$border;
font-smooth: never;
-webkit-font-smoothing: none;
-moz-osx-font-smoothing: none;
}
h1 {
font-size: $h1size;
}
h2 {
font-size: $h2size;
}
h3 {
font-size: $h3size;
}
h4 {
font-size: $h4size;
}
h5 {
font-size: $h5size;
}
h6 {
font-size: $h6size;
}
.warning {
padding: 2px;
margin: 2px auto;
text-align: center;
border-top: 1px solid
c.adjust($color: mp.$border, $saturation: 15%, $lightness: 10%);
border-bottom: 1px solid
c.adjust($color: mp.$border, $saturation: 15%, $lightness: 10%);
background: c.adjust(
$color: mp.$border,
$saturation: 15%,
$lightness: -20%
);
}
@media (min-width: $breakpoint) {
#mobile-warning {
display: none;
}
}
}

View file

@ -0,0 +1,40 @@
@use "sass:color" as c;
@use "general" as *;
@use "fonts" as *;
@use "main-palette" as mp;
footer {
marquee {
margin: 8px 0px;
}
p {
margin: 2px;
font-size: 0.7em;
text-align: right;
}
.footer-flex {
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: space-between;
width: 100%;
.footer-left {
margin: auto 0px 0px 0px;
}
.footer-middle .nekojiru-angel {
background-image: url("/img/nekojiru.png");
width: 64px;
height: 64px;
margin: auto 0px 0px 0px;
vertical-align: bottom;
&:hover {
background-image: url("/img/nekojiruhalo.png");
}
}
.footer-right {
margin: auto 0px 0px 0px;
}
}
}

116
_includes/scss/header.scss Normal file
View file

@ -0,0 +1,116 @@
@use "sass:color" as c;
@use "general" as *;
@use "fonts" as *;
@use "main-palette" as mp;
.header-wrapper {
display: flex;
align-items: flex-start;
gap: 0px;
height: fit-content;
flex-direction: row;
.header {
display: flex;
flex-direction: column;
h1 {
display: none;
height: 0;
}
.header-banner {
background-image: url("/img/home_banner.jpg");
width: 298px;
height: 140px;
border-right: 1px solid mp.$border;
border-bottom: 1px solid mp.$border;
border-radius: 0% 0% 20px 0%;
}
.header-banner:hover {
background-image: url("/img/home_banner_hover.jpg");
}
}
.navbar-wrapper {
display: flex;
align-items: flex-start;
margin: 8px 0px 2px 0px;
width: 100%;
.navbar-content {
display: flex;
flex-direction: column;
width: 100%;
ul {
display: flex;
flex-direction: row;
flex-wrap: wrap;
list-style: none;
padding: 0 4px;
li {
display: flex;
margin: 2px;
a,
p {
padding: 0.2em 0.5em;
border: 1px solid mp.$border;
background: mp.$bg;
background: linear-gradient(
0deg,
rgba(0, 0, 0, 1) 10%,
c.adjust(
$color: mp.$link,
$saturation: 4%,
$lightness: -20%
)
100%
);
color: mp.$text;
font-family: $ll;
font-weight: normal;
font-size: 1em;
text-decoration: none;
/*text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;*/
&:hover {
background: linear-gradient(
0deg,
rgba(0, 0, 0, 1) 0%,
c.adjust(
$color: mp.$link,
$saturation: 4%,
$lightness: -10%
)
100%
);
}
}
p {
cursor: default;
}
--hover-image: url("/img/nav/default_hover.jpg");
/* TODO: finish each navbar image
&#home:hover ~ #nav-hover { --hover-image: url('/img/nav/home_hover.jpg'); }
&#about:hover ~ #nav-hover { --hover-image: url('/img/nav/about_hover.jpg'); }
&#blog:hover ~ #nav-hover { --hover-image: url('/img/nav/blog_hover.jpg'); }
&#reviews:hover ~ #nav-hover { --hover-image: url('/img/nav/reviews_hover.jpg'); }
&#links:hover ~ #nav-hover { --hover-image: url('/img/nav/links_hover.jpg'); }
&#contact:hover ~ #nav-hover { --hover-image: url('/img/nav/contact_hover.jpg'); }
*/
}
#nav-hover {
width: 100%;
height: 104px;
max-height: 103px;
background: mp.$bg;
background-image: var(--hover-image, none);
/* temporary until i finish navbar images */
&:hover {
--hover-image: url("/img/nav/temp_hover.jpg");
}
}
}
}
}
}