search

abhijithvijayan / react-minimal-side-navigation

Minimal side navigation component for React
https://codesandbox.io/s/react-minimal-side-navigation-example-y299d?file=/src/components/NavSidebar.jsx
MIT License
67 stars 28 forks source link

remove tailwindcss base styles #4

Closed Ali-Ozturk closed 3 years ago

Ali-Ozturk commented 3 years ago

I find it quite unfortunate that the component "forces" tailwindcss. I tend to use Bootstrap for my projects and I can't use this component because it destroys my default styles by loading tailwindcss. That is, if I want to use the css styles that this component is built upon.

Yes, I could just not import the .css file and create my own styles for the unique class names you have added. But I would still have all the static classnames that you have put on the items. e.g. 

...
className={`side-navigation-panel-select-inner-option hover:bg-gray-100 hover:text-gray-800 hover:border-pink-500 block px-16 py-2 text-sm text-gray-700 border-l-2 cursor-pointer ${
...

I think you should consider making it optional for the user to add his own css classes to the elements without the need for all the current css classes that are put onto them. I personally would not want my items to have unnecessary css classes that doesn't exist because I use another library.

abhijithvijayan commented 3 years ago

I will separate out a css file and add the corresponding css to the elements instead of using tailwind.

abhijithvijayan commented 3 years ago

But I will be busy for a couple of days. This will be released in v2.x.x

abhijithvijayan commented 3 years ago

Instead of removing tailwindcss, I am removing the base styles of tailwindcss and removing the classes from the html elements and moving it to the scss to use with @apply of postcss

abhijithvijayan commented 3 years ago

The base styles are removed(from v1.7.0) and hence it will not be conflicting with the styles.