add stories page components

.github/workflows/codeql-analysis.yaml

@@ -0,0 +1,71 @@
+# For most projects, this workflow file will not need changing; you simply need
+# to commit it to your repository.
+#
+# You may wish to alter this file to override the set of languages analyzed,
+# or to provide custom queries or build logic.
+name: "CodeQL"
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    # The branches below must be a subset of the branches above
+    branches: [main]
+  schedule:
+    - cron: '0 19 * * 6'
+
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-latest
+
+    strategy:
+      fail-fast: false
+      matrix:
+        # Override automatic language detection by changing the below list
+        # Supported options are ['csharp', 'cpp', 'go', 'java', 'javascript', 'python']
+        language: ['javascript']
+        # Learn more...
+        # https://docs.github.com/en/github/finding-security-vulnerabilities-and-errors-in-your-code/configuring-code-scanning#overriding-automatic-language-detection
+
+    steps:
+    - name: Checkout repository
+      uses: actions/checkout@v2
+      with:
+        # We must fetch at least the immediate parents so that if this is
+        # a pull request then we can checkout the head.
+        fetch-depth: 2
+
+    # If this run was triggered by a pull request event, then checkout
+    # the head of the pull request instead of the merge commit.
+    - run: git checkout HEAD^2
+      if: ${{ github.event_name == 'pull_request' }}
+
+    # Initializes the CodeQL tools for scanning.
+    - name: Initialize CodeQL
+      uses: github/codeql-action/init@v1
+      with:
+        languages: ${{ matrix.language }}
+        # If you wish to specify custom queries, you can do so here or in a config file.
+        # By default, queries listed here will override any specified in a config file. 
+        # Prefix the list here with "+" to use these queries and those in the config file.
+        # queries: ./path/to/local/query, your-org/your-repo/queries@main
+
+    # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
+    # If this step fails, then you should remove it and run the build manually (see below)
+    - name: Autobuild
+      uses: github/codeql-action/autobuild@v1
+
+    # ℹ️ Command-line programs to run using the OS shell.
+    # 📚 https://git.io/JvXDl
+
+    # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
+    #    and modify them (or add more) to build your code if your project
+    #    uses a compiled language
+
+    #- run: |
+    #   make bootstrap
+    #   make release
+
+    - name: Perform CodeQL Analysis
+      uses: github/codeql-action/analyze@v1

site/assets/js/utils/scrollmove.js

@@ -1,21 +1,27 @@
 //import 'https://flackr.github.io/scroll-timeline/dist/scroll-timeline.js';
 
-  
+
 export default function() {
 
-  const progress = document.querySelector('.scrollmove');
+  if (window.innerWidth < 768) return;
+
+  const scrollEl = document.querySelector('.scrollmove');
+
+  if (!scrollEl) return;
 
-  if (!progress) return;
+    const container  = scrollEl.parentElement
 
-  progress.animate([
-    { transform: 'translateX(0%)' },
-    { transform: 'translateX(-300%)' }
-  ], {
-    timeline: new ScrollTimeline({
-      source: document.documentElement
-    })
+  // get element widths
+  const scrollElWidth = scrollEl.scrollWidth - container.clientWidth;
+
+  scrollEl.animate(
+   { transform: ['translateX(0%)','translateX(-' + scrollElWidth + 'px)'] }, {
+    timeline: new ViewTimeline({ subject: container }),
+    rangeStart: { rangeName: 'contain', offset: CSS.percent(10) },
+    rangeEnd: { rangeName: 'contain', offset: CSS.percent(80) },
+    fill: 'both',
   });
 
 
- 
-}
+
+}

site/assets/scss/common/_global.scss

@@ -420,23 +420,6 @@ a {
   }
 }
 
-.entry-content {
-  ol, ul, dl {
-    padding-left: 0;
-  }
-
-  li {
-    list-style: none;
-    line-height: 1.7;
-    padding-left: 1em;
-
-    &::before {
-      content: "– ";
-      margin-left: -1em;
-    }
-  }
-}
-
 .hyphens {
   hyphens: auto;
 }

site/assets/scss/components/_animations.scss

@@ -1,3 +1,4 @@
+/*
 @keyframes moveXProgress {
   0% {
     transform: translateX(0);
@@ -15,14 +16,15 @@
     animation-timing-function: ease-out;
   }
 }
+*/
 
 .overflow-x-hidden {
   /* Hide scrollbar for IE, Edge and Firefox */
   -ms-overflow-style: none;  /* IE and Edge */
   scrollbar-width: none;  /* Firefox */
- 
+
   /* Hide scrollbar for Chrome, Safari and Opera */
   &::-webkit-scrollbar {
     display: none;
   }
-}
+}