Поправил анимацию градиента на главной

2024-04-18 13:40:40 +08:00 · 2024-04-18 13:40:40 +08:00 · 3eb8911bf8
parent 38eef7ef01
commit 3eb8911bf8
4 changed files with 71 additions and 0 deletions
--- a/resources/friday.js
+++ b/resources/friday.js
@ -0,0 +1,18 @@
+import './js/bootstrap';
+import { createApp } from 'vue'
+import { createPinia } from 'pinia'
+import App from './views/Welcome.vue'
+import { createVuetify } from 'vuetify'
+import 'vuetify/styles'
+import * as components from 'vuetify/components'
+import * as directives from 'vuetify/directives'
+import '@mdi/font/css/materialdesignicons.css'
+
+const pinia = createPinia();
+
+const vuetify = createVuetify({
+    components,
+    directives
+});
+
+createApp(App).use(vuetify).use(pinia).mount("#app");
--- a/resources/views/Welcome.vue
+++ b/resources/views/Welcome.vue
@ -24,4 +24,17 @@ export default {
    height: 100vh;
 }

+@keyframes gradient {
+    0% {
+        background-position: 0 50%;
+    }
+    50% {
+        background-position: 100% 50%;
+    }
+    100% {
+        background-position: 0 50%;
+    }
+}
+
+
 </style>
--- a/resources/views/friday/Friday.vue
+++ b/resources/views/friday/Friday.vue
@ -0,0 +1,27 @@
+<template>
+    <v-app>
+        <v-sheet class="bg-gradient h-100 w-100 d-flex justify-center">
+            <Schedule/>
+        </v-sheet>
+    </v-app>
+</template>
+
+<script>
+import Schedule from "./Schedule.vue";
+
+export default {
+    name: "Welcome",
+    components: {Schedule}
+}
+</script>
+
+<style scoped>
+
+.bg-gradient {
+    background: linear-gradient(-45deg, #f103b0, #f0a068, #4fdbfeff);
+    background-size: 200% 200%;
+    animation: gradient 15s ease infinite;
+    height: 100vh;
+}
+
+</style>
--- a/resources/views/friday/friday.blade.php
+++ b/resources/views/friday/friday.blade.php
@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Информация о трансляциях</title>
+    @vite('resources/welcome.js')
+    @vite('resources/css/app.css')
+</head>
+<body class="antialiased">
+<div id="app"></div>
+</body>
+</html>