new site design

lumin-org · Aug 9, 2024 · 8d97390 · 8d97390
1 parent 7df0c70
commit 8d97390
Show file tree

Hide file tree

Showing 4 changed files with 94 additions and 117 deletions.
diff --git a/README.md b/README.md
@@ -1,2 +1,9 @@
-# Canary Softworks
-The official landing website for Canary Softworks
+<div align="center">
+
+# Lumin Labs • <svg version="1.2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 490 360" width="30" height="22"><defs><linearGradient id="P" gradientUnits="userSpaceOnUse"/><linearGradient id="g1" x2="1" href="#P" gradientTransform="matrix(0,-359.46,488.66,0,244.792,360)"><stop stop-color="#8bfe78"/><stop offset="1" stop-color="#aee189"/></linearGradient></defs><style>.a{fill:url(#g1)}</style><path class="a" d="m116.6 299.9v60.1h-36.4q-12 0-18.9-6.9l-53.2-51.4q-4.3-4.9-6.1-8.4-1.5-3.9-1.5-10v-282.8h65.7v270.3q0 3.1 1.5 4.1l25 24q1.5 1 4.1 1zm372.5-126.1v186.2h-65.8v-173.7q0-3.1-1.5-4.6l-25.2-23.2q-1-1-3.6-1h-27q-2.8 0-3.8 1l-25.5 23.2q-1.5 1.5-1.5 4.6v4.5 169.2h-65.7v-173.7q0-3.1-1.6-4.6l-25.2-23.2q-1-1-3.6-1h-27.2q-2.6 0-3.6 1l-25.5 23.2q-1.5 1.5-1.5 4.6v173.7h-65.7v-261.4h65.7v21.9l15.5-15q6.9-6.9 18.9-6.9h39.5q11.7 0 18.8 6.9l37.7 35.9 39-35.9q7.4-6.9 18.9-6.9h39.7q11.5 0 18.6 6.9l53.3 50.4q4.3 3.9 6.1 7.9 1.8 3.9 1.8 10z"/></svg>
+
+The official landing website for Lumin Labs
+
+[![Lumin](https://github-readme-stats-git-masterorgs-github-readme-stats-team.vercel.app/api?username=rickstaa&include_orgs=true)](https://github.com/anuraghazra/github-readme-stats)
+
+</div>
diff --git a/assets/logo.svg b/assets/logo.svg
diff --git a/css/styles.css b/css/styles.css
@@ -1,68 +1,77 @@
-@import url("https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css");
-@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
+@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Victor+Mono:ital,wght@0,100..700;1,100..700&display=swap");
 
 body {
-    font-family: "Inter", sans-serif;
-    font-optical-sizing: auto;
-    font-variation-settings:
-        "slnt" 0;
-
-    background-color: rgb(33, 37, 41);
-    color: white;
-}
-
-img {
-    user-select: none;
+  background-color: #090a0f;
 }
 
-a.social {
-    font-size: 1.5rem;
-    color: gray;
-    margin: 6.5px;
+.navbar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 10px 25px;
 }
 
-div.social-bar {
-    margin-right: 8px;
+.logo img {
+  height: 24px;
 }
 
-img.branding {
-    all: unset;
-    user-select: none;
+.nav-buttons {
+  display: flex;
+  gap: 10px;
 }
 
-.nav-item {
-    padding: 5px;
+.nav-buttons button {
+  font-family: "JetBrains Mono";
+  font-size: medium;
+  border: solid;
+  border-radius: 6px;
+  border-color: #090a0f;
+  background: none;
+  color: white;
+  padding: 10px 20px;
+  cursor: pointer;
+  transition: 0.3s;
 }
 
-a.social:hover {
-    color: rgb(194, 193, 196);
+.nav-buttons button:hover {
+  background-color: #1f2025;
+  border-color: #1f2025;
 }
 
-main>p, main>h2 {
-    color: white;
+.intro-text {
+  padding-top: 5%;
+  padding-left: 2%;
 }
 
-main#content {
-    margin: 35px;
+.intro-text h1 {
+  font-family: "JetBrains Mono";
+  font-weight: 1000;
+  font-size: 350%;
+  color: whitesmoke;
 }
 
-::selection {
-    color: black;
-    background-color: rgb(145, 174, 226);
+.intro-text description {
+  font-family: "JetBrains Mono";
+  font-size: 150%;
+  color: grey;
 }
 
-::-webkit-scrollbar {
-    width: 0.7rem;
+.intro-buttons {
+  padding-left: 2%;
+  padding-top: 5%;
+  display: flex;
+  gap: 20px;
 }
 
-::-webkit-scrollbar-track {
-    background: rgb(47, 47, 47);
+.intro-buttons button {
+  font-family: "JetBrains Mono";
+  font-size: x-large;
+  background: none;
+  border: none;
+  border-radius: 10px;
+  color: whitesmoke;
+  cursor: pointer;
+  width: 17%;
+  height: 50px;
+  color: black;
 }
-
-::-webkit-scrollbar-thumb {
-    background: rgb(120, 120, 120);
-}
-
-::-webkit-scrollbar-thumb:hover {
-    background: rgb(90, 90, 90);
-}
diff --git a/index.html b/index.html
@@ -1,56 +1,35 @@
 <!DOCTYPE html>
 <html lang="en">
 
-<head>
-  <meta charset="UTF-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Canary Softworks</title>
-  <link rel="icon" type="image/x-icon" href="/assets/favicon.ico">
-  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
-    integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
-  <link rel="stylesheet" href="/css/styles.css">
-</head>
+	<head>
+		<meta charset="UTF-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>Lumin Labs</title>
+		<link rel="icon" type="image/x-icon" href="/favicon.ico" />
+		<link rel="stylesheet" href="/css/styles.css">
+	</head>
 
-<body>
-  <nav class="navbar navbar-expand-lg fixed-top bg-body-tertiary border-bottom border-body" data-bs-theme="dark">
-    <div class="container-fluid">
-      <a class="navbar-brand" href="#">
-        <img class="d-inline-block align-text-top branding" src="/assets/logo.svg" alt="Canary Softworks"
-          style="padding-top: 4px;">
-      </a>
-      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
-        aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
-        <span class="navbar-toggler-icon"></span>
-      </button>
-      <div class="collapse navbar-collapse" id="navbarSupportedContent">
-        <ul class="navbar-nav me-auto mb-2 mb-lg-0">
-          <li class="nav-item">
-            <a class="nav-link" href="/pages/oss.html">OSS</a>
-          </li>
-          <li class="nav-item">
-            <a class="nav-link" href="/pages/games.html">Games</a>
-          </li>
-          <li class="nav-item">
-            <a class="nav-link" href="/pages/partners.html">Partners</a>
-          </li>
-        </ul>
-        <div class="social-bar">
-          <a href="https://github.com/canary-softworks" target="_blank" class="social bi bi-github"></a>
-          <a href="https://www.youtube.com/@canary-softworks" target="_blank" class="social bi bi-youtube"></a>
-          <a href="https://discord.gg/cwwcZtqJAt" target="_blank" class="social bi bi-discord"></a>
-        </div>
-      </div>
-    </div>
-  </nav>
-  <img src="/assets/banner.png" width="100%">
-  <main id="content">
-    <p>Here at Canary Softworks, we are commited to giving both the developer and player the best experience possible.
-      Whether it be reliability, playability, or quality we have your back.</p>
-  </main>
-  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
-    integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
-    crossorigin="anonymous"></script>
-</body>
+	<body>
+		<nav class="navbar">
+			<div class="logo">
+				<img src="assets/logo.svg" alt="Logo">
+			</div>
+			<div class="nav-buttons">
+				<button>🔆</button>
+				<button>About</button>
+				<button>Projects</button>
+				<button>Branding</button>
+			</div>
+		</nav>
+		<div class="intro-text">
+			<h1>Lumin Labs</h1>
+			<description>A backend gaming development industry.</description>
+		</div>
+
+		<div class="intro-buttons">
+			<button style="background-color: #8BFF78" ;">About us</button>
+			<button style="background-color: #78aeff" ;">Projects</button>
+		</div>
+	</body>
 
 </html>