diff --git a/apps/vue-storybook/.storybook/preview.ts b/apps/vue-storybook/.storybook/preview.ts index e7ca3f8a..16813933 100644 --- a/apps/vue-storybook/.storybook/preview.ts +++ b/apps/vue-storybook/.storybook/preview.ts @@ -68,11 +68,11 @@ const preview: Preview = { parameters: { controls: { - expanded: true - // matchers: { - // color: /(background|color)$/i, - // date: /Date$/ - // } + expanded: true, + matchers: { + color: /(background|color)$/i, + date: /Date$/ + } } }, diff --git a/apps/vue-storybook/tailwind.config.ts b/apps/vue-storybook/tailwind.config.ts index 72169d91..3678332f 100644 --- a/apps/vue-storybook/tailwind.config.ts +++ b/apps/vue-storybook/tailwind.config.ts @@ -7,8 +7,7 @@ // import explorer 1's tailwind config import explorer1Config from '@explorer-1/common/tailwind.config' -import plugin from 'tailwindcss/plugin' -console.log(explorer1Config) + export default { ...explorer1Config, content: ['stories/**/*', './node_modules/@explorer-1/vue/src/components/**/*.vue'] diff --git a/packages/common/package.json b/packages/common/package.json index d8308a34..553b94e9 100644 --- a/packages/common/package.json +++ b/packages/common/package.json @@ -10,7 +10,6 @@ "@tailwindcss/forms": "^0.5.7", "stylelint": "^16.5.0", "stylelint-config-standard-scss": "^13.1.0", - "tailwindcss": "^3.4.3", - "tailwindcss-themer": "^4.0.0" + "tailwindcss": "^3.4.3" } } diff --git a/packages/common/src/scss/components/_BaseButton.scss b/packages/common/src/scss/components/_BaseButton.scss index b755e415..7c09cb90 100644 --- a/packages/common/src/scss/components/_BaseButton.scss +++ b/packages/common/src/scss/components/_BaseButton.scss @@ -108,34 +108,4 @@ @apply text-white; } } - - // .ThemeVariantLight & { - // &.-primary { - // @apply text-white bg-theme-color to-theme-color-dark-w50; - // } - - // &.-secondary { - // @apply text-theme-color bg-transparent border-theme-color to-theme-color-dark-w50; - - // @include hover { - // // including a bg color resolves pixelation inconsistencies between browsers - // @apply text-white border-theme-color-dark bg-theme-color-dark; - // } - // } - // } - - // .ThemeVariantDark & { - // &.-primary { - // @apply text-white bg-theme-color-light to-theme-color-w50; - // } - - // &.-secondary { - // @apply text-theme-color-light bg-transparent border-theme-color-light to-theme-color-w50; - - // @include hover { - // // including a bg color resolves pixelation inconsistencies between browsers - // @apply text-white border-theme-color bg-theme-color; - // } - // } - // } } diff --git a/packages/common/src/scss/styles.scss b/packages/common/src/scss/styles.scss index 36e3762e..d92ddbc9 100644 --- a/packages/common/src/scss/styles.scss +++ b/packages/common/src/scss/styles.scss @@ -23,29 +23,3 @@ // components @import 'components'; - -// $jpl-sky-blue: 0 128 164; // 0080A4 -// $jpl-sky-blue-light: red; // #00a0cc -// $jpl-sky-blue-dark: 0 100 128; // #006480 -// $jpl-sky-blue-darker: 0 60 77; // #003c4d - -// // overrides for light and dark variants of the themes -// .ThemeVariantDark.ThemeInternal { -// --colors-theme-color: purple; -// --colors-theme-color-light: fuchsia; -// --colors-theme-color-dark: brown; -// --colors-theme-color-darker: orange; -// --gradientColorStops-theme-color-dark-w50: red; -// --gradientColorStops-theme-color-darker-w50: green; -// --gradientColorStops-theme-color-light-w50: blue; -// } - -// @layer base { -// :root { -// --colors-theme-color: @apply --colors-action-color; -// --colors-theme-color-light: foundationColors[ 'jpl-red-light'] --colors-theme-color-dark: foundationColors[ -// 'jpl-red-dark'] --gradientColorStops-theme-color-dark-w50: foundationColors[ 'jpl-red-dark'] --gradientColorStops-theme-color-darker-w50: -// foundationColors[ 'jpl-red-darker'] --gradientColorStops-theme-color-light-w50: -// foundationColors[ 'jpl-red-light']; -// } -// } diff --git a/packages/common/tailwind.config.ts b/packages/common/tailwind.config.ts index 9bb0f206..48b485cc 100644 --- a/packages/common/tailwind.config.ts +++ b/packages/common/tailwind.config.ts @@ -271,22 +271,22 @@ export default { require('@tailwindcss/forms'), plugin(({ addBase }) => { addBase({ - // www theme + // www theme selectors ':root, .ThemeVariantLight': ThemeWww.default, '.ThemeVariantDark': ThemeWww.dark, - // edu theme + // edu theme selectors '.ThemeEdu, .ThemeEdu.ThemeVariantLight, .ThemeEdu .ThemeVariantLight': ThemeEdu.default, '.ThemeEdu .ThemeVariantDark, .ThemeEdu.ThemeVariantDark': ThemeEdu.dark, - // internal theme + // internal theme selectors '.ThemeInternal, .ThemeInternal.ThemeVariantLight, .ThemeInternal .ThemeVariantLight': ThemeInternal.default, '.ThemeInternal .ThemeVariantDark, .ThemeInternal.ThemeVariantDark': ThemeInternal.dark }) }) ], - safelist: ['ThemeVariantDark', 'ThemeVariantLight', 'ThemeEdu', 'ThemeInternal'], future: { hoverOnlyWhenSupported: true }, + safelist: ['ThemeVariantLight', 'ThemeVariantDark'], content: [] } satisfies Config diff --git a/packages/vue/package.json b/packages/vue/package.json index b4cb08d9..9b32e971 100644 --- a/packages/vue/package.json +++ b/packages/vue/package.json @@ -18,7 +18,6 @@ "@tailwindcss/forms": "^0.5.7", "swiper": "^11.1.3", "tailwindcss": "^3.4.3", - "tailwindcss-themer": "^4.0.0", "vue": "^3.4.21" }, "devDependencies": { diff --git a/packages/vue/src/components/BaseButton/BaseButton.vue b/packages/vue/src/components/BaseButton/BaseButton.vue index 5e8b38dd..25f16c92 100644 --- a/packages/vue/src/components/BaseButton/BaseButton.vue +++ b/packages/vue/src/components/BaseButton/BaseButton.vue @@ -107,7 +107,6 @@ export default defineComponent({ -