mirfalah-tech
/
digital-card
Sledovat 12
Oblíbit 0
Rozštěpit 0

12 Revize
61f4562464 ... a72c1b4aeb

Autor SHA1 Zpráva Datum
  farhan a72c1b4aeb shadow front cover před 4 měsíci
  farhan a133ea1216 flower position před 4 měsíci
  farhan e63b8073f4 insert flower to front page před 4 měsíci
  farhan 703757be6c hide all focus před 4 měsíci
  farhan 41901bccfe e-money ui fix před 4 měsíci
  farhan f83a243250 fix calendar před 4 měsíci
  farhan 3c7a756a95 remove dark mode for calendar před 4 měsíci
  farhan fa97073c97 reset form před 4 měsíci
  farhan 246ffea426 clear code for success message před 4 měsíci
  farhan 16fb3c7284 change success message to info color před 4 měsíci
  farhan 464ab57bba avoid auto zoom před 4 měsíci
  farhan 9782552d21 success message for action forms před 4 měsíci
11 změnil soubory, kde provedl 88 přidání a 128 odebrání
Rozdělené zobrazení Ukázat statistiku rozdílových dat
  1. 3
    6
      app/Http/Controllers/MainController.php
  2. binární
      public/assets/qr-bank.jpeg
  3. 5
    0
      resources/css/app.css
  4. 4
    2
      resources/views/components/front-cover.blade.php
  5. 4
    2
      resources/views/digital-card.blade.php
  6. 39
    39
      resources/views/modals/calendar-modal.blade.php
  7. 7
    11
      resources/views/modals/emoney-modal.blade.php
  8. 8
    23
      resources/views/modals/guestbook-modal.blade.php
  9. 7
    20
      resources/views/modals/rsvp-modal.blade.php
  10. 10
    21
      resources/views/rsvp-digital-card.blade.php
  11. 1
    4
      routes/web.php

+ 3
- 6
app/Http/Controllers/MainController.php Zobrazit soubor 

@@ -19,6 +19,7 @@ class MainController extends Controller
19 19 
             return view('rsvp-digital-card');
20 20 
         } else {
21 21 
             return view('digital-card', compact(['rsvp', 'guestbook']));
22 
+            // return view('rsvp-digital-card');
22 23 
         }
23 24 
     }
24 25 
 
@@ -31,7 +32,7 @@ class MainController extends Controller
31 32
32 33 
         session()->flash('success', 'Terima kasih kerana sudi menghadirkan diri!');
33 34
34 
-        return response()->json(['message' => 'RSVP form submitted successfully']);
35 
+        return response()->json(['message' => 'Terima kasih kerana sudi menghadirkan diri!']);
35 36 
     }
36 37
37 38 
     public function saveSpeech(Request $request) {
 
@@ -42,10 +43,6 @@ class MainController extends Controller
42 43
43 44 
         session()->flash('success', 'Terima kasih atas ucapan anda!');
44 45
45 
-        return response()->json(['message' => 'Speech form submitted successfully']);
46 
-    }
47 
-
48 
-    public function rsvpmain() {
49 
-        return view('rsvp-digital-card');
46 
+        return response()->json(['message' => 'Terima kasih atas ucapan anda!']);
50 47 
     }
51 48 
 }

binární
public/assets/qr-bank.jpeg Zobrazit soubor


+ 5
- 0
resources/css/app.css Zobrazit soubor 

@@ -26,4 +26,9 @@
26 26 
     .dark\:text-white {
27 27 
         color: #000000 !important;
28 28 
     }
29 
+}
30 
+
31 
+/* Remove outline on focus for all elements */
32 
+*:focus {
33 
+    outline: none;
29 34 
 }

+ 4
- 2
resources/views/components/front-cover.blade.php Zobrazit soubor 

@@ -1,4 +1,4 @@
1 
-<div class="part left fixed left-0 w-1/2 h-screen bg-babyblue shadow-xl">
1 
+<div class="part left fixed left-0 w-1/2 h-screen bg-babyblue shadow-lg">
2 2 
     <div class="flex flex-col justify-center h-full gap-10">
3 3 
         <div class="flex justify-end items-center">
4 4 
             <img src="{{ asset('assets/logo-left.png') }}" alt="Logo" class="logo-img">
 
@@ -6,9 +6,10 @@
6 6 
         <div class="flex justify-end items-center">
7 7 
             <img src="{{ asset('assets/name-left.png') }}" alt="Name Left" class="logo-img">
