Initial website finished-ish
This commit is contained in:
parent
e16c0f9d1a
commit
35f9f59b33
7 changed files with 111 additions and 13 deletions
|
@ -5,19 +5,20 @@
|
||||||
<title>{{ title }}</title>
|
<title>{{ title }}</title>
|
||||||
<link rel="icon" type="image/png" href="/assets/Favicon.png" />
|
<link rel="icon" type="image/png" href="/assets/Favicon.png" />
|
||||||
<link rel="stylesheet" href="/style.css" />
|
<link rel="stylesheet" href="/style.css" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<main>
|
<main>
|
||||||
<div id="menu" class="block">
|
<div id="menu" class="block">
|
||||||
<nav>
|
<nav>
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="/about">Home</a></li>
|
<li><a href="/">Home</a></li>
|
||||||
<li><a href="/about">About</a></li>
|
<li><a href="/about">About</a></li>
|
||||||
<li><a href="/contact">Contact</a></li>
|
<li><a href="/contact">Contact</a></li>
|
||||||
<li><a href="/donate">Donate</a></li>
|
<li><a href="/donate">Donate</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
<div id="pageContent">
|
<div id="pageContent">
|
||||||
<div id="content" class="block pane">
|
<div id="content" class="block pane">
|
||||||
{{ content }}
|
{{ content }}
|
||||||
|
@ -26,6 +27,13 @@
|
||||||
<img src="/assets/{{image}}" alt="Image" />
|
<img src="/assets/{{image}}" alt="Image" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="footer" class="block">
|
||||||
|
<div id="buttonsContainer">
|
||||||
|
<a href="https://ari.express"><img id="buttonMe" src="/assets/Button.png" alt="Button Me" /></a>
|
||||||
|
<a href="https://witchcraft.systems"><img id="buttonWS" src="/assets/PWsbutton.png" alt="Button WS" /></a>
|
||||||
|
</div>
|
||||||
|
<p>© 2025 Ari</p>
|
||||||
|
</div>
|
||||||
</main>
|
</main>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
1
about.md
1
about.md
|
@ -14,4 +14,5 @@ image: Home.png
|
||||||
## What am I doing:
|
## What am I doing:
|
||||||
- Part of a thing, check it out: [The Digital Coven](https://witchcraft.systems)
|
- Part of a thing, check it out: [The Digital Coven](https://witchcraft.systems)
|
||||||
- Do art here: [Bluesky link](https://bsky.app/profile/ari.mom)
|
- Do art here: [Bluesky link](https://bsky.app/profile/ari.mom)
|
||||||
|
- Stream very occasionally on [Twitch](https://www.twitch.tv/ari_express)
|
||||||
- Know a bit about a lot of webdev technologies, but Deno/TS/Svelte is my one true love \<3
|
- Know a bit about a lot of webdev technologies, but Deno/TS/Svelte is my one true love \<3
|
||||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 27 KiB |
BIN
assets/PWsbutton.png
Normal file
BIN
assets/PWsbutton.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 3.3 KiB |
BIN
assets/ShureTechMonoNerdFont-Regular.ttf
Normal file
BIN
assets/ShureTechMonoNerdFont-Regular.ttf
Normal file
Binary file not shown.
10
index.md
Normal file
10
index.md
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
---
|
||||||
|
layout: mainLayout.vto
|
||||||
|
title: Home of Ari
|
||||||
|
image: Home.png
|
||||||
|
---
|
||||||
|
# Heyo, my name is Ariadna
|
||||||
|
|
||||||
|
Two things:
|
||||||
|
- I don't know what to put on the home page, so go click the links
|
||||||
|
- This website is really made for desktops, the mobile is an afterthought really
|
85
style.css
85
style.css
|
@ -1,18 +1,36 @@
|
||||||
:root {
|
:root {
|
||||||
--background-color: #922950;
|
--background-color: #922950;
|
||||||
--text-color: #922950;
|
--text-color: #922950;
|
||||||
|
--link-text-color: #ff005d;
|
||||||
|
--link-hover-color: #ce3e6b;
|
||||||
--border-color: #ce3e6b;
|
--border-color: #ce3e6b;
|
||||||
--content-background-color: #fe76b0;
|
--content-background-color: #fe76b0;
|
||||||
background-color: var(--background-color);
|
background-color: var(--background-color);
|
||||||
|
color: var(--text-color);
|
||||||
image-rendering: pixelated;
|
image-rendering: pixelated;
|
||||||
image-rendering: crisp-edges;
|
image-rendering: crisp-edges;
|
||||||
image-rendering: -moz-crisp-edges;
|
image-rendering: -moz-crisp-edges;
|
||||||
image-rendering: -o-crisp-edges;
|
image-rendering: -o-crisp-edges;
|
||||||
|
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'ShureTechMono Nerd Font';
|
||||||
|
src: url(/assets/ShureTechMonoNerdFont-Regular.ttf);
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
font-family: 'ShureTechMono Nerd Font', monospace;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: var(--link-text-color);
|
||||||
|
}
|
||||||
|
a:hover {
|
||||||
|
color: var(--link-hover-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.block {
|
.block {
|
||||||
background-color: var(--content-background-color);
|
background-color: var(--content-background-color);
|
||||||
color: var(--text-color);
|
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
width: 75%;
|
width: 75%;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
@ -25,7 +43,6 @@ main {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
|
||||||
}
|
}
|
||||||
#menu {
|
#menu {
|
||||||
width: 80%;
|
width: 80%;
|
||||||
|
@ -34,6 +51,8 @@ main {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
margin: 10vh 0;
|
||||||
|
margin-top: 0;
|
||||||
}
|
}
|
||||||
nav {
|
nav {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -83,4 +102,64 @@ nav ul li a:hover {
|
||||||
}
|
}
|
||||||
#image img {
|
#image img {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
#footer {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin: 0;
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
#buttonContainer {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
#buttonContainer img {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
#footer p {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-size: 24px;
|
||||||
|
color: var(--text-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 900px) {
|
||||||
|
body {
|
||||||
|
|
||||||
|
}
|
||||||
|
#content, #image {
|
||||||
|
height: auto;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
#image {
|
||||||
|
position: fixed;
|
||||||
|
top: 20vh;
|
||||||
|
left: 10vw;
|
||||||
|
width: 90vw;
|
||||||
|
height: 90vh;
|
||||||
|
z-index: -1;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
#image img {
|
||||||
|
object-fit: cover;
|
||||||
|
object-position: center;
|
||||||
|
}
|
||||||
|
#menu {
|
||||||
|
flex-direction: column;
|
||||||
|
margin: 5vh 0;
|
||||||
|
|
||||||
|
}
|
||||||
|
nav ul {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
nav ul li {
|
||||||
|
margin: 10px 0;
|
||||||
|
}
|
||||||
|
nav ul li a {
|
||||||
|
font-size: 48px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue