The following process will be used to apply theme in your site.

• Install Tailwind CSS: Begin by installing the latest version of Tailwind CSS in your Vue JS project. You can do this by referring to the official Vite guide for Vue JS at https://tailwindcss.com/docs/guides/vite#vue.

• Configuration File: Copy the tailwind.config.cjs file from the theme and add it to the root of your Vue JS project. This configuration file allows you to customize various aspects of the Tailwind CSS framework to match the theme.

• CSS Folder: Copy the css folder from public/assets/css of the theme and add it to your Vue JS project's public directory. This folder contains the necessary CSS files for the theme.

• Google Font Link: In the head tag of your Vue JS project's index.html file, include the link to the Google Font used in the theme:

  <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800&display=swap" rel="stylesheet" />

• CSS Import: In your Vue JS project's /src/main.ts file, import the theme's CSS file: import '@/assets/css/app.css';

• Development Mode: During development, run the following command in your Vue JS project's terminal to start the development server: npm run dev

• Production Build: When you're ready to build your Vue JS project for production, run the following command: npm run build

The following process will be used to apply theme in your site.

• Install Tailwind CSS: Begin by installing the latest version of Tailwind CSS in your Nuxt JS project. You can do this by referring to the official guide for Nuxt JS at https://tailwindcss.com/docs/guides/nuxtjs.

• Configuration File: Copy the tailwind.config.cjs file from the theme and add it to the root of your Nuxt JS project. This configuration file allows you to customize various aspects of the Tailwind CSS framework to match the theme.

• CSS Folder: Copy the css folder from assets/css of the theme and add it to your Nuxt JS project's root directory. This folder contains the necessary CSS files for the theme.

• Google Font Link: In the head tag of your Nuxt JS project's nuxt.config.ts file, include the link to the Google Font used in the theme:

  export default defineNuxtConfig({
      app: {
          head: {
              link: [
                  { rel: 'icon', type: 'image/x-icon', href: '/favicon.png' },
                  {
                      rel: 'stylesheet',
                      href: 'https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800&display=swap',
                  },
              ],
          },
      },
  });

• CSS Import: In your Nuxt JS project's nuxt.config.ts file, add the theme's CSS file:

  export default defineNuxtConfig({
      app: {
          css: ['~/assets/css/app.css'],
      },
  });

• Development Mode: During development, run the following command in your Nuxt JS project's terminal to start the development server: npm run dev

• Production Build: When you're ready to build your Nuxt JS project for production, run the following command: npm run build

The following process will be used to apply theme in your site.

• Install Tailwind CSS: Begin by installing the latest version of Tailwind CSS in your Vue JS project. You can do this by referring to the official Vite guide for Vue JS at https://tailwindcss.com/docs/guides/vite#vue.

• Configuration File: Copy the tailwind.config.cjs file from the theme and add it to the root of your Vue JS project. This configuration file allows you to customize various aspects of the Tailwind CSS framework to match the theme.

• CSS Folder: Copy the css folder from resources/js/src/assets/css of the theme and add it to your Vue JS project's public directory. This folder contains the necessary CSS files for the theme.

• Google Font Link: In the head tag of your Vue JS project's resources/views/app.blade.php file, include the link to the Google Font used in the theme:

  <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800&display=swap" rel="stylesheet" />

• CSS Import: In your Vue JS project's resources/js/src/main.ts file, import the theme's CSS file: import '@/assets/css/app.css';

• Development Mode: During development, run the following command in your Vue JS project's terminal to start the development server: npm run dev

• Production Build: When you're ready to build your Vue JS project for production, run the following command: npm run build