8 8 
         </div>
9 
+        <img src="{{asset('assets/flower-left.png')}}" alt="" class="absolute -left-2/4 top-72 h-96 w-96">
9 10 
     </div>
10 11 
 </div>
11 
-<div class="part right fixed right-0 w-1/2 h-screen bg-babyblue shadow-xl">
12 
+<div class="part right fixed right-0 w-1/2 h-screen bg-babyblue shadow-lg">
12 13 
     <div class="flex flex-col justify-center h-full gap-10">
13 14 
         <div class="flex justify-start items-center">
14 15 
             <img src="{{ asset('assets/logo-right.png') }}" alt="Logo" class="logo-img">
 
@@ -16,5 +17,6 @@
16 17 
         <div class="flex justify-start items-center">
17 18 
             <img src="{{ asset('assets/name-right.png') }}" alt="Name Right" class="logo-img">
18 19 
         </div>
20 
+        <img src="{{asset('assets/flower-right.png')}}" alt="" class="absolute -right-2/4 top-32 h-96 w-96">
19 21 
     </div>
20 22 
 </div>

+ 4
- 2
resources/views/digital-card.blade.php Zobrazit soubor 

@@ -2,7 +2,7 @@
2 2 
 <html lang="{{ str_replace('_', '-', app()->getLocale()) }}" data-theme="light">
3 3 
     <head>
4 4 
         <meta charset="utf-8">
5 
-        <meta name="viewport" content="width=device-width, initial-scale=1">
5 
+        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
6 6 
         <meta name="color-scheme" content="light only">
7 7
8 8 
         <title>{{config('app.name')}}</title>
 
@@ -46,6 +46,9 @@
46 46 
         </style>
47 47 
     </head>
48 48 
     <body class="antialiased font-serif no-scroll">
49 
+        <div role="alert" class="alert alert-info hidden z-40 fixed w-1/2 top-3 right-3">
50 
+            <span></span>
51 
+        </div>
49 52 
         <div class="petal-overlay" id="petalOverlay">
50 53 
             <img src="{{ asset('assets/petal.gif') }}" alt="Falling Petals">
51 54 
         </div>
 
@@ -141,7 +144,6 @@
141 144 
                 });
142 145 
             });
143 146 
         </script>
144 
-        <div id="alert-success"></div>
145 147 
         <div class="parent absolute h-screen w-full">
146 148 
             {{-- <audio src="{{asset('assets/paper-ripping.mp3')}}"></audio> --}}
147 149 
             @include('components.front-cover')

+ 39
- 39
resources/views/modals/calendar-modal.blade.php Zobrazit soubor 

@@ -3,9 +3,9 @@
3 3 
       <h3 class="text-lg font-bold">Kalendar</h3>
4 4 
       <div class="flex items-center justify-center py-8 px-4">
5 5 
           <div class="max-w-sm w-full shadow-lg">
6 
-              <div class="md:p-8 p-5 dark:bg-gray-800 bg-babyblue rounded-t">
6 
+              <div class="md:p-8 p-5 bg-babyblue rounded-t">
7 7 
                   <div class="flex items-center justify-center">
8 
-                      <span  tabindex="0" class="focus:outline-none  text-base font-bold dark:text-gray-100 text-gray-800">August 2024</span>
8 
+                      <span  tabindex="0" class="focus:outline-none  text-base font-bold text-gray-800">August 2024</span>
9 9 
                   </div>
10 10 
                   <div class="flex items-center justify-between pt-12 overflow-x-auto">
11 11 
                       <table class="w-full">
 
@@ -13,37 +13,37 @@
13 13 
                               <tr>
14 14 
                                   <th>
15 15 
                                       <div class="w-full flex justify-center">
16 
-                                          <p class="text-base font-medium text-center text-gray-800 dark:text-gray-100">Mo</p>
16 
+                                          <p class="text-base font-medium text-center text-gray-800">Mo</p>
17 17 
                                       </div>
18 18 
                                   </th>
19 19 
                                   <th>
20 20 
                                       <div class="w-full flex justify-center">
21 
-                                          <p class="text-base font-medium text-center text-gray-800 dark:text-gray-100">Tu</p>
21 
+                                          <p class="text-base font-medium text-center text-gray-800">Tu</p>
22 22 
                                       </div>
23 23 
                                   </th>
24 24 
                                   <th>
25 25 
                                       <div class="w-full flex justify-center">
