fix: remove conflicting css classes, improve controller

public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/controllers/scroll_top_controller.js

@@ -1,9 +1,10 @@
 import { Controller } from '@hotwired/stimulus'
-import { useDebounce} from 'stimulus-use'
+import { useDebounce } from 'stimulus-use'
 
 export default class extends Controller {
 
     static debounces = [ 'toggle' ]
+    static classes = [ 'hidden', 'visible' ]
 
     initialize() {
         useDebounce(this)
@@ -13,10 +14,13 @@ export default class extends Controller {
         window.addEventListener('scroll', () => {
             this.toggle()
         }, { passive: true })
+        this.toggle()
     }
 
     toggle() {
-        this.element.classList.toggle('hidden', window.scrollY < window.innerHeight / 3)
+        let isVisible = window.scrollY >= window.innerHeight / 3
+        this.element.classList.toggle(this.hiddenClass, false === isVisible)
+        this.element.classList.toggle(this.visibleClass, isVisible)
     }
 
     scroll() {

public/typo3conf/ext/ep_theme/Resources/Private/Partials/Footer.html

@@ -177,7 +177,9 @@
             aria-label="zum Seitenanfang scrollen"
             data-controller="scroll-top"
             data-action="scroll-top#scroll"
-            class="hidden fixed bottom-0 right-0 mb-16 md:mb-8 mr-4 md:mr-8 z-10 h-10 w-10 flex items-center justify-center rounded bg-ep-secondary/80 ser:bg-ser-secondary">
+            data-scroll-top-hidden-class="hidden"
+            data-scroll-top-visible-class="flex"
+            class="hidden fixed bottom-0 right-0 mb-16 md:mb-8 mr-4 md:mr-8 z-10 h-10 w-10 items-center justify-center rounded bg-ep-secondary/80 ser:bg-ser-secondary">
         {ep:icon(icon: 'chevron-up', class: 'w-8 h-8 text-white')}
     </button>