diff --git a/CHANGELOG.md b/CHANGELOG.md index 2df78a8..f482621 100755 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,35 @@ # Changelog +## v0.0.6 + +[compare changes](https://github.com/selemondev/nuxt-ui-vue/compare/v0.0.5...v0.0.6) + +### 🚀 Enhancements + +- **app:** #110 remove image validation ([#110](https://github.com/selemondev/nuxt-ui-vue/issues/110)) + +### 🏡 Chore + +- **release:** V0.0.5 ([50d9dfd](https://github.com/selemondev/nuxt-ui-vue/commit/50d9dfd)) + +### ❤️ Contributors + +- System Administrator +- Selemondev + +## v0.0.5 + +[compare changes](https://github.com/selemondev/nuxt-ui-vue/compare/v0.0.5...v0.0.5) + +### 🚀 Enhancements + +- **app:** #110 remove image validation ([#110](https://github.com/selemondev/nuxt-ui-vue/issues/110)) + +### ❤️ Contributors + +- Selemondev + ## v0.0.4 [compare changes](https://github.com/selemondev/nuxtlabs-ui-vue/compare/v0.1.7...v0.0.4) diff --git a/package.json b/package.json index b1e0c6f..4cc2c2b 100755 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@nuxt-ui/vue-monorepo", - "version": "0.0.4", + "version": "0.0.6", "private": false, "scripts": { "build": "rimraf packages/*/{dist,es,lib} && nr -r -F \"./packages/nuxt-ui-vue\" build", @@ -44,4 +44,4 @@ "pnpm lint:fix" ] } -} +} \ No newline at end of file diff --git a/packages/nuxt-ui-vue/package.json b/packages/nuxt-ui-vue/package.json index 6ab48f2..7826cf6 100755 --- a/packages/nuxt-ui-vue/package.json +++ b/packages/nuxt-ui-vue/package.json @@ -1,6 +1,6 @@ { "name": "nuxt-ui-vue", - "version": "0.0.8", + "version": "0.0.9-beta.0", "private": false, "exports": { ".": { diff --git a/packages/nuxt-ui-vue/src/App.vue b/packages/nuxt-ui-vue/src/App.vue index e039c4f..0150d35 100755 --- a/packages/nuxt-ui-vue/src/App.vue +++ b/packages/nuxt-ui-vue/src/App.vue @@ -2,5 +2,7 @@ diff --git a/packages/nuxt-ui-vue/src/theme/nuxtLabsTheme.ts b/packages/nuxt-ui-vue/src/theme/nuxtLabsTheme.ts index 04b6d1e..f6cc485 100755 --- a/packages/nuxt-ui-vue/src/theme/nuxtLabsTheme.ts +++ b/packages/nuxt-ui-vue/src/theme/nuxtLabsTheme.ts @@ -196,13 +196,13 @@ export default { UButton: { base: { - root: 'focus:outline-none text-white dark:text-white block font-medium focus-visible:outline-0 rounded-md disabled:cursor-not-allowed disabled:opacity-75 flex-shrink-0 transition-all duration-200 ease-in', + root: 'focus:outline-none block font-medium focus-visible:outline-0 rounded-md disabled:cursor-not-allowed disabled:opacity-75 flex-shrink-0 transition-all duration-200 ease-in', font: 'font-medium', rounded: 'rounded-md', block: 'w-full flex justify-center items-center', normal: 'inline-flex items-center', buttonLoading: '!bg-opacity-50 opacity-50 pointer-events-none !cursor-not-allowed !hover:bg-opacity-50 inline-flex items-center', - buttonDisabled: '!shadow-none !cursor-not-allowed pointer-events-none opacity-50', + buttonDisabled: '!shadow-none !cursor-not-allowed pointer-events-none !bg-opacity-50 opacity-50', truncate: 'text-left break-all line-clamp-1', size: { '2xs': 'text-xs', @@ -238,8 +238,8 @@ export default { }, color: { white: { - solid: 'shadow-sm ring-1 ring-inset ring-gray-300 dark:ring-gray-700 text-gray-900 dark:text-white bg-white hover:enabled:bg-gray-50 disabled:bg-white dark:bg-gray-900 dark:hover:enabled:bg-gray-800/50 dark:disabled:bg-gray-900 focus-visible:ring-2 focus-visible:ring-green-500 dark:focus-visible:ring-green-400', - ghost: 'text-gray-900 dark:text-white hover:enabled:bg-white dark:hover:enabled:bg-gray-900 focus-visible:ring-inset focus-visible:ring-2 focus-visible:ring-green-500 dark:focus-visible:ring-green-400', + solid: 'shadow-sm ring-1 ring-inset ring-gray-300 dark:ring-gray-700 !text-gray-900 dark:text-white bg-white hover:enabled:bg-gray-50 disabled:bg-white dark:bg-gray-900 dark:hover:enabled:bg-gray-800/50 dark:disabled:bg-gray-900 focus-visible:ring-2 focus-visible:ring-green-500 dark:focus-visible:ring-green-400', + ghost: '!text-gray-900 dark:text-white hover:enabled:bg-white dark:hover:enabled:bg-gray-900 focus-visible:ring-inset focus-visible:ring-2 focus-visible:ring-green-500 dark:focus-visible:ring-green-400', }, gray: { solid: 'shadow-sm ring-1 ring-inset ring-gray-300 dark:ring-gray-700 text-gray-700 dark:text-gray-200 bg-gray-50 hover:enabled:bg-gray-100 disabled:bg-gray-50 dark:bg-gray-800 dark:hover:enabled:bg-gray-700/50 dark:disabled:bg-gray-800 focus-visible:ring-2 focus-visible:ring-green-500 dark:focus-visible:ring-green-400', @@ -281,11 +281,11 @@ export default { variants: { default: { intent: { - solid: 'shadow-sm text-white dark:text-gray-900 bg-{color}-500 hover:enabled:bg-{color}-600 disabled:bg-{color}-500 dark:bg-{color}-400 dark:hover:enabled:bg-{color}-500 dark:disabled:bg-{color}-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-{color}-500 dark:focus-visible:outline-{color}-400', - outline: 'ring-1 ring-inset ring-current text-{color}-500 dark:text-{color}-400 hover:enabled:bg-{color}-50 disabled:bg-transparent dark:hover:enabled:bg-{color}-950 dark:disabled:bg-transparent focus-visible:ring-2 focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400', - soft: 'text-{color}-500 dark:text-{color}-400 bg-{color}-50 hover:enabled:bg-{color}-100 disabled:bg-{color}-50 dark:bg-{color}-950 dark:hover:enabled:bg-{color}-900 dark:disabled:bg-{color}-950 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400', - ghost: 'text-{color}-500 dark:text-{color}-400 hover:enabled:bg-{color}-50 disabled:bg-transparent dark:hover:enabled:bg-{color}-950 dark:disabled:bg-transparent focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400', - link: 'text-{color}-500 hover:enabled:text-{color}-600 disabled:text-{color}-500 dark:text-{color}-400 dark:hover:enabled:text-{color}-500 dark:disabled:text-{color}-400 underline-offset-4 hover:enabled:underline focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400', + solid: 'shadow-sm text-white dark:text-gray-900 bg-{color}-500 hover:bg-{color}-600 disabled:bg-{color}-500 dark:bg-{color}-400 dark:hover:bg-{color}-500 dark:disabled:bg-{color}-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-{color}-500 dark:focus-visible:outline-{color}-400', + outline: 'ring-1 ring-inset ring-current text-{color}-500 dark:text-{color}-400 hover:bg-{color}-50 disabled:bg-transparent dark:hover:bg-{color}-950 dark:disabled:bg-transparent focus-visible:ring-2 focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400', + soft: 'text-{color}-500 dark:text-{color}-400 bg-{color}-50 hover:bg-{color}-100 disabled:bg-{color}-50 dark:bg-{color}-950 dark:hover:bg-{color}-900 dark:disabled:bg-{color}-950 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400', + ghost: 'text-{color}-500 dark:text-{color}-400 hover:bg-{color}-50 disabled:bg-transparent dark:hover:bg-{color}-950 dark:disabled:bg-transparent focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400', + link: 'text-{color}-500 hover:text-{color}-600 disabled:text-{color}-500 dark:text-{color}-400 dark:hover:text-{color}-500 dark:disabled:text-{color}-400 underline-offset-4 hover:underline focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400', }, }, }, diff --git a/packages/nuxt-ui-vue/tailwind.config.js b/packages/nuxt-ui-vue/tailwind.config.js index de17a6b..e3f2d71 100755 --- a/packages/nuxt-ui-vue/tailwind.config.js +++ b/packages/nuxt-ui-vue/tailwind.config.js @@ -1,13 +1,47 @@ +/* eslint-disable no-unused-expressions */ +import tailwindColors from './node_modules/tailwindcss/colors' + +const colorSafeList = [] + +const deprecated = ['lightBlue', 'warmGray', 'trueGray', 'coolGray', 'blueGray'] + +for (const colorName in tailwindColors) { + if (deprecated.includes(colorName)) + continue + + const shades = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900] + + const pallette = tailwindColors[colorName] + + if (typeof pallette === 'object') { + shades.forEach((shade) => { + if (shade in pallette) { + colorSafeList.push(`text-${colorName}-${shade}`), + colorSafeList.push(`accent-${colorName}-${shade}`), + colorSafeList.push(`bg-${colorName}-${shade}`), + colorSafeList.push(`hover:enabled:bg-${colorName}-${shade}`), + colorSafeList.push(`focus:bg-${colorName}-${shade}`), + colorSafeList.push(`ring-${colorName}-${shade}`), + colorSafeList.push(`focus:ring-${colorName}-${shade}`), + colorSafeList.push(`border-${colorName}-${shade}`) + } + }) + } +} /** @type {import('tailwindcss').Config} */ -export const content = ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'] -export const darkMode = 'class' -export const theme = { - extend: { - backgroundColor: ['disabled'], - textColor: ['disabled'], - fontFamily: { - Roboto: 'Roboto', +module.exports = { + content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'], + darkMode: 'class', + safelist: colorSafeList, + theme: { + extend: { + colors: tailwindColors, + backgroundColor: ['disabled'], + textColor: ['disabled'], + fontFamily: { + Roboto: 'Roboto', + }, }, }, + plugins: [require('@tailwindcss/forms')], } -export const plugins = [require('@tailwindcss/forms')]