fix alpine-js stuffs blocked by csp

This commit is contained in:
2022-11-20 19:09:45 +00:00
parent ee357cae28
commit 9018fda102
7 changed files with 3250 additions and 56 deletions

View File

@@ -11,7 +11,7 @@
<div class="sm:flex sm:flex-row justify-center my-8">
<aside class="flex-none max-w-min sm:mr-8">
<div class="fixed sm:sticky top-0 sm:top-4 left-0 w-full h-full sm:h-auto bg-black sm:bg-transparent bg-opacity-70 flex sm:block items-center justify-center"
x-show="showModal || $screen('sm')"
x-show="getShowModal"
x-transition:enter="transition duration-300 ease-out"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
@@ -20,8 +20,8 @@
x-transition:leave-end="opacity-0"
>
<div class="max-w-sm sm:w-full mx-4 sm:mx-0 p-4 sm:p-0 bg-white dark:bg-gray-700 sm:bg-transparent rounded sm:rounded-none"
@click.outside="showModal = ! showModal"
x-show="showModal || $screen('sm')"
@click.outside="toggle"
x-show="getShowModal"
x-transition:enter="transition transform ease-out duration-300"
x-transition:enter-start="scale-110 opacity-0"
x-transition:enter-end="scale-100 opacity-100"
@@ -36,7 +36,7 @@
</span>
Kategorien
</h2>
<div class="ml-4 -mr-2 px-2 rounded text-xl text-gray-600 dark:text-gray-400 sm:hidden cursor-pointer" @click="showModal = false">
<div class="ml-4 -mr-2 px-2 rounded text-xl text-gray-600 dark:text-gray-400 sm:hidden cursor-pointer" @click="closeModal">
<i class="fa-solid fa-xmark"></i>
</div>
</div>
@@ -91,8 +91,8 @@
</div>
</div>
<button class="z-10 trigger fixed bottom-4 right-4 bg-proprietary-darker dark:bg-sky-500 text-blue-50 dark:text-sky-900 shadow-lg text-2xl rounded sm:hidden"
@click="showModal = true"
x-show="!showModal"
@click="openModal"
x-show="!getShowModal"
x-transition:enter="transition duration-100 ease-in"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"