In Github go to Settings > Developer settings > Personal Access tokens. Generate a new token with Repo permissions.

In the astro project repo, go to Settings > Secrets and add your new personal access token with the name API_TOKEN_GITHUB.

Set Github Pages to branch gh-pages

Change buildOptions.site to your Github Pages URL

in astro.config.mjs

export default {
buildOptions: {
  site: 'https://mulaidev.github.io/components',

Reference buildOptions.site with Astro.site

in /src/pages/index.astro (line 8)

---
const Css = Astro.site + "/global.css";
---

in /src/pages/index.astro (line 19)

<link rel="stylesheet" type="text/css" href={Css} />

Add scripts in package.json to generate TailwindCSS and reference it after build time

in package.json

"scripts": {
  "start": "astro dev",
  "build": "astro build",
  "css": "npx tailwindcss -o dist/global.css"
},

in .github/workflows/deploy.yml

- name: Build
      run: |
        npm run build
        touch ./dist/.nojekyll
        npm run css