commit 02802c710f353536ec2d9c88844f462eb06dd907
Author: crt <crt@adastra7.net>
Date:   Mon Feb 26 12:04:48 2024 +0100

    uploader

diff --git a/README.md b/README.md
new file mode 100644
index 0000000..2a68e9f
--- /dev/null
+++ b/README.md
@@ -0,0 +1 @@
+# Some css and js stuff im doing idk doe prolly never gonna finish this rework
diff --git a/css/nav.css b/css/nav.css
new file mode 100755
index 0000000..8508881
--- /dev/null
+++ b/css/nav.css
@@ -0,0 +1,189 @@
+
+.nav-bar {
+	display:flex;
+	align-items:center;
+	justify-content: center;
+	height:40px;
+}
+.nav, .nav0{
+	color:#ffffff;
+	text-decoration:none;
+	padding:15px;
+	transition: all .5s ease;
+	position : relative;
+}
+.nav:hover{
+	text-shadow:
+    1px 1px 0 #ffffff,
+  	transition: all .5s;
+}
+.nav::before{
+	content:"";
+	width:100%;
+	height:1px;
+	bottom:0;
+	left:0;
+	position: absolute;
+	background-color:#ffffff;
+	transform-origin: bottom;
+  transform: scaleX(0);
+	transition: transform 0.5s ease;
+}
+.nav:hover::before{
+	transform: scaleX(1);
+}
+.dot{
+	display:inline-block;
+	width:10px;
+	height:10px;
+	border-radius:10px;
+	background-color:#000;
+	transition: all 0.5s;
+	animation-name: blinking;
+	animation-duration: 4s;
+	animation-iteration-count: infinite;
+}
+.nav0:hover{
+	text-shadow:1px 1px 0 #000,1px 1px 0 #000,1px 1px 0 #000,1px 1px 0 #000;
+}
+.nav0:hover .dot{
+	box-shadow: 0px 1px #016A70, 1px 1px #016A70;
+}
+@keyframes blinking{
+	0%{
+		height:2px;
+		transform: translateY(-100%);
+	}
+	5%{
+		height:10px;
+		transform: translateY(0%);
+	}
+	7%{
+		height:2px;
+		transform: translateY(-100%);
+	}
+	10%{
+		height:10px;
+		transform: translateY(0%);
+	}
+	68%{
+		height:10px;
+		transform: translateY(0%);
+	}
+	70%{
+		height:2px;
+		transform: translateY(-100%);
+	}
+	76%{
+		height:10px;
+		transform: translateY(0%);
+	}
+	100%{
+		height:10px;
+		transform: translateY(0%);
+	}
+}
+.main {
+	color:#000;
+	display:flex;
+  justify-content: center;
+  align-items: center;
+	font-size: 50px;
+}
+.container {
+	display: block;
+	height: 63%;
+	cursor: context-menu;
+	margin-top: 200px;
+}
+.paragraph{
+	width:65vw;
+	color: #000;
+	margin-left: auto;
+  margin-right: auto;
+	text-align : center;
+}
+.name{
+	transition: all 0.5s ease;
+	font-weight: bold;
+}
+.name:hover {
+	text-shadow:
+    1px 1px 0 #000,
+    1px 1px 0 #000,
+    1px 1px 0 #000,
+    1px 1px 0 #000;
+}
+::selection {
+  color: #8DDFCB;
+  background: #000;
+}
+
+
+/* Mobile compatibility */
+@media only screen and (max-width: 768px) {
+    .nav-bar {
+        flex-direction: column;
+        align-items: flex-start;
+        padding: 10px;
+    }
+
+    .nav, .nav0 {
+        padding: 10px;
+        font-size: 14px; /* Adjust font size for smaller screens */
+    }
+
+    .nav-bar, .main, .container, .paragraph {
+        flex-direction: column;
+        align-items: center;
+    }
+
+    .main {
+        font-size: 30px; /* Adjust main section font size */
+    }
+
+    .paragraph {
+        width: 85%; /* Adjust paragraph width */
+    }
+}
+
+/* Hamburger menu for smaller screens */
+@media only screen and (max-width: 768px) {
+    .hamburger-menu {
+        display: block;
+        cursor: pointer;
+    }
+
+    .nav-menu {
+        display: none; /* Hide nav menu by default on mobile */
+        flex-direction: column;
+        align-items: center;
+    }
+
+    .hamburger-menu.active + .nav-menu {
+        display: flex; /* Show menu when hamburger is active */
+    }
+}
+
+
+.logo {
+    height: 40px; /* Adjust the height to fit your navbar's size */
+    width: auto; /* Keeps the logo's aspect ratio intact */
+}
+
+.logo-link {
+    display: inline-flex;
+    align-items: center;
+    position: relative; /* Needed for the positioning of the pseudo-element */
+    margin-right: 20px; /* Adjust if you need more space around the divider */
+}
+
+.logo-link::after {
+    content: "";
+    position: absolute;
+    right: -10px; /* Adjust this value based on your specific spacing needs */
+    top: 0;
+    bottom: 0;
+    width: 1px;
+    background-color: white; /* Set the color of the divider */
+}
diff --git a/css/scaler.css b/css/scaler.css
new file mode 100644
index 0000000..217c308
--- /dev/null
+++ b/css/scaler.css
@@ -0,0 +1,14 @@
+@media only screen and (-webkit-min-device-pixel-ratio: 1.5), 
+       only screen and (min--moz-device-pixel-ratio: 1.5), 
+       only screen and (-o-min-device-pixel-ratio: 3/2), 
+       only screen and (min-device-pixel-ratio: 1.5), 
+       only screen and (min-resolution: 144dpi), 
+       only screen and (min-resolution: 1.5dppx) {
+
+    .nav-bar, .logo, .nav {
+        /* Increase font sizes, padding, or other properties as needed */
+        font-size: 95%; /* Example: Increase font size */
+        
+    }
+    /* Add any other high-resolution adjustments here */
+}
diff --git a/css/waves.css b/css/waves.css
new file mode 100755
index 0000000..a3d1aec
--- /dev/null
+++ b/css/waves.css
@@ -0,0 +1,105 @@
+@import url(//fonts.googleapis.com/css?family=Lato:300:400);
+
+body {
+  margin:0;
+}
+
+h1 {
+  font-family: 'Lato', sans-serif;
+  font-weight:300;
+  letter-spacing: 2px;
+  font-size:48px;
+}
+p {
+  font-family: 'Lato', sans-serif;
+  letter-spacing: 1px;
+  font-size:14px;
+  color: #333333;
+}
+
+.header {
+  position:relative;
+  text-align:center;
+  background: linear-gradient(60deg, rgba(84,58,183,1) 0%, rgba(0,172,193,1) 100%);
+  color:white;
+}
+.logo {
+  width:50px;
+  fill:white;
+  padding-right:15px;
+  display:inline-block;
+  vertical-align: middle;
+}
+
+.inner-header {
+  height:65vh;
+  width:100%;
+  margin: 0;
+  padding: 0;
+}
+
+.flex { /*Flexbox for containers*/
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+}
+
+.waves {
+  position:relative;
+  width: 100%;
+  height:15vh;
+  margin-bottom:-7px; /*Fix for safari gap*/
+  min-height:100px;
+  max-height:150px;
+}
+
+.content {
+  position:relative;
+  height:10vh;
+  text-align:center;
+  background-color: white;
+}
+
+/* Animation */
+
+.parallax > use {
+  animation: move-forever 25s cubic-bezier(.55,.5,.45,.5)     infinite;
+}
+.parallax > use:nth-child(1) {
+  animation-delay: -2s;
+  animation-duration: 7s;
+}
+.parallax > use:nth-child(2) {
+  animation-delay: -3s;
+  animation-duration: 10s;
+}
+.parallax > use:nth-child(3) {
+  animation-delay: -4s;
+  animation-duration: 13s;
+}
+.parallax > use:nth-child(4) {
+  animation-delay: -5s;
+  animation-duration: 20s;
+}
+@keyframes move-forever {
+  0% {
+   transform: translate3d(-90px,0,0);
+  }
+  100% { 
+    transform: translate3d(85px,0,0);
+  }
+}
+/*Shrinking for mobile*/
+@media (max-width: 768px) {
+  .waves {
+    height:40px;
+    min-height:40px;
+  }
+  .content {
+    height:14vh;
+  }
+  h1 {
+    font-size:24px;
+  }
+}
diff --git a/grid.html b/grid.html
new file mode 100644
index 0000000..d259ebf
--- /dev/null
+++ b/grid.html
@@ -0,0 +1,168 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Adastra7</title>
+<style>
+    body, html {
+        margin: 0;
+        padding: 0;
+        width: 100%;
+        height: 100%;
+        font-family: Arial, sans-serif;
+    }
+
+    .navbar {
+        display: flex;
+        justify-content: flex-end;
+        padding: 20px;
+        background: linear-gradient(to right, #004e92, #000428);
+        color: white;
+        position: relative;
+    }
+
+    .navbar a, .navbar .nav-item {
+        margin-left: 20px;
+        color: white;
+        text-decoration: none;
+        transition: color 0.3s ease;
+    }
+
+    .navbar a:hover, .nav-item:hover > a {
+        color: #a8dadc;
+    }
+
+    .content {
+        padding: 20px;
+        text-align: center;
+    }
+
+    #home {
+        background: linear-gradient(to bottom, #89f7fe, #66a6ff);
+        color: white;
+        min-height: 90vh;
+    }
+
+    /* Responsive navbar */
+    .nav-toggle {
+        display: none;
+        cursor: pointer;
+    }
+
+    .submenu {
+        display: none;
+        position: absolute;
+        background-color: #f9f9f9;
+        min-width: 160px;
+        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+        z-index: 1;
+        top: 40px;
+        left: 0;
+        border-radius: 4px;
+    }
+
+    .submenu a {
+        color: black;
+        padding: 12px 16px;
+        text-decoration: none;
+        display: block;
+        transition: background-color 0.3s ease;
+    }
+
+    .submenu a:hover {
+        background-color: #f1f1f1;
+    }
+
+    .nav-item:hover .submenu {
+        display: block;
+    }
+
+    @media (max-width: 768px) {
+        .navbar {
+            flex-direction: column;
+            align-items: flex-start;
+        }
+
+        .navbar a, .navbar .nav-item {
+            display: none;
+            margin-left: 0;
+            padding: 10px;
+        }
+
+        .nav-toggle {
+            display: block;
+        }
+
+        .submenu {
+            position: static;
+        }
+    }
+</style>
+</head>
+<body>
+    <div class="navbar">
+        <span class="nav-toggle" onclick="toggleNav()">&#9776; Menu</span>
+        <a href="#" onclick="showSection('home')">Home</a>
+        <a href="#" onclick="showSection('search')">Search</a>
+        <a href="#" onclick="showSection('following')">Following</a>
+        <div class="nav-item">
+            <a href="#">Settings</a>
+            <div class="submenu">
+                <a href="#" onclick="showSection('profile')">Profile</a>
+                <a href="#" onclick="showSection('privacy')">Privacy</a>
+                <a href="#" onclick="showSection('notifications')">Notifications</a>
+            </div>
+        </div>
+    </div>
+
+    <div id="home" class="content">
+        <h1>Adastra7</h1>
+        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+    </div>
+    <div id="search" class="content" style="display:none">
+        <h2>Search</h2>
+        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+    </div>
+    <div id="following" class="content" style="display:none">
+        <h2>Following</h2>
+        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+    </div>
+    <div id="settings" class="content" style="display:none">
+        <h2>Settings</h2>
+        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+    </div>
+    <!-- Additional Sections for Submenu Items -->
+    <div id="profile" class="content" style="display:none">
+        <h2>Profile Settings</h2>
+        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+    </div>
+
+
+<script>
+
+    
+    function showSection(sectionId) {
+        document.querySelectorAll('.content').forEach(function(section) {
+            section.style.display = 'none';
+        });
+
+        document.getElementById(sectionId).style.display = 'block';
+        if (window.innerWidth <= 768) {
+            toggleNav(); // Automatically close the nav on selection for mobile users
+        }
+    }
+
+    function toggleNav() {
+        const navItems = document.querySelectorAll('.navbar a');
+        for (let i = 0; i < navItems.length; i++) {
+            if (navItems[i].style.display === 'block') {
+                navItems[i].style.display = 'none';
+            } else {
+                navItems[i].style.display = 'block';
+            }
+        }
+    }
+</script>
+</body>
+</html>
diff --git a/img/adastra7.webp b/img/adastra7.webp
new file mode 100644
index 0000000..24690b4
Binary files /dev/null and b/img/adastra7.webp differ
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..4e3167e
--- /dev/null
+++ b/index.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="en" >
+<head>
+  <meta charset="UTF-8">
+  <title>i hate javascript</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="stylesheet" href="css/waves.css">
+  <link rel="stylesheet" href="css/nav.css">
+  <link rel="stylesheet" href="css/scaler.css">
+  <link href="https://fonts.googleapis.com/css2?family=Pacifico&family=Quicksand&display=swap" rel="stylesheet">
+</head>
+<body>
+<!-- partial:index.partial.html -->
+<!--Hey! This is the original version
+of Simple CSS Waves-->
+
+<div class="header">
+  <div class="nav-bar" style="font-family: 'Quicksand'">
+    <div id="links">
+      <a href="#" class="nav">Home</a>
+      <a href="#" class="nav">Services</a>
+      <a href="#" class="nav">About</a>
+      <a href="#" class="nav">Contact</a>
+    </div>
+  </div>
+
+<!--Content before waves-->
+<div class="inner-header flex">
+
+<!--Just the logo.. Don't mind this-->
+<h1>Adastra7</h1>
+</div>
+
+<!--Waves Container-->
+<div>
+<svg class="waves" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+viewBox="0 24 150 28" preserveAspectRatio="none" shape-rendering="auto">
+<defs>
+<path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" />
+</defs>
+<g class="parallax">
+<use xlink:href="#gentle-wave" x="48" y="0" fill="rgba(255,255,255,0.7" />
+<use xlink:href="#gentle-wave" x="48" y="3" fill="rgba(255,255,255,0.5)" />
+<use xlink:href="#gentle-wave" x="48" y="5" fill="rgba(255,255,255,0.3)" />
+<use xlink:href="#gentle-wave" x="48" y="7" fill="#fff" />
+</g>
+</svg>
+</div>
+<!--Waves end-->
+
+</div>
+<!--Header ends-->
+
+<!--Content starts-->
+<div class="content flex">
+  <p>Adastra7 | 2017-2024</p>
+</div>
+<!--Content ends-->
+<!-- partial -->
+  
+</body>
+</html>
\ No newline at end of file