mirror of
https://github.com/eitchtee/WYGIWYH.git
synced 2026-04-25 10:08:36 +02:00
chore: update tailwind to v4
As is customary in the JS world EVERYTHING must break with each major version
This commit is contained in:
@@ -1,33 +1,33 @@
|
||||
<div class="tw-min-h-16">
|
||||
<div class="tw:min-h-16">
|
||||
<div
|
||||
id="fab-wrapper"
|
||||
class="tw-fixed tw-bottom-5 tw-right-5 tw-ml-auto tw-w-max tw-flex tw-flex-col tw-items-end mt-5">
|
||||
class="tw:fixed tw:bottom-5 tw:right-5 tw:ml-auto tw:w-max tw:flex tw:flex-col tw:items-end mt-5">
|
||||
<div
|
||||
id="menu"
|
||||
class="tw-flex tw-flex-col tw-items-end tw-space-y-6 tw-transition-all tw-duration-300 tw-ease-in-out tw-opacity-0 tw-invisible tw-hidden tw-mb-2">
|
||||
class="tw:flex tw:flex-col tw:items-end tw:space-y-6 tw:transition-all tw:duration-300 tw:ease-in-out tw:opacity-0 tw:invisible tw:hidden tw:mb-2">
|
||||
|
||||
{{ slot }}
|
||||
</div>
|
||||
|
||||
<button
|
||||
class="btn btn-primary rounded-circle p-0 tw-w-12 tw-h-12 tw-flex tw-items-center tw-justify-center tw-shadow-lg hover:tw-shadow-xl focus:tw-shadow-xl tw-transition-all tw-duration-300 tw-ease-in-out"
|
||||
class="btn btn-primary rounded-circle p-0 tw:w-12 tw:h-12 tw:flex tw:items-center tw:justify-center tw:shadow-lg tw:hover:shadow-xl tw:focus:shadow-xl tw:transition-all tw:duration-300 tw:ease-in-out"
|
||||
_="
|
||||
on click or focusout
|
||||
if #menu matches .tw-invisible and event.type === 'click'
|
||||
add .tw-rotate-45 to #fab-icon
|
||||
remove .tw-invisible from #menu
|
||||
remove .tw-hidden from #menu
|
||||
remove .tw-opacity-0 from #menu
|
||||
if #menu.classList.contains('tw:invisible') and event.type === 'click'
|
||||
add .{'tw:rotate-45'} to #fab-icon
|
||||
remove .{'tw:invisible'} from #menu
|
||||
remove .{'tw:hidden'} from #menu
|
||||
remove .{'tw:opacity-0'} from #menu
|
||||
else
|
||||
wait 0.2s
|
||||
remove .tw-rotate-45 from #fab-icon
|
||||
add .tw-invisible to #menu
|
||||
add .tw-hidden to #menu
|
||||
add .tw-opacity-0 to #menu
|
||||
remove .{'tw:rotate-45'} from #fab-icon
|
||||
add .{'tw:invisible'} to #menu
|
||||
add .{'tw:hidden'} to #menu
|
||||
add .{'tw:opacity-0'} to #menu
|
||||
end
|
||||
"
|
||||
>
|
||||
<i id="fab-icon" class="fa-solid fa-plus tw-text-3xl tw-transition-transform tw-duration-300 tw-ease-in-out"></i>
|
||||
<i id="fab-icon" class="fa-solid fa-plus tw:text-3xl tw:transition-transform tw:duration-300 tw:ease-in-out"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
{% load i18n %}
|
||||
<div class="tw-relative fab-item">
|
||||
<div class="tw:relative fab-item">
|
||||
<button class="btn btn-sm btn-{{ color }}"
|
||||
hx-get="{{ url }}"
|
||||
hx-trigger="{{ hx_trigger }}"
|
||||
|
||||
Reference in New Issue
Block a user