Go to file
2024-07-15 15:57:41 +03:00
node_modules First Commit 2024-07-15 15:57:41 +03:00
src First Commit 2024-07-15 15:57:41 +03:00
package.json First Commit 2024-07-15 15:57:41 +03:00
README.md First Commit 2024-07-15 15:57:41 +03:00
tailwind.config.js First Commit 2024-07-15 15:57:41 +03:00
yarn.lock First Commit 2024-07-15 15:57:41 +03:00

Smatchit Tailwind Project with DaisyUI

Setup Instructions

  1. Create and Initialize Project:

    cd /your_workspace_path
    mkdir smatchit_tailwind_project
    cd smatchit_tailwind_project
    yarn init -y
    
  2. Install Tailwind CSS and DaisyUI:

    yarn add tailwindcss daisyui
    npx tailwindcss init
    
  3. Configure Tailwind CSS and DaisyUI: Edit tailwind.config.js:

    module.exports = {
      content: [
        "/smatchit/wwws/admin/*.html"
      ],
      theme: {
        extend: {},
      },
      plugins: [require('daisyui')],
    }
    
  4. Create Tailwind CSS File:

    mkdir -p /smatchit/wwws/admin/static/css
    echo "@tailwind base;
    @tailwind components;
    @tailwind utilities;
    @import 'daisyui';" > /smatchit/wwws/admin/static/css/smatchittailwind.css
    
  5. Build Tailwind CSS: Add script to package.json:

    {
      "scripts": {
        "build:css": "tailwindcss -i /smatchit/wwws/admin/static/css/smatchittailwind.css -o /smatchit/wwws/admin/static/css/smatchittailwind.css"
      }
    }
    

    Run the build script:

    yarn build:css
    

Usage

  • Link the generated CSS file in your HTML:
    <link href="static/css/smatchittailwind.css" rel="stylesheet">