Эхлэл Бүгдийг харах Тусламж
Нэвтрэх
Sv443
/
sv443.net-Mirror
-ын хуулбар https://github.com/Sv443-Network/sv443.net
1
0
Салаа 0
Файлууд
Эх сурвалжийг харах

start work on api

Sven 3 жил өмнө
parent
45e5c55055
commit
01a4c48346
5 өөрчлөгдсөн 184 нэмэгдсэн , 75 устгасан
Өөрчлөлтийг ялгаж харах Өөрчлөлтийн статистик харах
  1. 17 0
      api/index.css
  2. 73 0
      api/index.html
  3. 11 0
      api/index.js
  4. 83 0
      css/global.css
  5. 0 75
      css/index.css

+ 17 - 0
api/index.css
Файл харах 

@@ -0,0 +1,17 @@
 
+body {
 
+    display: flex;
 
+    flex-direction: row;
 
+    justify-content: space-around;
 
+}
 
+
 
+main {
 
+    display: flex;
 
+    flex-direction: column;
 
+    margin: 30px 20px;
 
+}
 
+
 
+#apiList {
 
+    display: flex;
 
+    flex-direction: row;
 
+    justify-content: space-between;
 
+}

+ 73 - 0
api/index.html
Файл харах 

@@ -0,0 +1,73 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <title>APIs - Sv443 Network</title>
 
+
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <meta name="HandheldFriendly" content="true">
 
+    <meta name="pagename" content="APIs - Sv443 Network">
 
+    <meta name="application-name" content="APIs - Sv443 Network">
 
+    <meta property="og:title" content="APIs - Sv443 Network">
 
+    <meta name="description" content="DESC">
 
+    <meta name="twitter:card" content="DESC">
 
+    <meta property="og:description" content="DESC">
 
+    <meta name="subject" content="Video Games">
 
+    <meta name="copyright" content="Sv443 Network">
 
+    <meta name="author" content="Sv443">
 
+    <meta property="og:url" content="https://sv443.net/">
 
+    <meta property="og:image" content="https://sv443.net/favicon.png">
 
+    <meta property="og:type" content="profile"> 
+    <meta property="og:locale" content="en_US">
 
+    <meta property="og:locale:alternate" content="en_GB">
 
+
 
+    <link rel="stylesheet" href="../css/global.css">
 
+    <!-- <link rel="stylesheet" href="https://sv443.net/css/global.css"> #DEBUG -->
 
+    <link rel="stylesheet" href="./index.css">
 
+
 
+
 
+    <script src="https://cdn.jsdelivr.net/npm/js-cookie@rc/dist/js.cookie.min.js"></script>
 
+    <script src="./index.js"></script>
 
+
 
+    
+    <!-- Generated with https://realfavicongenerator.net/ -->
 
+    <link rel="apple-touch-icon" sizes="180x180" href="./resources/favicons/apple-touch-icon.png">
 
+    <link rel="icon" type="image/png" sizes="32x32" href="./resources/favicons/favicon-32x32.png">
 
+    <link rel="icon" type="image/png" sizes="16x16" href="./resources/favicons/favicon-16x16.png">
 
+    <link rel="manifest" href="./resources/favicons/site.webmanifest">
 
+    <link rel="mask-icon" href="./resources/favicons/safari-pinned-tab.svg" color="#101747">
 
+    <link rel="shortcut icon" href="./resources/favicons/favicon.ico">
 
+    <meta name="msapplication-TileColor" content="#101747">
 
+    <meta name="msapplication-config" content="./resources/favicons/browserconfig.xml">
 
+    <meta name="theme-color" content="#101747">
 
+</head>
 
+<body data-theme="dark">
 
+    <main>
 
+        <h2>APIs - Sv443 Network</h2>
 
+        <div class="list">
 
+            <div class="list-item">
 
+                <a href="https://jokeapi.dev/" id="jokeapi" rel="noopener noreferrer" class="img-link noul" target="_blank">
 
+                    <span class="list-item-container">
 
+                        <img src="https://sv443.net/resources/images/jokeapi.png" alt="JokeAPI" class="square"></img>
 
+                        <h4>JokeAPI</h4>
 
+                    </span>
 
+                </a>
 
+                <div class="list-item-desc">
 
+                    REST API that serves uniformly and well formatted jokes in JSON, XML, YAML or plain text format that also offers a great variety of filtering methods
 
+                </div>
 
+            </div>
 
+            <div class="list-item">
 
+                <a href="https://github.com/Sv443/geniURL" id="geniurl" rel="noopener noreferrer" class="img-link noul" target="_blank">
 
+                    <span class="list-item-container">
 
+                        <img src="https://sv443.net/resources/images/jokeapi.png" alt="GeniURL" class="square"></img>
 
+                        <h4>geniURL</h4>
 
+                    </span>
 
+                </a>
 
+                <div class="list-item-desc">
 
+                    Simple JSON and XML REST API to search for song metadata and the lyrics URL on genius.com
 
+                </div>
 
+            </div>
 
+        </div>
 
+    </main>
 
+</body>
 
+</html>

+ 11 - 0
api/index.js
Файл харах 

@@ -0,0 +1,11 @@
 
+function applyTheme()
 
+{
 
+    const theme = Cookies.get("theme_pref") || "light";
 
+
 
+    if(theme)
 
+        document.body.dataset.theme = theme;
 
+}
 
