use delta wallpapers temporarily

Author: Donnnno

.github/workflows/static.yml

@@ -0,0 +1,42 @@
+# Simple workflow for deploying static content to GitHub Pages
+name: Deploy static content to Pages
+
+on:
+  # Runs on pushes targeting the default branch
+  push:
+    branches: ["master"]
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow one concurrent deployment
+concurrency:
+  group: "pages"
+  cancel-in-progress: true
+
+jobs:
+  # Single deploy job since we're just deploying
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+      - name: Setup Pages
+        uses: actions/configure-pages@v3
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v1
+        with:
+          # Upload entire repository
+          path: '.'
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v1

assets/script.js

@@ -0,0 +1,7 @@
+fetch('./config.json')
+    .then((response) => response.json())
+    .then((json) => {
+        for (entry of json) {
+            document.getElementById('grid').innerHTML += `<li><a target="_blank" href="${entry.url}" style="background-image: url('${entry.thumbUrl}');"></a><div class="details"><h3><a title="${entry.name}">${entry.name}</a></h3><p title="${entry.author}" class="image-author">${entry.author}</p></div></li>`
+        }
+    })

assets/style.css

@@ -0,0 +1,79 @@
+html {
+    margin: 100px;
+    font-family: 'HKGroteskRegular';
+}
+
+body {
+    background-color: #444444;
+}
+
+.image-list-small {
+    margin: 0 auto;
+    text-align: center;
+    max-width: 1200px;
+    padding: 0;
+  }
+  
+  .image-list-small li {
+    display: inline-block;
+    margin: 0 12px 30px;
+  }
+  
+  h1,h2,h3,h4{
+	text-transform: uppercase;
+	letter-spacing: 0.1em;
+	margin-right:-0.1em;
+	font-weight: normal;
+	color: #fff;
+	font-family: "NowAltBold";
+    text-align: center;
+    margin: 50px;
+    font-size: 4.2vw;
+    width: auto;
+}
+  
+  .image-list-small li > a {
+    display: block;
+    text-decoration: none;
+    background-size: cover;
+    background-repeat: no-repeat;
+    width: 250px;
+    height: 400px;
+    margin: 0;
+    padding: 0;
+    border-radius: 10px;
+  }
+  
+  li > a:hover {
+    opacity: 0.5;
+  }
+
+  .image-list-small .details {
+    margin-top: 13px;
+    width: 250px;
+  }
+  
+  
+  .image-list-small .details h3 {
+    display: block;
+    font-size: 14px;
+    margin: 0 0 3px 0;
+    white-space: pre;
+    word-wrap: break-word;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+  
+  .image-list-small .details h3 a {
+    color: white;
+    text-decoration: none;
+  }
+  
+  .image-list-small .details .image-author {
+    display: block;
+    color: #717171;
+    font-size: 14px;
+    font-weight: normal;
+    margin: 0;
+  }
+