basic working version

hellraiserrob · Jul 19, 2024 · c32f767 · c32f767
1 parent 786362f
commit c32f767
Show file tree

Hide file tree

Showing 21 changed files with 1,635 additions and 0 deletions.
diff --git a/.github/assets/banner.svg b/.github/assets/banner.svg
diff --git a/.github/assets/screenshot.jpg b/.github/assets/screenshot.jpg
diff --git a/.github/workflows/deployment.yml b/.github/workflows/deployment.yml
@@ -0,0 +1,51 @@
+# 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 the GITHUB_TOKEN permissions 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@v4
+      - name: Set up Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: 'npm'
+      - name: Install dependencies
+        run: npm ci
+      - name: Build
+        run: npm run build
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          # Upload dist folder
+          path: './dist'
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+dist
+node_modules
diff --git a/index.html b/index.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>slide-scroll</title>
+
+  <script type="module" src="/src/index.ts" defer></script>
+</head>
+
+<body>
+  <div id="app">
+    <div id="main">
+      <div class="header">
+        <img src="/images/logo.svg" alt="">
+        <h1 class="mb10">slide-scroll</h1>
+        <h2>A thing that slides as you scroll</h2>
+      </div>
+
+      <div class="slides" style="height: 500vh;">
+        <div class="slides__slide"><div class="slides__slide__number">1<div class="slides__slide__progress">0</div></div></div>
+        <div class="slides__slide"><div class="slides__slide__number">2<div class="slides__slide__progress">0</div></div></div>
+        <div class="slides__slide"><div class="slides__slide__number">3<div class="slides__slide__progress">0</div></div></div>
+        <div class="slides__slide"><div class="slides__slide__number">4<div class="slides__slide__progress">0</div></div></div>
+        <div class="slides__slide"><div class="slides__slide__number">5<div class="slides__slide__progress">0</div></div></div>
+      </div>
+
+      <footer>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestiae neque, exercitationem voluptate suscipit omnis esse voluptates tempora obcaecati, laborum at laboriosam perferendis. Facere corporis est reiciendis neque ratione maxime sequi.
+      </footer>
+    </div><!-- /main -->
+  </div><!-- /app -->
+</body>
+
+</html>