26 
-                                          <p class="text-base font-medium text-center text-gray-800 dark:text-gray-100">We</p>
26 
+                                          <p class="text-base font-medium text-center text-gray-800">We</p>
27 27 
                                       </div>
28 28 
                                   </th>
29 29 
                                   <th>
30 30 
                                       <div class="w-full flex justify-center">
31 
-                                          <p class="text-base font-medium text-center text-gray-800 dark:text-gray-100">Th</p>
31 
+                                          <p class="text-base font-medium text-center text-gray-800">Th</p>
32 32 
                                       </div>
33 33 
                                   </th>
34 34 
                                   <th>
35 35 
                                       <div class="w-full flex justify-center">
36 
-                                          <p class="text-base font-medium text-center text-gray-800 dark:text-gray-100">Fr</p>
36 
+                                          <p class="text-base font-medium text-center text-gray-800">Fr</p>
37 37 
                                       </div>
38 38 
                                   </th>
39 39 
                                   <th>
40 40 
                                       <div class="w-full flex justify-center">
41 
-                                          <p class="text-base font-medium text-center text-gray-800 dark:text-gray-100">Sa</p>
41 
+                                          <p class="text-base font-medium text-center text-gray-800">Sa</p>
42 42 
                                       </div>
43 43 
                                   </th>
44 44 
                                   <th>
45 45 
                                       <div class="w-full flex justify-center">
46 
-                                          <p class="text-base font-medium text-center text-gray-800 dark:text-gray-100">Su</p>
46 
+                                          <p class="text-base font-medium text-center text-gray-800">Su</p>
47 47 
                                       </div>
48 48 
                                   </th>
49 49 
                               </tr>
 
@@ -61,86 +61,86 @@
61 61 
                                   </td>
62 62 
                                   <td class="pt-6">
63 63 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
64 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">1</p>
64 
+                                          <p class="text-base text-gray-500 font-medium">1</p>
65 65 
                                       </div>
66 66 
                                   </td>
67 67 
                                   <td class="pt-6">
68 68 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
69 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">2</p>
69 
+                                          <p class="text-base text-gray-500 font-medium">2</p>
70 70 
                                       </div>
71 71 
                                   </td>
72 72 
                                   <td class="pt-6">
73 73 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
74 
-                                          <p class="text-base text-gray-500 dark:text-gray-100">3</p>
74 
+                                          <p class="text-base text-gray-500">3</p>
75 75 
                                       </div>
76 76 
                                   </td>
77 77 
                                   <td class="pt-6">
78 78 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
79 
-                                          <p class="text-base text-gray-500 dark:text-gray-100">4</p>
79 
+                                          <p class="text-base text-gray-500">4</p>
80 80 
                                       </div>
81 81 
                                   </td>
82 82 
                               </tr>
83 83 
                               <tr>
84 84 
                                   <td>
85 85 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
86 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">5</p>
86 
+                                          <p class="text-base text-gray-500 font-medium">5</p>
87 87 
                                       </div>
88 88 
                                   </td>
89 89 
                                   <td>
90 90 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
91 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">6</p>
91 
+                                          <p class="text-base text-gray-500 font-medium">6</p>
92 92 
                                       </div>
93 93 
                                   </td>
94 94 
                                   <td>
95 95 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
96 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">7</p>
96 
+                                          <p class="text-base text-gray-500 font-medium">7</p>
97 97 
                                       </div>
98 98 
                                   </td>
99 99 
                                   <td>
100 100 
                                     <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
101 
-                                        <p class="text-base text-gray-500 dark:text-gray-100 font-medium">8</p>
101 
+                                        <p class="text-base text-gray-500 font-medium">8</p>
102 102 
                                     </div>
103 103 
                                   </td>
104 104 
                                   <td>
105 105 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
106 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">9</p>
106 
+                                          <p class="text-base text-gray-500 font-medium">9</p>
107 107 
                                       </div>
108 108 
                                   </td>
109 109 
                                   <td>
110 110 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
111 
-                                          <p class="text-base text-gray-500 dark:text-gray-100">10</p>
111 
+                                          <p class="text-base text-gray-500">10</p>
112 112 
                                       </div>
113 113 
                                   </td>
114 114 
                                   <td>
115 115 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
116 
-                                          <p class="text-base text-gray-500 dark:text-gray-100">11</p>
116 
+                                          <p class="text-base text-gray-500">11</p>
117 117 
                                       </div>
118 118 
                                   </td>
119 119 
                               </tr>
120 120 
                               <tr>
