🌐 Update website

younesaassila · Aug 14, 2021 · 3043409 · 3043409
1 parent e273089
commit 3043409
Show file tree

Hide file tree

Showing 8 changed files with 102 additions and 142 deletions.
diff --git a/docs/app.js b/docs/app.js
@@ -0,0 +1,7 @@
+(async function () {
+  // Fetch download link of the latest version.
+  const { url: downloadLink } = await fetch("update.json")
+    .then((response) => response.json())
+    .catch(console.error);
+  document.querySelector("#download-link").setAttribute("href", downloadLink);
+})();
diff --git a/docs/favicon.ico b/docs/favicon.ico
diff --git a/docs/index.html b/docs/index.html
@@ -3,20 +3,27 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link rel="stylesheet" href="style.css" />
+    <link rel="stylesheet" href="styles.css" />
+    <link rel="icon" href="favicon.ico" />
     <title>Kwyk Solver</title>
   </head>
   <body>
-    <header>
-      <h1>Kwyk Solver</h1>
-      <p>Un outil open source pour résoudre vos devoirs Kwyk.</p>
+    <main>
+      <h1 class="title">Kwyk Solver</h1>
+      <p class="description">
+        Un outil open source pour résoudre vos devoirs Kwyk.
+      </p>
       <div>
-        <button id="download-button" class="button-fill">Télécharger</button>
-        <button id="github-button">Page GitHub</button>
+        <a id="download-link" class="button fill" href="#">Télécharger</a>
+        <a
+          id="github-link"
+          class="button"
+          href="https://github.com/younesaassila/kwyk-solver"
+        >
+          Page GitHub
+        </a>
       </div>
-    </header>
-    <main id="main"></main>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/11.0.0/markdown-it.min.js"></script>
-    <script src="index.js"></script>
+    </main>
+    <script src="app.js"></script>
   </body>
 </html>
diff --git a/docs/index.js b/docs/index.js
diff --git a/docs/style.css b/docs/style.css
diff --git a/docs/styles.css b/docs/styles.css
@@ -0,0 +1,74 @@
+@import url("https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&display=swap");
+
+:root {
+  --accent-color: #007aff;
+  --bg-color: #fafafa;
+  --font-family: "Atkinson Hyperlegible", sans-serif;
+  --text-color: #000000;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --accent-color: #0a84ff;
+    --bg-color: #1c1c1e;
+    --text-color: #ffffff;
+  }
+}
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  background-color: var(--bg-color);
+  color: var(--text-color);
+  font-family: var(--font-family);
+  margin: 0;
+  padding: 0;
+}
+
+main {
+  align-items: center;
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  justify-content: center;
+  margin: 0;
+  overflow: hidden;
+  padding: 0;
+  text-align: center;
+}
+
+main > .title {
+  font-size: 32pt;
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+main > .description {
+  font-size: 16pt;
+  margin-top: 0.5rem;
+  margin-bottom: 3rem;
+}
+
+.button {
+  background-color: inherit;
+  border: 1px solid var(--accent-color);
+  border-radius: 8px;
+  color: var(--accent-color);
+  cursor: pointer;
+  font-size: 15pt;
+  margin: 0.5rem;
+  padding: 0.65rem 1.65rem;
+  text-decoration: none;
+  transition: opacity 200ms;
+}
+
+.button:hover {
+  opacity: 0.7;
+}
+
+.button.fill {
+  background-color: var(--accent-color);
+  color: #ffffff;
+}
diff --git a/docs/update.json b/docs/update.json
@@ -0,0 +1,4 @@
+{
+  "version": "2.0.4",
+  "url": "https://github.com/younesaassila/kwyk-solver/releases/download/2.0.4/Kwyk-Solver-2.0.4.zip"
+}
diff --git a/docs/update_info.json b/docs/update_info.json