estevanmaito / tailwindcss-multi-theme Goto Github PK

Hello. thanks for making an amazing tool. it seems that it is not compatible with twin.macro.
it would be great if you could add this feature.
thanks.

Hi here,
Any chance to upgrade to Tailwind 2 by any chance?

I keep getting the below error when compiling with npm:

npm ERR! peer dep missing: [email protected], required by [email protected]

My current version is [email protected]

version: "tailwindcss-multi-theme": "^1.0.3"
in my code this work:
focus:outline-none hover:text-gray-600 hover:bg-gray-300

But when i install Multi-Theme then stop work.
With Multi-theme:

Without:

Problem description:

Hi @estevanmaito first of all, thank you for this awesome plugin!

My question is how can I use the dark: especification with @aplly?

I`m not able to use with the following sintaxe

.toggle{
    @apply border-4 border-gray-300 dark:border-dark-gray-300;
}

I try scape using slashes, quotes etc, but not works...

Can you help me with this?

When installing latest version of Laravel and trying to implementing this fantastic theme I get the following error:

While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/tailwindcss
npm ERR! dev tailwindcss@"^3.1.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer tailwindcss@"^1.4.6" from [email protected]
npm ERR! node_modules/tailwindcss-multi-theme
npm ERR! tailwindcss-multi-theme@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

• tailwindcss-multi-theme version: 1.0.2
• Are you using other plugins? Which? Tailwind

Relevant code or config:

<!-- your code here -->

What you did:

Trying to install the theme after implementing latest version of Laravel.

What happened:

Reproduction:

Problem description:

I believe this package is abandoned and should be marked as such. No updates for two years, tailwind dependencies are very outdated. Projects that are using this package cannot update anymore. It would be great if the person that developed this package offered an alternative.

Hi there,

Thanks for building this.

Do you have any plans to upgrade this package to support Tailwindcss 2.x?

Attempted to npm update and got the follow error:

npm ERR! Could not resolve dependency:
npm ERR! peer tailwindcss@"^1.4.6" from [email protected]
npm ERR! node_modules/tailwindcss-multi-theme
npm ERR!   tailwindcss-multi-theme@"^1.0.4" from the root project

• tailwindcss-multi-theme version: 1.0.3
• tailwindcss version 1.8.4
• Are you using other plugins? Which? @tailwindcss/custom-forms

Relevant code or config:

{
    theme: {
        themeVariants: [ 'foo' ],
    },
    variants: {
        backgroundColor: [ 'responsive', 'hover', 'foo', 'foo:hover' ],
    }
}

What you did:

I added some theme variants as described in the docs and like shown above.

What happened:

The variants work as expected in dev builds without purgecss (really cool!).

Problem description:

The variants seem to get removed in prod builds when purgecss kicks in. They can't be found in the resulting optimized css at least.

Suggested solution:

Maybe this is caused by recent changes in tailwindcss when purgecss config was included? Is an adjusted regex required? Turning off the new purgeLayersByDefault setting doesn't help neither.

Thanks for this great plugin and for taking the time.

Is would be greate if there where an example for Vue.js

postcss.config.js

const tailwindcss = require('tailwindcss');
const purgecss = require('@fullhuman/postcss-purgecss');

if(process.env.RUN == 'production') {
  postCssPlugins = [
    tailwindcss('./tailwind.config.js'),
    require('autoprefixer'),
    purgecss({
      content: ['./pages/**/*.js']
    }),
  ]
}

@estevanmaito facing issue like above but if when i install after tailwind installation, If install before tailwind installation its show just warning.

npm ERR! While resolving: undefined@undefined
npm ERR! Found: [email protected]
npm ERR! node_modules/tailwindcss
npm ERR!   dev tailwindcss@"^3.0.13" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer tailwindcss@"^1.4.6" from [email protected]
npm ERR! node_modules/tailwindcss-multi-theme
npm ERR!   tailwindcss-multi-theme@"*" from the root project

Originally posted by @AnasSharif in #17 (comment)

Use https://github.com/tailwindcss/tailwindcss/blob/master/src/lib/substituteVariantsAtRules.js#L26 as reference for variants generation.

Earlier today I found that focus was not being correctly applied to placeholder pseudo elements. It was fixed in 0b5a4dd but it probably affects every other variants like hover, active etc.

It's not breaking anything, but may not produce the expected result (like any result at all).

Will take a look at it later today or at least tomorrow.

First, this is a great plugin, and a great project, thanks.

Is your feature request related to a problem? Please describe.
It's great to have everything in the html: <div class="dark:bg-blue-100"></div>.

Describe the solution you'd like
But what would be even better would be to have something that can be used in CSS like the @screen directive:

input {
	@apply bg-gray-300;
}

input:focus {
	@apply bg-white;
}

@theme dark {
	input {
		@apply bg-gray-800;
	}
	input:focus {
		@apply bg-gray-500;
	}
}

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.