121 121 
                                   <td>
122 122 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
123 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">12</p>
123 
+                                          <p class="text-base text-gray-500 font-medium">12</p>
124 124 
                                       </div>
125 125 
                                   </td>
126 126 
                                   <td>
127 127 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
128 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">13</p>
128 
+                                          <p class="text-base text-gray-500 font-medium">13</p>
129 129 
                                       </div>
130 130 
                                   </td>
131 131 
                                   <td>
132 132 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
133 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">14</p>
133 
+                                          <p class="text-base text-gray-500 font-medium">14</p>
134 134 
                                       </div>
135 135 
                                   </td>
136 136 
                                   <td>
137 137 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
138 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">15</p>
138 
+                                          <p class="text-base text-gray-500 font-medium">15</p>
139 139 
                                       </div>
140 140 
                                   </td>
141 141 
                                   <td>
142 142 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
143 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">16</p>
143 
+                                          <p class="text-base text-gray-500 font-medium">16</p>
144 144 
                                       </div>
145 145 
                                   </td>
146 146 
                                   <td>
 
@@ -152,76 +152,76 @@
152 152 
                                   </td>
153 153 
                                   <td>
154 154 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
155 
-                                          <p class="text-base text-gray-500 dark:text-gray-100">18</p>
155 
+                                          <p class="text-base text-gray-500">18</p>
156 156 
                                       </div>
157 157 
                                   </td>
158 158 
                               </tr>
159 159 
                               <tr>
160 160 
                                   <td>
161 161 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
162 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">19</p>
162 
+                                          <p class="text-base text-gray-500 font-medium">19</p>
163 163 
                                       </div>
164 164 
                                   </td>
165 165 
                                   <td>
166 166 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
167 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">20</p>
167 
+                                          <p class="text-base text-gray-500 font-medium">20</p>
168 168 
                                       </div>
169 169 
                                   </td>
170 170 
                                   <td>
171 171 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
172 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">21</p>
172 
+                                          <p class="text-base text-gray-500 font-medium">21</p>
173 173 
                                       </div>
174 174 
                                   </td>
175 175 
                                   <td>
176 176 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
177 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">22</p>
177 
+                                          <p class="text-base text-gray-500 font-medium">22</p>
178 178 
                                       </div>
179 179 
                                   </td>
180 180 
                                   <td>
181 181 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
182 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">23</p>
182 
+                                          <p class="text-base text-gray-500 font-medium">23</p>
183 183 
                                       </div>
184 184 
                                   </td>
185 185 
                                   <td>
186 186 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
187 
-                                          <p class="text-base text-gray-500 dark:text-gray-100">24</p>
187 
+                                          <p class="text-base text-gray-500">24</p>
188 188 
                                       </div>
189 189 
                                   </td>
190 190 
                                   <td>
191 191 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
192 
-                                          <p class="text-base text-gray-500 dark:text-gray-100">25</p>
192 
+                                          <p class="text-base text-gray-500">25</p>
193 193 
                                       </div>
194 194 
                                   </td>
195 195 
                               </tr>
196 196 
                               <tr>
197 197 
                                   <td>
198 198 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
199 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">26</p>
199 
+                                          <p class="text-base text-gray-500 font-medium">26</p>
200 200 
                                       </div>
201 201 
                                   </td>
202 202 
                                   <td>
203 203 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
204 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">27</p>
204 
+                                          <p class="text-base text-gray-500 font-medium">27</p>
205 205 
                                       </div>
206 206 
                                   </td>
207 207 
                                   <td>
208 208 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
209 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">28</p>
209 
+                                          <p class="text-base text-gray-500 font-medium">28</p>
210 210 
                                       </div>
211 211 
                                   </td>
212 212 
                                   <td>
213 213 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
214 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">29</p>
214 
+                                          <p class="text-base text-gray-500 font-medium">29</p>
215 215 
                                       </div>
216 216 
                                   </td>
217 217 
                                   <td>
218 218 
                                       <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
219 
-                                          <p class="text-base text-gray-500 dark:text-gray-100 font-medium">30</p>
219 
+                                          <p class="text-base text-gray-500 font-medium">30</p>
220 220 
                                       </div>
221 221 
                                   </td>
222 222 
                                   <td>
223 223 
                                     <div class="px-2 py-2 cursor-pointer flex w-full justify-center">
224 
-                                        <p class="text-base text-gray-500 dark:text-gray-100">31</p>
224 
+                                        <p class="text-base text-gray-500">31</p>
225 225 
                                     </div>
