added wave footer

resources/views/segments/footer/WaveFooter/WaveFooter.blade.php

@@ -0,0 +1,48 @@
+<footer class='WaveFooter'
+        style="--speed: {{getSetting($data->area->name.'_'.$data->part.'_speed')}}s;
+        --speed2: {{getSetting($data->area->name.'_'.$data->part.'_speed2')}}s;
+        --speed3: {{getSetting($data->area->name.'_'.$data->part.'_speed3')}}s">
+    <svg
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:xlink="http://www.w3.org/1999/xlink"
+        viewBox="0 24 150 28"
+        preserveAspectRatio="none"
+    >
+        <defs>
+            <path
+                id="gentle-wave"
+                d="M-160 44c30 0
+        58-18 88-18s
+        58 18 88 18
+        58-18 88-18
+        58 18 88 18
+        v44h-352z"
+            />
+        </defs>
+        <g class="waves">
+            <use
+                xlink:href="#gentle-wave"
+                x="50"
+                y="0"
+                fill-opacity=".2"
+            />
+            <use
+                xlink:href="#gentle-wave"
+                x="50"
+                y="3"
+                fill-opacity=".5"
+            />
+            <use
+                xlink:href="#gentle-wave"
+                x="50"
+                y="6"
+                fill-opacity=".9"
+            />
+        </g>
+    </svg>
+    <div class="content">
+        <div class="{{gfx()['container']}}">
+            {{getSetting('copyright')}}
+        </div>
+    </div>
+</footer>

resources/views/segments/footer/WaveFooter/WaveFooter.json

@@ -0,0 +1,10 @@
+{
+    "name": "WaveFooter",
+    "version": "1.0",
+    "author": "xStack",
+    "email": "xshop@xstack.ir",
+    "license": "GPL-3.0-or-later",
+    "url": "https:\/\/xstack.ir",
+    "author_url": "https:\/\/4xmen.ir",
+    "packages": []
+}

resources/views/segments/footer/WaveFooter/WaveFooter.php

@@ -0,0 +1,51 @@
+<?php
+
+namespace Resources\Views\Segments;
+
+use App\Models\Part;
+use App\Models\Setting;
+
+class WaveFooter
+{
+    public static function onAdd(Part $part = null)
+    {
+
+        $setting = new Setting();
+        $setting->section = 'theme';
+        $setting->key = $part->area->name . '_' . $part->part.'_speed';
+        $setting->value = 2;
+        $setting->size = 4;
+        $setting->type = 'NUMBER';
+        $setting->data = json_encode(['xmin' => 2, 'xmax' => 90]);
+        $setting->title =  $part->area->name . ' ' . $part->part. ' speed wave 1';
+        $setting->save();
+        $setting = new Setting();
+        $setting->section = 'theme';
+        $setting->key = $part->area->name . '_' . $part->part.'_speed2';
+        $setting->value = 6;
+        $setting->size = 4;
+        $setting->type = 'NUMBER';
+        $setting->data = json_encode(['xmin' => 2, 'xmax' => 90]);
+        $setting->title =  $part->area->name . ' ' . $part->part. ' speed wave 2';
+        $setting->save();
+        $setting = new Setting();
+        $setting->section = 'theme';
+        $setting->key = $part->area->name . '_' . $part->part.'_speed3';
+        $setting->value = 4;
+        $setting->size = 4;
+        $setting->type = 'NUMBER';
+        $setting->data = json_encode(['xmin' => 2, 'xmax' => 90]);
+        $setting->title =  $part->area->name . ' ' . $part->part. ' speed wave 3';
+        $setting->save();
+    }
+    public static function onRemove(Part $part = null)
+    {
+        Setting::where('key',$part->area->name . '_' . $part->part.'_speed')->first()?->delete();
+        Setting::where('key',$part->area->name . '_' . $part->part.'_speed2')->first()?->delete();
+        Setting::where('key',$part->area->name . '_' . $part->part.'_speed3')->first()?->delete();
+    }
+    public static function onMount(Part $part = null)
+    {
+        return $part;
+    }
+}

resources/views/segments/footer/WaveFooter/WaveFooter.scss

@@ -0,0 +1,50 @@
+.WaveFooter {
+    margin-top: 3rem;
+    min-height: 300px;
+    position: relative;
+    .waves {
+        >use {
+            fill: var(--xshop-primary);
+            animation: move-forever  var(--speed) -2s linear infinite;
+            &:nth-child(2) {
+                animation-delay: -3s;
+                animation-duration: var(--speed2);
+            }
+            &:nth-child(3) {
+                animation-delay: -4s;
+                animation-duration: var(--speed3);
+            }
+        }
+    }
+    svg {
+        position: absolute;
+        left: 0;
+        bottom: 5rem;
+        width: 100%;
+        height: 30vw;
+        max-height: 200px;
+    }
+
+    .content{
+        padding: 1rem;
+        background: var(--xshop-primary);
+        opacity: .96;
+        color: var(--xshop-diff);
+        height: 5rem;
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        text-align: center;
+    }
+
+}
+
+@keyframes move-forever {
+    0% {
+        transform: translate(-90px, 0%);
+    }
+    100% {
+        transform: translate(85px, 0%);
+    }
+}