Move to Tailwind, Accessibility improvements, added Dark Mode (#6)

* feat: migrate styles into Tailwind, use Radix Primitives for full a11y * chore: proxy bmcd-api-mock during development to match runtime more closely * feat: add dark mode classes, use neutral gray instead of zinc * chore: update deps to latest, bump version to v3.1.0 * chore: buttons to reflect all loading states * chore: improve margins inside tooltips * fix: progress bar to be visible on dark mode, cooling devices' target pct reactivity * cleanup: remove unused sass from deps * chore: improvements for mobile & iPad portrait/landscape, cleanup * chore: cleanup bundle size reporting for now
turing-machines · May 23, 2024 · 4a23871 · 4a23871
1 parent 6b56b3a
commit 4a23871
Show file tree

Hide file tree

Showing 86 changed files with 8,854 additions and 8,884 deletions.
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
@@ -2,20 +2,31 @@ module.exports = {
   root: true,
   env: { browser: true, es2020: true },
   extends: [
-    'eslint:recommended',
+    "eslint:recommended",
     "plugin:@typescript-eslint/recommended-type-checked",
     "plugin:@typescript-eslint/stylistic-type-checked",
-    'plugin:react-hooks/recommended',
+    "plugin:react-hooks/recommended",
+    "plugin:tailwindcss/recommended",
   ],
-  ignorePatterns: ['dist', '.eslintrc.cjs', 'vite.config.ts'],
-  parser: '@typescript-eslint/parser',
+  ignorePatterns: [
+    "dist",
+    ".eslintrc.cjs",
+    "vite.config.ts",
+    "tailwind.config.ts",
+  ],
+  parser: "@typescript-eslint/parser",
   parserOptions: {
     project: true,
   },
-  plugins: ['react-refresh', "@typescript-eslint", "simple-import-sort"],
+  plugins: [
+    "react-refresh",
+    "@typescript-eslint",
+    "simple-import-sort",
+    "tailwindcss",
+  ],
   rules: {
-    'react-refresh/only-export-components': [
-      'warn',
+    "react-refresh/only-export-components": [
+      "warn",
       { allowConstantExport: true },
     ],
     "@typescript-eslint/consistent-type-imports": [
@@ -29,4 +40,4 @@ module.exports = {
     "simple-import-sort/imports": "error",
     "simple-import-sort/exports": "error",
   },
-}
+};
diff --git a/.github/workflows/quality.yml b/.github/workflows/quality.yml
@@ -45,25 +45,6 @@ jobs:
       - name: Build
         run: npm run build
 
-      - name: Calculate /dist folder size in KB
-        run: echo "DIST_SIZE=$(du -sk dist | awk '{print $1 " KB"}')" >> $GITHUB_ENV
-
-      - name: Find Comment
-        uses: peter-evans/find-comment@v3
-        id: fc
-        with:
-          issue-number: ${{ github.event.pull_request.number }}
-          comment-author: 'github-actions[bot]'
-          body-includes: The current size
-
-      - name: Create or update comment
-        uses: peter-evans/create-or-update-comment@v4
-        with:
-          comment-id: ${{ steps.fc.outputs.comment-id }}
-          issue-number: ${{ github.event.pull_request.number }}
-          body: The current size of the `/dist` folder for this pull request is `${{ env.DIST_SIZE }}`.
-          edit-mode: replace
-
   test:
     name: Tests
     runs-on: ubuntu-latest

diff --git a/components.json b/components.json
@@ -0,0 +1,17 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "default",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "tailwind.config.ts",
+    "css": "src/globals.css",
+    "baseColor": "neutral",
+    "cssVariables": false,
+    "prefix": ""
+  },
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils"
+  }
+}
diff --git a/index.html b/index.html
@@ -1,17 +1,23 @@
 <!doctype html>
-<html lang="en-US" class="configure">
+<html lang="en-US">
   <head>
     <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 
-    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="description" content="Streamline your Turing Pi cluster management. Effortlessly control nodes, upgrade firmware, and flash images." />
 
-    <meta http-equiv="Expires" content="0">
-    <meta http-equiv="Pragma" content="no-cache">
-    <meta http-equiv="Cache-control" content="no-cache">
-    <meta http-equiv="Cache" content="no-cache">
+    <meta http-equiv="Expires" content="0" />
+    <meta http-equiv="Pragma" content="no-cache" />
+    <meta http-equiv="Cache-control" content="no-cache" />
+    <meta http-equiv="Cache" content="no-cache" />
 
-    <link rel="icon" href="/src/assets/logo.svg">
+    <link rel="icon" href="/src/assets/logo-light.svg" type="image/svg+xml" media="(prefers-color-scheme: light)" />
+    <link rel="icon" href="/src/assets/logo-dark.svg" type="image/svg+xml" media="(prefers-color-scheme: dark)" />
+    <meta name="msapplication-TileColor" content="#F7F7F7" media="(prefers-color-scheme: light)" />
+    <meta name="msapplication-TileColor" content="#111" media="(prefers-color-scheme: dark)" />
+    <meta name="theme-color" content="#F7F7F7" media="(prefers-color-scheme: light)" />
+    <meta name="theme-color" content="#111" media="(prefers-color-scheme: dark)" />
 
     <title>Turing Pi config</title>
   </head>