226 226 
                                 </td>
227 227 
                               </tr>

+ 7
- 11
resources/views/modals/emoney-modal.blade.php Zobrazit soubor 

@@ -1,11 +1,3 @@
1 
-<style>
2 
-  .copy-link {
3 
-            color: blue;
4 
-            text-decoration: underline;
5 
-            cursor: pointer;
6 
-            float: right;
7 
-        }
8 
-</style>
9 1 
 <dialog id="emoney" class="modal">
10 2 
   <div class="modal-box w-11/12 max-w-5xl">
11 3 
     <h3 class="text-lg font-bold">Hadiah</h3>
 
@@ -13,15 +5,19 @@
13 5 
       <div class="label">
14 6 
         <span class="label-text">Nama Bank</span>
15 7 
       </div>
16 
-      <input type="text" value="RHB Bank Berhad" class="input input-bordered input-sm input-accent w-full max-w-xs" disabled/>
8 
+      <p class="input input-bordered input-sm input-accent w-full max-w-xs">
9 
+        RHB Bank Berhad
10 
+      </p>
17 11 
     </label>
18 12 
     <label class="form-control w-full max-w-xs">
19 13 
       <div class="label">
20 14 
         <span class="label-text">No. Akaun</span>
21 15 
       </div>
22 16 
       <p class="input input-bordered input-sm input-accent w-full max-w-xs">
23 
-        15601700275298
24 
-          <span id="copyText" class="copy-link">(copy)</span>
17 
+          15601700275298
18 
+          <span id="copyText" class="copy-link cursor-pointer float-end">
19 
+            <i class="fa-regular fa-copy"></i>
20 
+          </span>
25 21 
       </p>
26 22 
       <p id="copyMessage" class="text-green-500" style="display:none;">Copied to clipboard!</p>
27 23 
     </label>

+ 8
- 23
resources/views/modals/guestbook-modal.blade.php Zobrazit soubor 

@@ -42,34 +42,19 @@
42 42 
             data: formData,
43 43 
             success: function(response) {
44 44 
               $('#closeSpeechForm').submit();
45 
-              if ('{{ session('success') }}') {
46 
-                  showSuccessMessage('{{ session('success') }}');
47 
-              }
45 
+              $('#speechForm')[0].reset();
46 
+              var alertContainer = $('.alert-info');
47 
+              alertContainer.find('span').text(response.message); // Set message text
48 
+              alertContainer.fadeIn().removeClass('hidden'); // Show the alert
49 
+              setTimeout(function() {
50 
+                  alertContainer.fadeOut().addClass('hidden'); // Hide the alert after 5 seconds
51 
+              }, 3000);
48 52 
             },
49 53 
             error: function(xhr, status, error) {
50 54 
               console.error('Error submitting form:', error);
51 55 
             }
52 56 
           });
53 57 
         });
54 
-      })
55 
-
56 
-      function showSuccessMessage(message) {
57 
-          // Create a dynamic success message element
58 
-          var successAlert = $('<div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded relative" role="alert">' +
59 
-              '<span class="block sm:inline">' + message + '</span>' +
60 
-              '</div>');
61 
-
62 
-          // Append the message to a suitable container in your HTML (e.g., modal, form, or body)
63 
-          $('#alert-success').append(successAlert);
64 
-
65 
-          // Automatically remove the message after 3 seconds
66 
-          setTimeout(function() {
67 
-              successAlert.fadeOut('slow', function() {
68 
-                  $(this).remove();
69 
-              });
70 
-          }, 3000); // 3 seconds
71 
-
72 
-          // session()->forget('success');
73 
-      }
58 
+      });
74 59 
     </script>
75 60 
 @endpush

+ 7
- 20
resources/views/modals/rsvp-modal.blade.php Zobrazit soubor 

@@ -48,9 +48,13 @@
48 48 
           data: formData,
49 49 
           success: function(response) {
50 50 
             $('#closeRsvpForm').submit();
51 
-            if ('{{ session('success') }}') {
52 
-                showSuccessMessage('{{ session('success') }}');
53 
-            }
51 
+            $('#rsvpForm')[0].reset();
52 
+            var alertContainer = $('.alert-info');
53 
+            alertContainer.find('span').text(response.message); // Set message text
54 
+            alertContainer.fadeIn().removeClass('hidden'); // Show the alert
55 
+            setTimeout(function() {
56 
+                alertContainer.fadeOut().addClass('hidden'); // Hide the alert after 5 seconds
57 
+            }, 3000);
54 58 
           },
