quinten/website-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

sapari cat groove added, template and links updated, changed margins on directory box and fixed possible regression where the links and status thing had seperated from the title?

Browse Source
This commit is contained in:
Quinten0508 2024-07-07 02:42:07 +02:00
parent 9395626242
commit e99572e7f3
5 changed files with 65 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/dance_transparent.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.6 MiB

10
index.html
View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>Quintens Outpost</title>
<title>Home - Quintens Outpost</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
@ -18,7 +18,12 @@
<div class="container-main">
<div id="maintitlebox">
<h1 id="maintitle" class="box"><a style="text-decoration: none; color: #E9E9E9;" href="./">Quinten's Outpost</a></h1>
<div id="titleandcat" class="box">
<img src="/assets/dance_transparent.gif" id="sapari-dance">
<h1 id="maintitle"><a style="text-decoration: none; color: #E9E9E9;" href="./">Quinten's Outpost</a></h1>
<img src="/assets/dance_transparent.gif" id="sapari-dance">
</div>
<button id="oneko-button" class="button">:3</button>
</div>
@ -139,6 +144,7 @@
<ul style="margin-bottom: 0;">
<li><a href="#top">Top</a></li>
<li><a href="#Status">Status</a></li>
<li><a href="#spaceweather">Space Weather</a></li>
</ul>
</div>

10
links.html
View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>Quintens Outpost</title>
<title>Links - Quintens Outpost</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
@ -52,10 +52,16 @@
<div class="container-main">
<div id="maintitlebox">
<h1 id="maintitle" class="box"><a style="text-decoration: none; color: #E9E9E9;" href="./">Quinten's Outpost</a></h1>
<div id="titleandcat" class="box">
<img src="/assets/dance_transparent.gif" id="sapari-dance">
<h1 id="maintitle"><a style="text-decoration: none; color: #E9E9E9;" href="./">Quinten's Outpost</a></h1>
<img src="/assets/dance_transparent.gif" id="sapari-dance">
</div>
<button id="oneko-button" class="button">:3</button>
</div>
<div id="subtitlebox">
<div id="links" class="box">
<a class="linkbox link onsite" href="./"> <!-- TODO: MAKE ON-WEB LINKS A SEPERATE BOX [ALSO PRIORITIZED OVER SOCIALS, MAYBE MOVE SOCIALS AWAY / SMALLER / AS SIDEBAR?] -->

54
style.css
View File

@ -96,7 +96,6 @@ html {
font-style: normal;
color: #E9E9E9;
font-weight: 400;
/* min-width: 1000px; /* probably play with this to DECIMATE mobile and get consistent layout at the cost of horizontal scroll on mobile */
}
body {
@ -199,6 +198,10 @@ button {
}
.sidebar {
max-width: 250px;
overflow: hidden;
@ -281,19 +284,38 @@ button {
position: relative; /* for oneko-button "inside" */
}
#maintitle {
font-size: 3.5rem;
text-align: center;
margin: 0;
margin: auto;
}
#titleandcat {
display: flex;
align-items: center;
justify-content: center;
padding-left: 0;
padding-right: 0;
margin-bottom: 0;
}
#maintitle {
font-size: 3.5rem;
text-align: center;
}
#sapari-dance {
height: 5rem;
min-height: 3rem;
margin-left: 0.5rem;
margin-right: 0.5rem;
}
#oneko-button {
position: absolute;
top: -1.5rem; /* adjust for margin */
right: 0;
padding: 0.65rem;
}
#oneko-button {
position: absolute;
top: -1.5rem; /* adjust for margin */
right: 0;
padding: 0.65rem;
}
@ -339,6 +361,10 @@ button {
font-size: 1.2rem;
}
#directory-box {
margin-top: 0.5rem;
margin-bottom: 1.5rem;
}
#directory-icon {
height: 1.5rem;
@ -565,7 +591,7 @@ button {
#spaceweather-ovation {
width: 80%;
max-width: 300px;
}
}
}

12
template.html
View File

@ -18,7 +18,12 @@
<div class="container-main">
<div id="maintitlebox">
<h1 id="maintitle" class="box"><a style="text-decoration: none; color: #E9E9E9;" href="./">Quinten's Outpost</a></h1>
<div id="titleandcat" class="box">
<img src="/assets/dance_transparent.gif" id="sapari-dance">
<h1 id="maintitle"><a style="text-decoration: none; color: #E9E9E9;" href="./">Quinten's Outpost</a></h1>
<img src="/assets/dance_transparent.gif" id="sapari-dance">
</div>
<button id="oneko-button" class="button">:3</button>
</div>
@ -52,7 +57,7 @@
<!-- must resist the urge to dynamically generate this, fuck js -->
<h5 style="display: inline-block; padding: 0;">Current directory:</h5>
<p style="display: inline-block;">
<img src="./assets/icons/tux.svg" id="directory-icon">/<a class="link" href="./">home/quinten</a>/<a class="link" href="./">CHANGEME</a>
<img src="./assets/icons/tux.svg" id="directory-icon">/<a class="link" href="./">home/quinten</a>
</p>
</div>
@ -77,7 +82,8 @@
<h5 style="padding-bottom: 0;">Tree</h5>
<ul style="margin-bottom: 0;">
<li><a href="#top">Top</a></li>
<li><a href="#">CHANGE ME</a></li>
<li><a href="#Status">Status</a></li>
<li><a href="#spaceweather">Space Weather</a></li>
</ul>
</div>