0.4.1 • Published 10 months ago

@bernankez/theme v0.4.1

Weekly downloads
-
License
MIT
Repository
github
Last release
10 months ago

theme

npm CI LICENSE

The default style of all my websites.

Click HERE to get a live preview.

Color variables can be found in HERE.

Install

pnpm i @bernankez/theme

Usage

Default usage

// main.ts
import "@bernankez/theme/css/none/index.css";

With UnoCSS

// uno.config.ts
import { presetNone } from "@bernankez/theme";
import { defineConfig, presetUno } from "unocss";

export default defineConfig({
  presets: [presetUno()],
  theme: {
    ...presetNone.unocss,
  },
});

Or with TailwindCSS

// tailwind.config.js
import { presetNone } from "@bernankez/theme";

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./src/**/*.{html,js}"],
  theme: {
    ...presetNone.tailwind,
  },
  plugins: [],
};
<div class="text-primary-foreground bg-primary">
  Hello world!
</div>
.usage-in-css {
  color: rgb(var(--primary-foreground));
  background-color: rgb(var(--primary));
}

Using with Shadcn

// main.ts
import "@bernankez/theme/css/shadcn/index.css";
// tailwind.config.js
import { presetShadcn } from "@bernankez/theme";

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./src/**/*.{html,js}"],
  theme: {
    ...presetShadcn.tailwind,
  },
  plugins: [],
};
<div class="text-primary-foreground bg-primary">
  Hello world!
</div>
.usage-in-css {
  color: hsl(var(--primary-foreground));
  background-color: hsl(var(--primary));
}
0.4.1

10 months ago

0.3.0

1 year ago

0.4.0

12 months ago

0.3.1

1 year ago

0.2.0

2 years ago

0.1.2

2 years ago

0.1.1

2 years ago

0.1.0

2 years ago