fix: update docs build script

Author: ChrisUser

.github/workflows/storybook.yml

@@ -1,24 +1,26 @@
 name: Build and Deploy
 on:
-  push:
-    paths: ["src/**", ".storybook/**"] # Trigger the action only when files change in the folders defined here
+    push:
+        paths: ['src/**', '.storybook/**'] # Trigger the action only when files change in the folders defined here
 jobs:
-  build-and-deploy:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout 🛎️
-        uses: actions/checkout@v3
-        with:
-          persist-credentials: false
-      - name: Install and Build 🔧
-        run: | # Install npm packages and build the Storybook files
-          npm install --force
-          npm run build-storybook
-      - name: Deploy 🚀
-        uses: JamesIves/github-pages-deploy-action@v4
-        with:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          BRANCH: docs # The branch the action should deploy to.
-          FOLDER: docs-build # The folder that the build-storybook script generates files.
-          CLEAN: true # Automatically remove deleted files from the deploy branch
-          TARGET_FOLDER: docs # The folder that we serve our Storybook files from
+    build-and-deploy:
+        runs-on: ubuntu-latest
+        steps:
+            - name: Checkout 🛎️
+              uses: actions/checkout@v3
+              with:
+                  persist-credentials: false
+            - name: Install and Build 🔧
+              run: | # Install npm packages and build the Storybook files
+                  npm install --force
+                  npm run build-storybook
+            - name: Deploy 🚀
+              uses: JamesIves/github-pages-deploy-action@v4
+              with:
+                  GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+                  BRANCH: docs # The branch the action should deploy to.
+                  FOLDER: docs-build # The folder that the build-storybook script generates files.
+                  CLEAN: true # Automatically remove deleted files from the deploy branch
+                  clean-exclude: |
+                      .nojekyll
+                  TARGET_FOLDER: docs # The folder that we serve our Storybook files from

package.json

@@ -20,7 +20,7 @@
         "test": "react-scripts test",
         "prepublishOnly": "yarn build",
         "storybook": "storybook dev",
-        "build-storybook": "storybook build -c .storybook -o docs-build .out"
+        "build-storybook": "storybook build -c .storybook -o docs-build .out && touch ./docs-build/.nojekyll"
     },
     "release": {
         "branches": [

src/main.tsx

@@ -28,7 +28,7 @@ const App = () => {
     ]
 
     return (
-        <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', flexDirection: 'column', gap: 32, width: '100%', marginTop: 24 }}>
+        <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', flexDirection: 'column', gap: 32, width: '100%', marginTop: 32 }}>
             <div style={{ padding: '24px 0', width: '60%' }}>
                 <UsageBar showFallbackColors items={itemsToDisplay} total={100} />
             </div>

yarn.lock

@@ -1,15 +1,6 @@
 # THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
 # yarn lockfile v1
 
-"@aashutoshrathi/word-wrap@^1.2.3":
-  version "1.2.6"
-  resolved "https://registry.yarnpkg.com/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz#bd9154aec9983f77b3a034ecaa015c2e4201f6cf"
-  integrity sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==
-
-"@adobe/css-tools@^4.3.1":
-  version "4.3.2"
-  resolved "https://registry.yarnpkg.com/@adobe/css-tools/-/css-tools-4.3.2.tgz#a6abc715fb6884851fca9dad37fc34739a04fd11"
-  integrity sha512-DA5a1C0gD/pLOvhv33YMrbf2FK3oUzwNl9oOJqE4XVjuEtt6XIakRcsd7eLiOSPkp1kTRQGICTA8cKra/vFbjw==
 
 "@ampproject/remapping@^2.2.0":
   version "2.2.1"