Replace Tailwind Play CDN with a prebuilt, purged stylesheet

The runtime CDN (cdn.tailwindcss.com) is not production-grade: FOUC, no purging, and an external request that is slow/blocked from some networks. - Add Tailwind v3 build (package.json `npm run build`) with two scoped configs: public (accent + zinc) -> wwwroot/css/tailwind.css, and admin (dark base/ electric/violet/emerald, separate to avoid the emerald flat-vs-scale clash) -> wwwroot/css/tailwind-admin.css. Both minified + content-purged. - Layouts now link the built CSS instead of the CDN script; built artifacts are committed so Docker/CI need no Node step. node_modules stays ignored. - Verified: utilities (incl. arbitrary values like aspect-[16/9], grid-cols- [8rem_1fr]) resolve; public + admin render; no console errors. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Fix SQLite advisory: bump SQLitePCLRaw to 3.0.x
2026-06-26 03:06:24 +03:30 · 2026-06-26 03:06:10 +03:30
10 changed files with 1105 additions and 25 deletions
@@ -8,15 +8,8 @@
    @@font-face { font-family:'Syne'; src:url('/fonts/Syne-Variable.woff2') format('woff2'); font-weight:100 900; font-display:swap; }
    @@font-face { font-family:'SpaceMono'; src:url('/fonts/SpaceMono-Regular.woff2') format('woff2'); font-display:swap; }
  </style>
-  <script src="https://cdn.tailwindcss.com"></script>
+  <!-- Tailwind: prebuilt + purged admin stylesheet (`npm run build`). No runtime CDN. -->
-  <script>
+  <link rel="stylesheet" href="/css/tailwind-admin.css" />
    tailwind.config = {
      theme: { extend: {
        colors: { base:{DEFAULT:'#020510',800:'#050a1a'}, electric:'#38bdf8', violet:'#818cf8', magenta:'#e879f9', emerald:'#34d399' },
        fontFamily: { sans:['Syne','system-ui','sans-serif'], mono:['SpaceMono','monospace'] }
      }}
    }
  </script>
  <link rel="stylesheet" href="/css/site.css" />
 </head>
 <body class="min-h-screen bg-base text-slate-200 antialiased">
@@ -25,22 +25,8 @@
    @@font-face { font-family:'Vazirmatn'; src:url('/fonts/Vazirmatn-Arabic.woff2') format('woff2'); font-display:swap; }
  </style>
-  <!-- Tailwind Play CDN - minimal config: one accent, neutral zinc scale is built in -->
+  <!-- Tailwind: prebuilt + purged stylesheet (`npm run build`). No runtime CDN. -->
-  <script src="https://cdn.tailwindcss.com"></script>
+  <link rel="stylesheet" href="/css/tailwind.css" />
  <script>
    tailwind.config = {
      theme: {
        extend: {
          colors: { accent: '#2563eb', accentink: '#1d4ed8' },
          fontFamily: {
            display: ['Syne', 'system-ui', 'sans-serif'],
            fa:      ['Vazirmatn', 'system-ui', 'sans-serif'],
          },
        }
      }
    }
  </script>
  <link rel="stylesheet" href="/css/site.css" />
  <link rel="icon" href="/logo-mark.svg" type="image/svg+xml" />
 </head>
@@ -13,6 +13,9 @@
      <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
      <PrivateAssets>all</PrivateAssets>
    </PackageReference>
    <!-- Override the transitive SQLitePCLRaw 2.1.11 (GHSA-2m69-gcr7-jv3q, no 2.x patch)
         with the 3.0.x line, which is outside the vulnerable range (<= 2.1.11). -->
    <PackageReference Include="SQLitePCLRaw.bundle_e_sqlite3" Version="3.0.3" />
  </ItemGroup>
 </Project>
@@ -0,0 +1,3 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@@ -0,0 +1,15 @@
 {
  "name": "soroushasadi-web",
  "private": true,
  "version": "1.0.0",
  "description": "Tailwind CSS build for the SoroushAsadi public + admin UI (replaces the runtime Play CDN).",
  "scripts": {
    "build:css": "tailwindcss -c tailwind.config.js -i ./Styles/tailwind.css -o ./wwwroot/css/tailwind.css --minify",
    "build:css:admin": "tailwindcss -c tailwind.admin.config.js -i ./Styles/tailwind.css -o ./wwwroot/css/tailwind-admin.css --minify",
    "build": "npm run build:css && npm run build:css:admin",
    "watch:css": "tailwindcss -c tailwind.config.js -i ./Styles/tailwind.css -o ./wwwroot/css/tailwind.css --watch"
  },
  "devDependencies": {
    "tailwindcss": "^3.4.17"
  }
 }
@@ -0,0 +1,26 @@
 /** @type {import('tailwindcss').Config} */
 // Admin (dark) theme. Separate build so its flat custom colors do not collide
 // with the public site's use of built-in color scales (e.g. emerald-600).
 module.exports = {
  content: [
    './Pages/Admin/**/*.cshtml',
    './Pages/Shared/_AdminLayout.cshtml',
  ],
  theme: {
    extend: {
      colors: {
        base: { DEFAULT: '#020510', 800: '#050a1a' },
        electric: '#38bdf8',
        violet: '#818cf8',
        magenta: '#e879f9',
        emerald: '#34d399',
      },
      fontFamily: {
        display: ['Syne', 'system-ui', 'sans-serif'],
        sans: ['Syne', 'system-ui', 'sans-serif'],
        mono: ['SpaceMono', 'monospace'],
      },
    },
  },
  plugins: [],
 };
@@ -0,0 +1,24 @@
 /** @type {import('tailwindcss').Config} */
 // Public site theme. Scoped away from the admin theme (which redefines
 // `emerald` as a flat color and would collide with the emerald-600 scale).
 module.exports = {
  content: [
    './Pages/*.cshtml',
    './Pages/Blog/**/*.cshtml',
    './Pages/Shared/_Layout.cshtml',
    './wwwroot/js/**/*.js',
  ],
  theme: {
    extend: {
      colors: {
        accent: '#2563eb',
        accentink: '#1d4ed8',
      },
      fontFamily: {
        display: ['Syne', 'system-ui', 'sans-serif'],
        fa: ['Vazirmatn', 'system-ui', 'sans-serif'],
      },
    },
  },
  plugins: [],
 };