fix alpine-js stuffs blocked by csp
This commit is contained in:
3196
fet2020/static/js/alpine-csp.js
Normal file
3196
fet2020/static/js/alpine-csp.js
Normal file
File diff suppressed because it is too large
Load Diff
@@ -40,3 +40,15 @@ function cookieSet(cname) {
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
var spy = new Gumshoe('#scrollspy-subNav a', {
|
||||
/***** Scrollspy *****/ // Active classes
|
||||
navClass: 'active', // applied to the nav list item
|
||||
});
|
||||
|
||||
/***** SmoothScroll *****/ // All animations will take exactly 500ms
|
||||
var scroll = new SmoothScroll('a[href*="#"]', {
|
||||
speed: 750,
|
||||
speedAsDuration: true,
|
||||
easing: 'easeInOutQuad'
|
||||
});
|
||||
|
||||
@@ -4,12 +4,12 @@
|
||||
{% load static %}
|
||||
|
||||
{% block body %}
|
||||
<body x-data="{ showModal: false }" :class="{ 'overflow-y-hidden sm:overflow-y-auto': showModal }">
|
||||
<body x-data="modal" x-ref="overflow">
|
||||
<!-- NAVBAR -->
|
||||
{% if not request.user.is_authenticated %}
|
||||
<nav class="navBar-md" x-data="{ showNavBar: false }">
|
||||
<nav class="navBar-md" x-data="myNavBar">
|
||||
{% else %}
|
||||
<nav class="navBar-lg" x-data="{ showNavBar: false }">
|
||||
<nav class="navBar-lg" x-data="myNavBar">
|
||||
{% endif %}
|
||||
<div>
|
||||
<a href="{% url 'home' %}">
|
||||
@@ -17,14 +17,14 @@
|
||||
<img src="{% static 'img/FET-Logo-2014_64_dark.svg' %}" alt="FET-Logo" class="navbar-logo p-2 hidden dark:block">
|
||||
</a>
|
||||
<button class="navbar-toggle"
|
||||
@click="showNavBar = ! showNavBar"
|
||||
@click="toggleShowNavBar"
|
||||
>
|
||||
<i class="fa-solid fa-bars"></i>
|
||||
</button>
|
||||
{% if not request.user.is_authenticated %}
|
||||
<ul id="navBarContent" class="navbar-content" x-show="showNavBar || $screen('md')" x-collapse.min.0px>
|
||||
<ul id="navBarContent" class="navbar-content" x-show="getShowNavBarMd" x-collapse.min.0px>
|
||||
{% else %}
|
||||
<ul id="navBarContent" class="navbar-content" x-show="showNavBar || $screen('lg')" x-collapse.min.0px>
|
||||
<ul id="navBarContent" class="navbar-content" x-show="getShowNavBarLg" x-collapse.min.0px>
|
||||
{% endif %}
|
||||
<li class="{% if 'posts' in request.path %}active{% endif %}"><a href="{% url 'posts:index' %}">News</a></li>
|
||||
<li class="{% if 'members' in request.path %}active{% endif %}"><a href="{% url 'members:members' 'active' %}">Fachschaft</a></li>
|
||||
@@ -41,12 +41,12 @@
|
||||
{% else %}
|
||||
<hr class="border-proprietary">
|
||||
<div href="#" class="navbar-subcontent"
|
||||
x-data="{ showPopupNav: false }"
|
||||
@click.outside="showPopupNav = false"
|
||||
x-data="PopupNav"
|
||||
@click.outside="closeShowPopupNav"
|
||||
>
|
||||
<div class="navbar-subcontentButton">
|
||||
<a class="rounded-l" href="#"
|
||||
@click="showPopupNav = !showPopupNav"
|
||||
@click="toggleShowPopupNav"
|
||||
>
|
||||
{% if request.user.first_name %}
|
||||
Hallo {{ request.user.first_name }}
|
||||
@@ -57,7 +57,7 @@
|
||||
<a class="rounded-r" href="{% url 'authentications:logout' %}?next={{ request.path }}"><i class="fa-solid fa-power-off"></i></a>
|
||||
</div>
|
||||
<div class="navbar-subcontentList"
|
||||
x-show="showPopupNav || !$screen('lg')"
|
||||
x-show="getShowPopupNavLg"
|
||||
x-transition:enter="transition ease-out duration-300"
|
||||
x-transition:enter-start="transform origin-top opacity-0 scale-95"
|
||||
x-transition:enter-end="transform origin-top opacity-100 scale-100"
|
||||
@@ -70,7 +70,7 @@
|
||||
<li class="navInternal"><a href="{% url 'intern:index' %}"><i class="fa-fw fa-solid fa-database mr-2"></i>Intern</a></li>
|
||||
<li class="navInternal"><a href="https://legacy.fet.at/home/intern"><i class="fa-fw fa-solid fa-box-archive mr-2"></i>Legacy</a></li>
|
||||
<li class="navInternal"
|
||||
x-show="!$screen('lg')"
|
||||
x-show="!getScreenLg"
|
||||
><a href="{% url 'authentications:logout' %}?next={{ request.path }}"><i class="fa-fw fa-solid fa-power-off mr-2"></i>Abmelden</a></li>
|
||||
</div>
|
||||
</div>
|
||||
@@ -109,35 +109,22 @@
|
||||
<hr class="legal-divider">
|
||||
<p class="copyright">© {% now 'Y' %} FET - Alle Rechte vorbehalten.</p>
|
||||
</footer>
|
||||
<div class="super-duper-awesome-signature" x-data="{ counter: 0 }">
|
||||
<span :class="counter>=4 && 'text-purple-300'">Handcrafted </span>
|
||||
<span :class="counter>=5 && 'text-green-400'">with </span>
|
||||
<i class="fa-solid fa-heart" aria-label="love" @click="counter++" :class="counter>=2 ? 'text-proprietary hover:text-proprietary-dark' : 'text-red-600 hover:text-red-700'"></i>
|
||||
<span :class="counter>=6 && 'text-pink-400'"> by</span>
|
||||
<span class="font-normal" :class="counter>=3 && 'text-yellow-500'"> FET</span>
|
||||
<div class="super-duper-awesome-signature" x-data="counter">
|
||||
<span x-ref="countFour">Handcrafted </span>
|
||||
<span x-ref="countFive">with </span>
|
||||
<i class="fa-solid fa-heart text-red-600 hover:text-red-700" aria-label="love" @click="increment" x-ref="countTwo"></i>
|
||||
<span x-ref="countSix"> by</span>
|
||||
<span class="font-normal" x-ref="countThree"> FET</span>
|
||||
</div>
|
||||
|
||||
<script src="{% static 'js/alpine-csp.js' %}"></script>
|
||||
|
||||
<script src="{% static 'js/gumshoe@5.1.1.js' %}"></script>
|
||||
<script src="{% static 'js/smooth-scroll@16.1.2.js' %}"></script>
|
||||
|
||||
<script defer src="{% static 'js/vendor.js' %}"></script>
|
||||
<script defer src="{% static 'js/scripts.js' %}"></script>
|
||||
<!-- Prism.js Code syntax highlighting -->
|
||||
<script src="{% static 'js/prism-core@1.25.0.js' %}"></script>
|
||||
<script src="{% static 'js/prism-autoloader@1.25.0.js' %}"></script>
|
||||
|
||||
<script>
|
||||
var spy = new Gumshoe('#scrollspy-subNav a', {
|
||||
/***** Scrollspy *****/ // Active classes
|
||||
navClass: 'active', // applied to the nav list item
|
||||
});
|
||||
|
||||
/***** SmoothScroll *****/ // All animations will take exactly 500ms
|
||||
var scroll = new SmoothScroll('a[href*="#"]', {
|
||||
speed: 750,
|
||||
speedAsDuration: true,
|
||||
easing: 'easeInOutQuad'
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
{% endblock %}
|
||||
|
||||
@@ -83,7 +83,7 @@
|
||||
</div>
|
||||
|
||||
<div id="infoBox" class="sticky bottom-4 mt-8 p-4 rounded-lg shadow-lg bg-gray-600 dark:bg-gray-800 text-gray-200 dark:text-gray-300 flex gap-x-4 items-center leading-none dark:border-2 dark:border-gray-700"
|
||||
x-data="{ consent: true }"
|
||||
x-data="infoBox"
|
||||
x-show="consent"
|
||||
x-transition:leave="transition ease-in-out duration-500"
|
||||
x-transition:leave-start="transform origin-bottom opacity-100 scale-100 translate-y-0"
|
||||
@@ -101,7 +101,7 @@
|
||||
<span class="hidden lg:inline text-sm text-gray-300 dark:text-gray-400">Du hast Fragen zum Studium oder möchtest dich einfach mich anderen Studierenden austauschen? </span><span class="text-sm text-gray-300 dark:text-gray-400">Klicke hier zum Beitreten <span class="hidden sm:inline"><i class="fa-solid fa-angle-right"></i></span></span>
|
||||
</a>
|
||||
<button id="infoBox-closeButton" class="flex-none self-stretch px-2 -mr-2" onclick="hideInfoBox('m', 1)"
|
||||
@click="consent = false"
|
||||
@click="closeBox"
|
||||
><i class="fa-solid fa-xmark text-gray-300 dark:text-gray-500"></i></button>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@@ -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"
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
<div class="sm:flex sm:flex-row-reverse justify-center">
|
||||
<aside class="sm:w-2/5 sm:max-w-xs sm:pl-4 lg:pl-8 my-8 sm:my-0">
|
||||
<div class="z-10 fixed sm:sticky top-0 sm:top-4 lg:top-8 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"
|
||||
@@ -18,8 +18,8 @@
|
||||
x-transition:leave-end="opacity-0"
|
||||
>
|
||||
<div class="max-w-sm sm:w-full mx-4 sm:mx-0 p-4 rounded bg-white dark:bg-gray-800 sm:shadow-lg sm:dark:border-2 sm:dark:border-gray-700"
|
||||
@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"
|
||||
@@ -34,11 +34,11 @@
|
||||
</span>
|
||||
Auswahl einschränken
|
||||
</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>
|
||||
<form action="" method="POST" class="grid grid-cols-1 gap-2 sm:gap-4" x-data="{ selectedYear: '{{ formset.year.value }}' }">
|
||||
<form action="" method="POST" class="grid grid-cols-1 gap-2 sm:gap-4">
|
||||
{% csrf_token %}
|
||||
|
||||
{% for message in messages %}
|
||||
@@ -52,7 +52,6 @@
|
||||
<label class="block">
|
||||
<span class="text-gray-700 dark:text-gray-200">Jahr</span>
|
||||
<select class="block w-full mt-1 rounded-md border-gray-300 dark:border-none shadow-sm focus:border-none focus:ring focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"
|
||||
x-model="selectedYear"
|
||||
id="id_year"
|
||||
name="year"
|
||||
>
|
||||
@@ -62,8 +61,8 @@
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<label
|
||||
x-show="selectedYear != ''"
|
||||
<label
|
||||
x-show="!getSelectedYear"
|
||||
x-transition:enter="transition ease-out duration-300"
|
||||
x-transition:enter-start="opacity-0"
|
||||
x-transition:enter-end="opacity-100"
|
||||
@@ -97,8 +96,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<button id="modal-trigger-1" 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"
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
<div class="sm:flex sm:flex-row-reverse justify-center">
|
||||
<aside class="sm:w-2/5 sm:max-w-xs sm:pl-4 lg:pl-8 my-8 sm:my-0">
|
||||
<div class="z-10 fixed sm:sticky top-0 sm:top-4 lg:top-8 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"
|
||||
@@ -18,8 +18,8 @@
|
||||
x-transition:leave-end="opacity-0"
|
||||
>
|
||||
<div class="max-w-sm sm:w-full mx-4 sm:mx-0 p-4 rounded bg-white dark:bg-gray-800 sm:shadow-lg sm:dark:border-2 sm:dark:border-gray-700"
|
||||
@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"
|
||||
@@ -34,7 +34,7 @@
|
||||
</span>
|
||||
Auswahl einschränken
|
||||
</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>
|
||||
@@ -69,8 +69,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<button id="modal-trigger-1" 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"
|
||||
|
||||
Reference in New Issue
Block a user