Apply style to "Add aproduct"

includes/assets/css/default.css

@@ -1,82 +0,0 @@
-:root {
-    --color-primary: blue;
-
-    --radius-default: 4px;
-}
-
-body {
-    margin: 0;
-
-    font-family: sans-serif;
-    font-size: 14pt;
-
-    background-color: #f4f4f4;
-}
-
-h1 {
-    margin-top: 0;
-}
-
-p {
-    font-size: inherit;
-}
-
-form {
-    display: inline-block;
-}
-
-section {
-    max-width: 80ch;
-    padding: 2rem;
-    margin: 1rem auto 0 auto;
-
-    background-color: #fff;
-}
-
-/**
- * Buttons
- */
-button,
-.button,
-input[type="submit"],
-input[type="button"] {
-    padding: 0.4em 1.6em;
-
-    font-size: inherit;
-
-    cursor: pointer;
-    border: none;
-    border-radius: var(--radius-default);
-}
-
-.button.primary,
-input[type="submit"] {
-    color: #fff;
-    background-color: var(--color-primary);
-}
-
-a.button {
-    text-decoration: none;
-}
-
-/**
- * Inputs
- */
-fieldset {
-    margin: 0 0 1em 0;
-    padding: 0;
-
-    border: none;
-}
-
-input[type="number"],
-input[type="url"],
-input[type="email"],
-input[type="password"],
-input[type="text"] {
-    width: 100%;
-    padding: 0.4em;
-    font-size: inherit;
-
-    border: 1px solid #f8f8f8;
-}

includes/assets/css/install.css

@@ -1,11 +0,0 @@
-main {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-
-    height: 100vh;
-}
-
-section {
-    max-width: 768px;
-}

includes/classes/page.php

@@ -65,6 +65,37 @@ class Page
         <?php
     }
 
+    public function navigation(): void {
+        ?>
+        <div class="ui attached stackable menu">
+            <div class="ui container">
+                <a class="item">
+                <i class="home icon"></i> Home
+                </a>
+                <a class="item">
+                <i class="grid layout icon"></i> Browse
+                </a>
+                <a class="item">
+                <i class="mail icon"></i> Messages
+                </a>
+                <div class="ui simple dropdown item">
+                More
+                <i class="dropdown icon"></i>
+                <div class="menu">
+                    <a class="item"><i class="edit icon"></i> Edit Profile</a>
+                    <a class="item"><i class="globe icon"></i> Choose Language</a>
+                    <a class="item"><i class="settings icon"></i> Account Settings</a>
+                </div>
+                </div>
+                <div class="right item">
+                <div class="ui input"><input type="text" placeholder="Search..."></div>
+                </div>
+            </div>
+        </div>
+        <div class="ui hidden divider"></div>
+        <?php
+    }
+
     public function footer(): void
     {
         ?>

includes/pages/wishlist-product-add.php

@@ -27,25 +27,28 @@ $info = $embed->get($url);
 
 $page = new page(__FILE__, 'Add a product');
 $page->header();
+$page->navigation();
 ?>
 <main>
-<section>
-    <h1>Add a product</h1>
+<div class="ui container">
+    <div class="ui segment">
+        <h1 class="ui header">Add a product</h1>
 
-    <form method="post">
-        <fieldset>
+        <form class="ui form" method="post">
+            <div class="field">
                 <label>URL</label>
                 <input type="url" name="url" value="<?= $url ?>" />
-        </fieldset>
+            </div>
 
-        <fieldset>
+            <div class="field">
                 <label>Wishlist</label>
                 <input type="number" name="wishlist" value="1" />
-        </fieldset>
+            </div>
 
-        <input type="submit" value="Add" />
+            <input class="ui button" type="submit" value="Add" />
         </form>
-</section>
+    </div>
+</div>
 </main>
 
 <?php