# @timus-networks/fonts

Nuxt module for Theme Installation.

## Table of Contents

- [Installation](#installation)
- [Usage](#usage)
- [Scripts](#scripts)
- [Contributing](#contributing)
- [License](#license)

## Installation

To install this module, you can use npm or yarn:

### npm

```sh
npm install @timus-networks/theme
```

### yarn

```sh
yarn add @timus-networks/theme
```

## Usage

1. To use this module in your Nuxt 3 project, add it to your `nuxt.config.ts`:

```typescript
export default defineNuxtConfig({
  modules: ['@timus-networks/theme'],
});
```

2. Add below code to your **tailwind.config.js** file

```js
// tint & shade color generator
function generateColors(baseName, start = 1, end = 9, step = 1) {
  const colors = {};

  for (let i = start; i <= end; i += step) {
    colors[i] = `var(--el-color-${baseName}-light-${i})`;
  }

  return colors;
}

const colorNames = ['primary', 'secondary', 'neutral', 'danger', 'success', 'warning', 'info'];
const colorShades = [1, 2, 3, 4, 5, 6, 7, 8, 9];
const classPrefixes = ['bg', 'text', 'border'];
const colors = colorNames.reduce((acc, color) => ({ ...acc, [`${color}`]: generateColors(color, 1, 9) }), {});

module.exports = {
  // content: ['./pages/**/*.{vue,html}', './components/**/*.{vue,html}', './layouts/**/*.{vue,html}', './modules/**/*.{vue,html}'],
  content: ['./modules/**/*.{vue,html}'],
  theme: {
    extend: {
      colors,
      spacing: {
        default: '30px',
        7.5: '30px', // 30px için özel bir sınıf ekliyoruz
      },
    },
  },
  plugins: [
    function ({ addUtilities, theme, e }) {
      const gridCols = theme('gridTemplateColumns');
      const utilities = Object.entries(gridCols).map(([key, value]) => ({
        [`.${e(`grid-cols-${key}`)}`]: {
          'grid-template-columns': value,
          gap: '30px', // Burada varsayılan boşluğu ayarlıyoruz
        },
      }));

      addUtilities(utilities);
    },
  ],
  safelist: classPrefixes.flatMap((prefix) => colorNames.flatMap((color) => colorShades.map((i) => `${prefix}-${color}-${i}`))),
};
```

## Scripts

The following npm scripts are available:

- `test`: Run tests using Vitest.
- `test:watch`: Run tests in watch mode.
- `test:types`: Check TypeScript types.
- `lint:prettier`: Lint code using Prettier.
- `lint:eslint`: Lint code using ESLint.
- `lint:stylelint`: Lint styles using Stylelint.
- `fix`: Fix linting errors.
- `prepack`: Run the prepack script.
- `pub`: Publish the module.
- `release`: Release a new version.

## Contributing

If you would like to contribute, please follow these guidelines:

1. Fork the repository.
2. Create a new branch for your feature or bug fix.
3. Commit your changes.
4. Push your branch and create a pull request.

## License

This project is licensed under the MIT License.