made some more progress on the design
im gonna remake it to resemble wikipedia more though
This commit is contained in:
parent
fa787960fa
commit
701da8d265
@ -6,6 +6,7 @@
|
|||||||
--light-dark-color: #252525;
|
--light-dark-color: #252525;
|
||||||
--lighter-dark-color: #2D2D2D;
|
--lighter-dark-color: #2D2D2D;
|
||||||
--flair-color: #E65632;
|
--flair-color: #E65632;
|
||||||
|
--main-text-color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
*
|
*
|
||||||
@ -14,10 +15,11 @@
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
a
|
||||||
{
|
{
|
||||||
|
color: var(--main-text-color);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
position: relative;
|
position: relative;
|
||||||
text-decoration: none;
|
|
||||||
}
|
}
|
||||||
a::after
|
a::after
|
||||||
{
|
{
|
||||||
@ -52,25 +54,39 @@ header
|
|||||||
background-color: var(--lighter-dark-color);
|
background-color: var(--lighter-dark-color);
|
||||||
align-items: center;
|
align-items: center;
|
||||||
display: flex;
|
display: flex;
|
||||||
height: fit-content;
|
height: 4vw;
|
||||||
}
|
left: 0;
|
||||||
|
position: fixed;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
|
||||||
|
transition: all 0.2s;
|
||||||
|
}
|
||||||
|
header:hover
|
||||||
|
{
|
||||||
|
height: 5vw;
|
||||||
|
}
|
||||||
header img
|
header img
|
||||||
{
|
{
|
||||||
margin: 0.75vw 1vw 0.75vw 2vw;
|
margin: 0 1vw 0 2vw;
|
||||||
height: 2.5vw;
|
height: 2.5vw;
|
||||||
}
|
}
|
||||||
header h3
|
header h3
|
||||||
{
|
{
|
||||||
color: var(--flair-color);
|
color: var(--flair-color);
|
||||||
width: 20%;
|
|
||||||
}
|
}
|
||||||
header .items
|
header #header-title
|
||||||
|
{
|
||||||
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
width: 30%;
|
||||||
|
}
|
||||||
|
header #header-items
|
||||||
{
|
{
|
||||||
text-align: left;
|
text-align: left;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
header .items *
|
header #header-items *
|
||||||
{
|
{
|
||||||
margin: 0 1vw;
|
margin: 0 1vw;
|
||||||
}
|
}
|
||||||
@ -100,6 +116,11 @@ main .para
|
|||||||
margin-top: 7.5vw;
|
margin-top: 7.5vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.nounderline
|
||||||
|
{
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
.title
|
.title
|
||||||
{
|
{
|
||||||
background-color: var(--light-dark-color);
|
background-color: var(--light-dark-color);
|
||||||
|
|||||||
BIN
images/favicon.ico
Normal file
BIN
images/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
BIN
images/icon.png
Normal file
BIN
images/icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
BIN
images/logo.webp
BIN
images/logo.webp
Binary file not shown.
|
Before Width: | Height: | Size: 223 KiB |
61
index.html
61
index.html
@ -2,32 +2,69 @@
|
|||||||
|
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<link type="text/css" rel="stylesheet" href="/css/global.css">
|
<link type="image/x-icon" rel="icon" href="images/favicon.ico">
|
||||||
|
<link type="text/css" rel="stylesheet" href="css/global.css">
|
||||||
|
|
||||||
<title>Welcome to SuperNOVA!</title>
|
<title>4472 SuperNOVA</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<!--HEADER-->
|
<!--HEADER-->
|
||||||
|
<header>
|
||||||
|
<div id="header-title">
|
||||||
|
<img src="images/favicon.ico">
|
||||||
|
<h3>4472 SuperNOVA</h3>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="header-items">
|
||||||
|
<a class="nounderline">Home</a>
|
||||||
|
<a class="nounderline">Another</a>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<h1>Welcome to SuperNOVA!</h1>
|
<h1>4472 SuperNOVA</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--TABLE OF CONTENTS-->
|
<!--TABLE OF CONTENTS-->
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
<p>
|
<div class="para">
|
||||||
SuperNOVA is the name for the First Robotics Competition team 4472.
|
<h2 class="para-title" id="about-supernova">About SuperNOVA</h2>
|
||||||
This is the online documentation website for SuperNOVA. This website will include
|
<p>
|
||||||
everything documented by the SuperNOVA team, including parts of WPILib, methods of
|
SuperNOVA is a team that has participated in the
|
||||||
programming certain things, and more!
|
<a href="https://www.firstinspires.org/robotics/frc" target="_blank">First Robotics Competition</a>
|
||||||
</p>
|
every year since 2013 and has been given the team number <b>4472</b>.
|
||||||
|
SuperNOVA has members from around most of Prince William County, including
|
||||||
|
the following schools:
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li><a class="nounderline" href="https://patrioths.pwcs.edu" target="_blank">Patriot High School</a></li>
|
||||||
|
<li><a class="nounderline" href="https://woodbridgehs.pwcs.edu" target="_blank">Woodbridge Senior High School</a></li>
|
||||||
|
<li><a class="nounderline" href="https://forestparkhs.pwcs.edu" target="_blank">Forest Park High School</a></li>
|
||||||
|
<li><a class="nounderline" href="https://www.jpthegreat.org" target="_blank">Saint John Paul the Great Catholic High School</a></li>
|
||||||
|
<li><a class="nounderline" href="https://colganhs.pwcs.edu" target="_blank">Colgan High School</a></li>
|
||||||
|
<li><a class="nounderline" href="https://gainesvillehs.pwcs.edu" target="_blank">Gainesville High School</a></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Since 2018, SuperNOVA has qualified for the FRC world championships every year.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="para">
|
<div class="para">
|
||||||
<h2 id="title">Something</h2>
|
<h2 class="para-title" id="about-the-docs">About the Docs</h2>
|
||||||
<p>
|
<p>
|
||||||
Put something here. I don't care what.
|
In the programming division of SuperNOVA, there is a group that is tasked with
|
||||||
|
writing the documentation for the active project and everything about it. For
|
||||||
|
several years, while SuperNOVA was using GitLab to host their codebase,
|
||||||
|
SuperNOVA used the built-in wiki to help design their documentation. However in
|
||||||
|
2023, SuperNOVA switched from using GitLab to GitHub, and unlike GitLab, GitHub
|
||||||
|
prohibits making wikis on private repositories without paying premium. As a
|
||||||
|
solution, this website was made. This website serves as a public wikipedia on
|
||||||
|
SuperNOVA's current ideas and innovations, as well as anything else worth
|
||||||
|
documenting. This website will be updated as the season progresses.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
@ -35,5 +72,5 @@
|
|||||||
|
|
||||||
<!--FOOTER-->
|
<!--FOOTER-->
|
||||||
|
|
||||||
<script src="/js/global.js"></script>
|
<script src="js/global.js"></script>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
38
js/global.js
38
js/global.js
@ -3,11 +3,13 @@ const internet = new XMLHttpRequest();
|
|||||||
var htmlStr = document.documentElement.innerHTML;
|
var htmlStr = document.documentElement.innerHTML;
|
||||||
|
|
||||||
// Insert site parts
|
// Insert site parts
|
||||||
insertHeader();
|
//insertHeader();
|
||||||
insertFooter();
|
insertContents();
|
||||||
|
//insertFooter();
|
||||||
|
|
||||||
// Update page
|
// Update page
|
||||||
document.documentElement.innerHTML = htmlStr;
|
document.documentElement.innerHTML = htmlStr;
|
||||||
|
alert("test");
|
||||||
|
|
||||||
// ----- Begin function declarations
|
// ----- Begin function declarations
|
||||||
|
|
||||||
@ -24,6 +26,38 @@ function insertHeader()
|
|||||||
while (htmlStr.includes(headerReplace)) htmlStr = htmlStr.replace(headerReplace, header);
|
while (htmlStr.includes(headerReplace)) htmlStr = htmlStr.replace(headerReplace, header);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
function insertContents()
|
||||||
|
{
|
||||||
|
const tableReplace = "<!--TABLE OF CONTENTS-->";
|
||||||
|
|
||||||
|
var table = document.createElement("div");
|
||||||
|
table.setAttribute("id", "table-of-contents");
|
||||||
|
|
||||||
|
var title = document.createElement("h2");
|
||||||
|
title.textContent = "Table of Contents";
|
||||||
|
|
||||||
|
table.appendChild(title);
|
||||||
|
|
||||||
|
var list = document.createElement("ul");
|
||||||
|
|
||||||
|
var titleObjects = document.getElementsByClassName("para-title");
|
||||||
|
for (var i = 0; i < titleObjects.length; i++)
|
||||||
|
{
|
||||||
|
var appendLink = document.createElement("a");
|
||||||
|
appendLink.setAttribute("class", "nounderline");
|
||||||
|
appendLink.setAttribute("href", "#" + titleObjects[i].id);
|
||||||
|
appendLink.textContent = titleObjects[i].textContent;
|
||||||
|
|
||||||
|
var append = document.createElement("li");
|
||||||
|
append.appendChild(appendLink);
|
||||||
|
|
||||||
|
list.appendChild(append);
|
||||||
|
}
|
||||||
|
|
||||||
|
table.appendChild(list);
|
||||||
|
|
||||||
|
while (htmlStr.includes(tableReplace)) htmlStr = htmlStr.replace(tableReplace, table.outerHTML);
|
||||||
|
}
|
||||||
function insertFooter()
|
function insertFooter()
|
||||||
{
|
{
|
||||||
const footerUrl = "/partial/footer.html"
|
const footerUrl = "/partial/footer.html"
|
||||||
|
|||||||
@ -1,9 +1,11 @@
|
|||||||
<header>
|
<header>
|
||||||
<img src="/images/logo.webp">
|
<div id="header-title">
|
||||||
<h3>4472 SuperNOVA</h3>
|
<img src="/images/favicon.ico">
|
||||||
|
<h3>4472 SuperNOVA</h3>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="items">
|
<div id="header-items">
|
||||||
<a>Home</a>
|
<a class="nounderline">Home</a>
|
||||||
<a>Another</a>
|
<a class="nounderline">Another</a>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
Loading…
x
Reference in New Issue
Block a user