diff --git a/packages/common/src/scss/_typography.scss b/packages/common/src/scss/_typography.scss index 877dc44c..e464e878 100644 --- a/packages/common/src/scss/_typography.scss +++ b/packages/common/src/scss/_typography.scss @@ -188,13 +188,15 @@ } } - .text-subtitle { - @apply font-secondary uppercase text-base leading-tight tracking-wider; - } - - .text-subtitle-sm { - @apply font-secondary uppercase text-sm leading-tight tracking-wider; - } + // moved to a tailwind plugin in tailwind.config.js which allows us to @apply text-subtitle + // .text-subtitle { + // @apply font-secondary uppercase text-base leading-tight tracking-wider; + // } + + // moved to a tailwind plugin in tailwind.config.js which allows us to @apply text-subtitle + // .text-subtitle-sm { + // @apply font-secondary uppercase text-sm leading-tight tracking-wider; + // } .text-body-lg { font-size: pxToRem(18); // Based on Tailwind's text-lg diff --git a/packages/common/src/scss/components/_BlockTable.scss b/packages/common/src/scss/components/_BlockTable.scss index aa0f09b4..303da010 100644 --- a/packages/common/src/scss/components/_BlockTable.scss +++ b/packages/common/src/scss/components/_BlockTable.scss @@ -1,3 +1,6 @@ +// needed to @extend .BlockText +@import '@explorer-1/common/src/scss/components/BlockText'; + .BlockTable { table { @apply border-gray-light-mid border-t border-b border-collapse w-full; @@ -8,7 +11,7 @@ } th { - @apply p-3 lg:p-5 border-gray-light-mid border-b text-subtitle text-white text-left font-normal; + @apply p-3 lg:p-5 border-gray-light-mid border-b font-secondary uppercase text-base leading-tight tracking-wider text-white text-left font-normal; } tbody { diff --git a/packages/common/tailwind.config.ts b/packages/common/tailwind.config.ts index 81217979..439787a1 100644 --- a/packages/common/tailwind.config.ts +++ b/packages/common/tailwind.config.ts @@ -283,6 +283,13 @@ export default { require('@tailwindcss/forms'), plugin(({ addBase }) => { addBase({ + // reusable typography classes TODO: write a more robust way to include most typography classes + '.text-subtitle': { + '@apply font-secondary uppercase text-base leading-tight tracking-wider': {} + }, + '.text-subtitle-sm': { + '@apply font-secondary uppercase text-sm leading-tight tracking-wider': {} + }, // www theme selectors ':root, .ThemeVariantLight': ThemeWww.default, '.ThemeVariantDark': ThemeWww.dark, diff --git a/packages/vue/src/components/BlockTable/BlockTable.vue b/packages/vue/src/components/BlockTable/BlockTable.vue index 45b8f251..d61a698e 100644 --- a/packages/vue/src/components/BlockTable/BlockTable.vue +++ b/packages/vue/src/components/BlockTable/BlockTable.vue @@ -65,9 +65,5 @@ export default defineComponent({