Added animate.css & changed sass libraries import

resources/js/app.js

@@ -1,8 +1,26 @@
-require('./bootstrap');
+import axios from "axios";
+
+axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
+
+export { axios };
 
 import UIkit from "uikit";
 import Icons from "uikit/dist/js/uikit-icons";
 
-window.UIkit = UIkit;
-
 UIkit.use(Icons);
+
+import Vue from "vue";
+
+import StreamEventComponent from "./components/auth/StreamEventComponent";
+import DiscordWebhookMessageComponent from "./components/auth/hookActions/DiscordWebhookMessageComponent";
+
+Vue.component("stream-event", StreamEventComponent);
+Vue.component("discord-webhook-message", DiscordWebhookMessageComponent);
+
+document.addEventListener("DOMContentLoaded", () => {
+
+    const app = new Vue({
+        el: "#content"
+    });
+
+});

resources/sass/_animate-css.scss

@@ -0,0 +1 @@
+@use "~animate.css/animate";

resources/sass/_uikit.scss

@@ -0,0 +1,15 @@
+// 1. Your custom variables and variable overwrites.
+// $global-link-color: #DA7D02;
+
+// 2. Import default variables and available mixins.
+@import "~uikit/src/scss/variables-theme";
+@import "~uikit/src/scss/mixins-theme";
+
+// 3. Your custom mixin overwrites.
+// @mixin hook-card() { color: #000; }
+
+// 4. Import UIkit.
+@import "~uikit/src/scss/uikit-theme";
+
+// uikit overrides, mainly fixes of colors due to dark theme
+@import "uikitOverrides";

resources/sass/app.scss

@@ -1,18 +1,7 @@
-// 1. Your custom variables and variable overwrites.
-// $global-link-color: #DA7D02;
+@import "./uikit";
 
-// 2. Import default variables and available mixins.
-@import "~uikit/src/scss/variables-theme.scss";
-@import "~uikit/src/scss/mixins-theme.scss";
-
-// 3. Your custom mixin overwrites.
-// @mixin hook-card() { color: #000; }
-
-// 4. Import UIkit.
-@import "~uikit/src/scss/uikit-theme.scss";
-
-// uikit overrides, mainly fixes of colors due to dark theme
-@import "uikitOverrides";
+// TODO import only the used animations
+@import "./animate-css";
 
 @import "./components/toggle";
 
@@ -25,3 +14,7 @@ $footer-height: 80px;
 footer {
     line-height: $footer-height;
 }
+
+.flex-grow {
+    flex-grow: 1;
+}