55 59 
           error: function(xhr, status, error) {
56 60 
             console.error('Error submitting form:', error);
 
@@ -58,22 +62,5 @@
58 62 
         });
59 63 
       });
60 64 
     });
61 
-
62 
-    function showSuccessMessage(message) {
63 
-        // Create a dynamic success message element
64 
-        var successAlert = $('<div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded relative" role="alert">' +
65 
-            '<span class="block sm:inline">' + message + '</span>' +
66 
-            '</div>');
67 
-
68 
-        // Append the message to a suitable container in your HTML (e.g., modal, form, or body)
69 
-        $('#alert-success').append(successAlert);
70 
-
71 
-        // Automatically remove the message after 3 seconds
72 
-        setTimeout(function() {
73 
-            successAlert.fadeOut('slow', function() {
74 
-                $(this).remove();
75 
-            });
76 
-        }, 3000); // 3 seconds
77 
-    }
78 65 
   </script>
79 66 
 @endpush

+ 10
- 21
resources/views/rsvp-digital-card.blade.php Zobrazit soubor 

@@ -2,7 +2,7 @@
2 2 
 <html lang="en" data-theme="light">
3 3 
 <head>
4 4 
     <meta charset="UTF-8">
5 
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
5 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
6 6 
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
7 7 
     <meta name="color-scheme" content="light only">
8 8 
     <title>{{config('app.name')}}</title>
 
@@ -15,6 +15,9 @@
15 15 
     @vite(['resources/css/app.css'])
16 16 
 </head>
17 17 
 <body class="antialiased font-serif">
18 
+    <div role="alert" class="alert alert-info hidden z-40 fixed w-1/2 top-3 right-3">
19 
+        <span></span>
20 
+    </div>
18 21 
     <audio id="player" autoplay="autoplay" loop>
19 22 
         <source src="{{asset('assets/background-musicv2.mp3')}}" type="audio/mp3">
20 23 
     </audio>
 
@@ -77,33 +80,19 @@
77 80 
               type: 'POST',
78 81 
               data: formData,
79 82 
               success: function(response) {
80 
-                if ('{{ session('success') }}') {
81 
-                    showSuccessMessage('{{ session('success') }}');
82 
-                }
83 83 
                 $('#RSVPForm')[0].reset();
84 
+                var alertContainer = $('.alert-info');
85 
+                alertContainer.find('span').text(response.message); // Set message text
86 
+                alertContainer.fadeIn().removeClass('hidden'); // Show the alert
87 
+                setTimeout(function() {
88 
+                    alertContainer.fadeOut().addClass('hidden'); // Hide the alert after 5 seconds
89 
+                }, 3000);
84 90 
               },
85 91 
               error: function(xhr, status, error) {
86 92 
                 console.error('Error submitting form:', error);
87 93 
               }
88 94 
             });
89 95 
           });
90 
-
91 
-          function showSuccessMessage(message) {
92 
-                // Create a dynamic success message element
93 
-                var successAlert = $('<div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded relative" role="alert">' +
94 
-                    '<span class="block sm:inline">' + message + '</span>' +
95 
-                    '</div>');
96 
-
97 
-                // Append the message to a suitable container in your HTML (e.g., modal, form, or body)
98 
-                $('#alert-success').append(successAlert);
99 
-
100 
-                // Automatically remove the message after 3 seconds
101 
-                setTimeout(function() {
102 
-                    successAlert.fadeOut('slow', function() {
103 
-                        $(this).remove();
104 
-                    });
105 
-                }, 3000); // 3 seconds
106 
-            }
107 96 
         });
108 97 
     </script>
109 98 
 </body>

+ 1
- 4
routes/web.php Zobrazit soubor 

@@ -16,7 +16,4 @@ use App\Http\Controllers\MainController;
16 16
17 17 
 Route::get('/', [MainController::class, 'main']);
18 18 
 Route::post('/saveRsvp', [MainController::class, 'saveRsvp'])->name('rsvp.save');
19 
-Route::post('/saveSpeech', [MainController::class, 'saveSpeech'])->name('speech.save');
20 
-
21 
-
22 
-Route::get('/rsvp', [MainController::class, 'rsvpmain']);
19 
+Route::post('/saveSpeech', [MainController::class, 'saveSpeech'])->name('speech.save');

Zapsat Náhled
Načítá se…
Zrušit
Uložit