- remove custom styles
- add new button styles based on Tailwind classes using @apply
- extend config to allow hover:ring-blue-200 and such
- update the js-files to use new classes
- Only unsure about the `.review-form .save-non-active`, this might need additional Tailwind helper classes in this specific situation. Don't know where it shows up, so could not test.
This fixes the styling but breaks the click action. Clicking on the text itself also triggers the action, clicking on the blank sapce next to it changes the label but does not trigger the action.
Generally speaking the style is easier to apply to an element that wraps the in put and the label-text. This could be the label-tag or a different wrapper.
- migrate featureinfobox to Tailwind
- migrate featureinfobox-content to Tailwind
- migrate fullscreenmessage-content to Tailwind so we can delete css/fullscreenmessagebox.css
The landscape-mode is somethign that Tailwind does not support AFAIK. Instead, I migrated the one css-definition that was left over but required to a tailwind-like class name `.landscape\:max-h-screen`. Note the escaped colon with is required so css supports colon based class names.
I need this to refactor the featureinfobox and sub-classes.
Ideally we could add this class via tailwind.config.js but for some reason it does not work; the class does not appear in the index.css file.
As a workaround I added it differently, but still we should probably figure out why the config file does not work as expeced.
This is what I meant with " Optionally add translation for the lang-switcher-label". I added it inline since I dont know how the translation system works, yet. Feel free to revert this change; the label is not too importat IMO.
Migrate most attributes to Tailwind classes. The box is a bit wider now, which is OK IMO. The z-index could be migrated to a custom Tailwind config-entry later. The transition has probably a Tailwind version as well (to be checked later…).
This changes the layout slighly. The image has a sharp edge to the right, which works very well IMO. We would also add custom tailwind border classes if needed.
This is only for the lg-Screen-size. It makes the content use more space and be more centered in the screen.
Wanted to use some Tailwind-Center-Class but didn't manage to. This works as well.
Style the list of themes with Tailwind. Add wrapper around the list of themes.
The non-linked list items are still TODO.
Also move the Streetcomplete-Note below the list and also the custom-build-Request-Line.
Changes the style and gives Class the ability to receive css-classes. There should also be a label-text given; something like "Change language" which is then hidden for `sr-only`.
