Initial frontend commit

jan-nicklaus · Mar 24, 2024 · 4574eb2 · 4574eb2
1 parent ccf7729
commit 4574eb2
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 2 deletions.
diff --git a/frontend/index.html b/frontend/index.html
@@ -9,12 +9,35 @@
         <script type="text/javascript">
             document.addEventListener("alpine:init", () => {
                 Alpine.data("state", () => ({
-                    "test": "Hello World!"
+                    "task": "entscheid-zsfg",
+                    "fields": {
+                        "entscheid-zsfg": {
+                            "display_name": "Entscheid zusammenfassen",
+                            "inputs": [
+                                {
+                                    "name": "fundstelle",
+                                    "display_name": "Fundstelle",
+                                    "type": "text"
+                                },
+                                {
+                                    "name": "rolle",
+                                    "display_name": "Was ist Ihre Rolle?",
+                                    "type": "text"
+                                }
+                            ]
+                        }
+                    },
+                    async getTaskSelectHTML() {
+                        return `<select>
+                                ${Object.keys(this.fields).map(t => "<option")}
+                            </select>`
+                    }
                 }))
             });
         </script>
         <div x-data="state" id="basediv">
-            <h1 class="text-red-400" x-text="test"></h1>
+            <h1 class="text-2xl">Legal Prompt Builder v0.1</h1>
+            <div x-html="getTaskSelectHTML"></div>
         </div>
     </body>
 </html> 
diff --git a/frontend/style.css b/frontend/style.css
@@ -544,6 +544,11 @@ video {
   --tw-backdrop-sepia:  ;
 }
 
+.text-2xl {
+  font-size: 1.5rem;
+  line-height: 2rem;
+}
+
 .text-red-400 {
   --tw-text-opacity: 1;
   color: rgb(248 113 113 / var(--tw-text-opacity));