kenhyuwa / litepie-datepicker

Litepie Datepicker is a date range picker component for Vue.js and Tailwind CSS, dependent to day.js.
https://litepie.com
MIT License
373 stars 75 forks source link

Tailwind 3 support #53

Closed ahmedkandel closed 2 years ago

ahmedkandel commented 2 years ago

Hi,

Thanks for the great package,

It there a plan to support Tailwind 3 as i get this error while installing:

npm ERR! While resolving: undefined@undefined
npm ERR! Found: tailwindcss@3.0.7
npm ERR! node_modules/tailwindcss
npm ERR!   dev tailwindcss@"^3.0.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer tailwindcss@"^2.0.3" from litepie-datepicker@1.0.14
npm ERR! node_modules/litepie-datepicker
npm ERR!   litepie-datepicker@"*" from the root project

Thanks.

EmilMoe commented 2 years ago

Yep. Rather strange nothing added on this one.

syamsoul commented 2 years ago

looks like lately the author seems not so active...

EmilMoe commented 2 years ago

I went with this https://vue3datepicker.com

elreco commented 2 years ago

You can use it : https://www.npmjs.com/package/litepie-datepicker-tw3 if you don't want to wait for a @kenhyuwa update :)

CrisOspina commented 2 years ago

You can use it : https://www.npmjs.com/package/litepie-datepicker-tw3 if you don't want to wait for a @kenhyuwa update :)

Hi @elreco,

image

Not all CSS is working fine, is it working for you?

kawoki commented 2 years ago

@CrisOspina can you share your code, package.json, main.js and tailwind.config.js?

CrisOspina commented 2 years ago

@CrisOspina can you share your code, package.json, main.js and tailwind.config.js?

Hi @kawoki

Yes, code, package.json and tailwind.config

kawoki commented 2 years ago

@CrisOspina try editing your tailwind.config.js

content: [
    './index.html',
    './public/**/*.html',
    './src/**/*.{ts,vue}',
    path.resolve(__dirname, './node_modules/litepie-datepicker/**/*.js') // this line here should be litepie-datepicker-tw3
  ],
CrisOspina commented 2 years ago

@CrisOspina try editing your tailwind.config.js

content: [
    './index.html',
    './public/**/*.html',
    './src/**/*.{ts,vue}',
    path.resolve(__dirname, './node_modules/litepie-datepicker/**/*.js') // this line here should be litepie-datepicker-tw3
  ],

Thanks @kawoki

EmilMoe commented 2 years ago

I seem to be missing hover and focus/active styles, any of you experience this?

image

EmilMoe commented 2 years ago

I seem to be missing hover and focus/active styles, any of you experience this?

Nevermind: https://litepie.com/#configure-with-tailwind

lk77 commented 2 years ago

For me it does not seems to work

Screenshot from 2022-04-25 15-57-48

i don't like the idea to modify my tailwind config to make it works, i think you should provide a css file with everything you need, that the end user could include.

I don't have mt-1.5 for example but mt-1 and mt-2, and there is a lot of other classes that i don't have in my theme

brandonleichty commented 2 years ago

It’s a bummer the author created one of the most beautiful date pickers out there and then abandoned maintaining it almost immediately. 😭

lk77 commented 2 years ago

In the end i used @vuepic/vue-datepicker instead, as i could not make this one work with my custom tailwind theme