+
 
+document.addEventListener("DOMContentLoaded", () => {
 
+    // applyTheme();
 
+});

+ 83 - 0
css/global.css
Файл харах 

@@ -158,3 +158,86 @@ a:not(.noul):hover, .mimica:not(.noul):hover {
 
     color: #acb8ff;
 
     text-decoration: underline;
 
 }
 
+
 
+.list-header {
 
+    justify-content: center;
 
+    border-top: 2px solid black;
 
+    border-bottom: 2px solid black;
 
+    text-align: center;
 
+}
 
+
 
+.list-header h1 {
 
+    font-size: 1.8em;
 
+    font-weight: normal;
 
+    margin: 10px 0;
 
+}
 
+
 
+.list {
 
+    display: flex;
 
+    padding: 15px;
 
+    flex-wrap: wrap;
 
+    justify-content: space-evenly;
 
+}
 
+
 
+.list-item {
 
+    display: inline-block;
 
+    padding: 10px;
 
+    max-width: 300px;
 
+}
 
+
 
+.list-item-container {
 
+    display: flex;
 
+    flex-direction: column;
 
+    align-items: center;
 
+    padding: 3px;
 
+}
 
+
 
+.list-item-container > h4 {
 
+    font-family: "Roboto Condensed", "Roboto", "Segoe UI", sans-serif;
 
+    margin: 0;
 
+}
 
+
 
+.img-link {
 
+    text-decoration: none;
 
+    color: initial;
 
+    cursor: pointer;
 
+}
 
+
 
+.img-link:not(.no-margin) {
 
+    margin-left: 10px;
 
+    margin-right: 10px;
 
+}
 
+
 
+.img-link:not(.not-block) {
 
+    transition: transform 0.2s;
 
+    text-decoration: none;
 
+}
 
+
 
+.img-link:not(.not-block):hover {
 
+    transform: scale(1.1);
 
+    transition: transform 0.5s;
 
+}
 
+
 
+.img-link:visited {
 
+    color: initial;
 
+}
 
+
 
+img.square {
 
+    width: 65px;
 
+    height: 65px;
 
+    margin: 10px;
 
+    border-radius: 0%;
 
+    box-sizing: border-box;
 
+    background-size: cover;
 
+}
 
+
 
+img.rounded.square {
 
+    border-radius: 10px;
 
+}
 
+
 
+@media (max-width: 550px) {
 
+    img.square, img.rounded, img.circle {
 
+        width: 50px;
 
+        height: 50px;
 
+    }
 
+}

+ 0 - 75
css/index.css
Файл харах 

@@ -1,31 +1,6 @@
 
 @import url('https://fonts.googleapis.com/css2?family=Ubuntu&family=Roboto&family=Roboto+Condensed&display=swap');
 
 
 
-.img-link {
 
-    text-decoration: none;
 
-    color: initial;
 
-    cursor: pointer;
 
-}
 
-
 
-.img-link:not(.no-margin) {
 
-    margin-left: 10px;
 
-    margin-right: 10px;
 
-}
 
-
 
-.img-link:not(.not-block) {
 
-    transition: transform 0.2s;
 
-    text-decoration: none;
 
-}
 
-
 
-.img-link:not(.not-block):hover {
 
-    transform: scale(1.1);
 
-    transition: transform 0.5s;
 
-}
 
-
 
-.img-link:visited {
 
-    color: initial;
 
-}
 
-
 
 #support-link {
 
     display: inline-block;
 
     transition: transform 0.2s;
 
@@ -186,38 +161,6 @@ main {
 
     box-sizing: border-box;
 
 }
 
 
-.list-header {
 
-    justify-content: center;
 
-    border-top: 2px solid black;
 
-    border-bottom: 2px solid black;
 
-    text-align: center;
 
-}
 
-
 
-.list-header h1 {
 
-    font-size: 1.8em;
 
-    font-weight: normal;
 
-    margin: 10px 0;
 
-}
 
-
 
-.list {
 
-    display: flex;
 
-    padding: 15px;
 
-    flex-wrap: wrap;
 
-    justify-content: space-evenly;
 
-}
 
-
 
-.list-item-container {
 
-    display: flex;
 
-    flex-direction: column;
 
-    align-items: center;
 
-    padding: 3px;
 
-}
 
-
 
-.list-item-container > h4 {
 
-    font-family: "Roboto Condensed", "Roboto", "Segoe UI", sans-serif;
 
-    margin: 0;
 
-}
 
-
 
 #support-img {
 
     width: 440px;
 
 }
 
@@ -243,19 +186,6 @@ img.circle {
 
     background-size: cover;
 
 }
 
 
-img.square {
 
-    width: 65px;
 
-    height: 65px;
 
-    margin: 10px;
 
-    border-radius: 0%;
 
-    box-sizing: border-box;
 
-    background-size: cover;
 
-}
 
-
 
-img.rounded.square {
 
-    border-radius: 10px;
 
-}
 
-
 
 footer {
 
     position: relative;
 
     bottom: 0;
 
@@ -515,9 +445,4 @@ p.left-align {
 
     #support-img {
 
         min-width: 280px;
 
     }
 
-
 
-    img.square, img.circle {
 
-        width: 50px;
 
-        height: 50px;
 
-    }
 
 }