beginnings of a message box system within the UI

2026-01-28 16:27:38 -07:00
parent 4dd15aa0d2
commit ef47631b24
3 changed files with 161 additions and 0 deletions
@@ -0,0 +1,66 @@
+{*
+ * Amsterdam Web Communities System
+ * Copyright (c) 2025-2026 Erbosoft Metaverse Design Solutions, All Rights Reserved
+ * 
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ *}
+<div class="p-4">
+    <!-- Confirmation Dialog -->
+    <div class="max-w-2xl w-full">
+        <div class="bg-white border-2 border-{{ tone }}-600 rounded-lg shadow-2xl overflow-hidden">
+            <!-- Dialog Header -->
+            <div class="bg-{{ tone }}-600 px-6 py-4">
+                <h1 class="text-white text-2xl font-bold text-center flex items-center justify-center gap-3">
+                    {{ if destructive }}span class="text-3xl">⚠️</span>{{ end }}
+                    {{ amsterdam_pageTitle }}
+                    {{ if destructive }}<span class="text-3xl">⚠️</span>{{ end }}
+                </h1>
+            </div>
+
+            <!-- Dialog Body -->
+            <div class="px-8 py-8">
+                <div class="text-center mb-8">
+                    <p class="text-gray-800 text-lg leading-relaxed">
+                        {{ message }}
+                        {* You are about to nuke message <span class="font-mono font-bold text-red-600">&lt;Playground.129.16&gt;</span>, 
+                        originally composed by <span class="font-bold text-red-600">&lt;erbo&gt;</span>! *}
+                    </p>
+                    {{ if destructive }}
+                        <p class="text-gray-800 text-lg font-bold mt-4">Are you sure you want to do this?</p>
+                    {{ end }}
+                </div>
+
+                {{ if useWarning }}
+                    <!-- Warning Box -->
+                    <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-8">
+                        <div class="flex items-start">
+                            <span class="text-2xl mr-3">{{ warningIcon }}</span>
+                            <div class="text-sm text-yellow-800">
+                                {{ range i, line := warningLines }}
+                                    {{ if line.Bold }}
+                                        <p class="font-bold mb-1">{{ line.Text }}</p>
+                                    {{ else }}
+                                        <p>{{ line.Text }}</p>
+                                    {{ end }}
+                                {{ end }}
+                            </div>
+                        </div>
+                    </div>
+                {{ end }}
+
+                <!-- Action Buttons -->
+                <div class="flex gap-4 justify-center">
+                    {{ range i, bt := buttons }}
+                        <a href="{{ bt.Link }}"
+                            class="bg-{{ bt.Tone }}-600 hover:bg-{{ bt.Tone }}-700 text-white font-bold px-8 py-3 rounded-lg text-lg transition-colors shadow-lg hover:shadow-xl flex items-center gap-2">
+                            <span class="text-xl">{{ bt.Icon }}</span>
+                            {{ bt.Text }}
+                        </a>
+                    {{ end }}
+                </div>
+            </div>
+        </div>
+    </div>
+</div>