add assets and update css
This commit is contained in:
parent
f710e6b918
commit
69ff52fb7a
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
After Width: | Height: | Size: 3.1 KiB |
Binary file not shown.
After Width: | Height: | Size: 22 KiB |
52
style.css
52
style.css
|
@ -1,30 +1,66 @@
|
||||||
|
/*import fonts that will be used on the site*/
|
||||||
@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
|
@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
|
||||||
|
/* converted fonts to WOFF using convertio. https://convertio.co/ */
|
||||||
|
@font-face {
|
||||||
|
font-family: GoodOldDOS;
|
||||||
|
/* save some precious precious bandwidth on the rare occasion someone already has goodolddos installed on their system. */
|
||||||
|
local("GoodOldDOS");
|
||||||
|
local("Good Old DOS");
|
||||||
|
src: url("./assets/GoD.ttf");
|
||||||
|
src: url("./assets/GoD.woff");
|
||||||
|
}
|
||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: GoD;
|
font-family: GoodOldDOS-D;
|
||||||
src: url(https://git.lainiwakura.xyz/uncreativecultist/PersonalStorage/raw/branch/main/GoodOldDos/Good%20Old%20DOS.ttf);
|
src: url("./assets/GoD-D.tff");
|
||||||
|
src: url("./assets/GoD-D.woff");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*alright, now onto the text formatting junk!*/
|
||||||
|
|
||||||
.iacs {
|
.iacs {
|
||||||
color: #0033a0;
|
color: #0033a0;
|
||||||
text-shadow: 3px 3px 3px #c6093b;
|
text-shadow: 3px 3px 3px #c6093b;
|
||||||
}
|
}
|
||||||
h1 {
|
h1 {
|
||||||
font-family: "Oswald", sans-serif;
|
font-family: "GoodOldDOS", sans-serif;
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
text-decoration-color: #0033a0;
|
text-decoration-color: #0033a0;
|
||||||
color: #c6093b;
|
color: #c6093b;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* pick the right fonts*/
|
||||||
|
|
||||||
|
|
||||||
|
a {
|
||||||
|
font-family: "GoodOldDOS-D", sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
|
font-family: "GoodOldDOS", sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-family: "GoodOldDOS", sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
font-family: "Oswald", sans-serif;
|
font-family: "Oswald", sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
font-family: "GoodOldDOS", sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* add background image*/
|
||||||
body {
|
body {
|
||||||
/* no idea where this image originally came from, but as far as i can tell, the oldest instance of it is from angelfire back in 2008.*/
|
/* no idea where this image originally came from, but as far as i can tell, the oldest instance of it is from angelfire back in 2008.*/
|
||||||
background-image: url("https://rivendell.neocities.org/backgrounds/abstract1.jpg");
|
background-image: url("./assets/abstract1.jpg");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*specify max width and other stuff about the page*/
|
||||||
|
/*thank god im not in honors, doing reactive design with this theme woukld be hell.*/
|
||||||
|
|
||||||
.page-wrapper {
|
.page-wrapper {
|
||||||
max-width: 950px;
|
max-width: 950px;
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
|
@ -42,6 +78,9 @@ body {
|
||||||
padding: 25px 25px 25px 25px;
|
padding: 25px 25px 25px 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*specify the grid for the site, easiest way of saying where goes what*/
|
||||||
|
/*tbh i didnt know this existed until mr hinkle pointed it out (ty btw)*/
|
||||||
|
|
||||||
.page-wrapper {
|
.page-wrapper {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-areas:
|
grid-template-areas:
|
||||||
|
@ -64,6 +103,7 @@ aside {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* The following is the CSS for buttons at the bottom of the site. Made with assistance from GPT-4o by OpenAI. https://chatgpt.com/share/67532b75-75f0-8009-951a-798c927c13e4 */
|
/* The following is the CSS for buttons at the bottom of the site. Made with assistance from GPT-4o by OpenAI. https://chatgpt.com/share/67532b75-75f0-8009-951a-798c927c13e4 */
|
||||||
|
/*i didn't really end up using most of the code that was given by ChatGPT, but I'll keep the attribution here because it did help me lean a lil*/
|
||||||
|
|
||||||
#zen-requirements::after {
|
#zen-requirements::after {
|
||||||
content: "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa";
|
content: "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa";
|
||||||
|
@ -76,7 +116,7 @@ aside {
|
||||||
right: 0;
|
right: 0;
|
||||||
width: 900px;
|
width: 900px;
|
||||||
height: 31px;
|
height: 31px;
|
||||||
background-image: url("https://git.lainiwakura.xyz/uncreativecultist/PersonalStorage/raw/branch/main/Gifs/gif.gif"); /* Set your image URL */
|
background-image: url("./assets/gif.gif"); /* Set your image URL */
|
||||||
background-size: contain; /* Ensures the image retains its original size */
|
background-size: contain; /* Ensures the image retains its original size */
|
||||||
background-repeat: no-repeat; /* Prevents the image from repeating */
|
background-repeat: no-repeat; /* Prevents the image from repeating */
|
||||||
image-rendering: pixelated; /* Preserves pixel art sharpness */
|
image-rendering: pixelated; /* Preserves pixel art sharpness */
|
||||||
|
@ -87,4 +127,4 @@ aside {
|
||||||
|
|
||||||
"Good Old DOS" typeface is created by morderdrakonovich and was labeled as Public Domain, however, It's a good font and he deserves credit.
|
"Good Old DOS" typeface is created by morderdrakonovich and was labeled as Public Domain, however, It's a good font and he deserves credit.
|
||||||
|
|
||||||
*/
|
*/
|
||||||
|
|
Loading…
Reference in New Issue