Added edit page

css/edit.css

@@ -0,0 +1,16 @@
+/*
+  -=-=-= EDIT =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
+*/
+.edit-root {
+  margin: 0 auto 2rem; padding: 0.5rem;;
+
+  background-color: var(--bg); color: var(--fg);
+
+  border: 0.2rem solid var(--green);
+  outline: 0.5rem solid var(--bg);
+
+  border-radius: var(--rad);
+  box-shadow: var(--shadow);
+
+  max-width: 621px;
+}

css/master.css

@@ -3,6 +3,7 @@
 
 @import "gallery.css";
 @import "image.css";
+@import "edit.css";
 @import "upload.css";
 
 :root {
@@ -26,6 +27,7 @@
 * {
   font-weight: 521;
   color: var(--fg);
+  font-family: "Fira Code", monospace;
 }
 html {
   margin: 0; padding: 0;
@@ -50,6 +52,14 @@ body {
   justify-content: space-between;
 }
 
+form {
+  width: 100%;
+  box-sizing: border-box;
+}
+form * {
+  width: 100%;
+  box-sizing: border-box;
+}
 
 /*
   -=-=-= UNIVERSAL =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
@@ -81,7 +91,7 @@ body {
 
   text-align: center;
 
-  display: inline-block;
+  display: block;
 
   border-radius: var(--rad);
 
@@ -100,17 +110,21 @@ body {
 .btn {
   margin: 0; padding: 0.5rem;
 
-  border: none;
-
-  display: inline-block;
+  display: block;
 
+  font-size: 16px;
   align-items: center;
 
+  border: none;
   border-radius: var(--rad);
 }
 .btn:hover {
   outline: var(--white) 3px solid;
 }
+a.btn {
+  text-align: center;
+  text-decoration: none;
+}
 
 .space-bottom {
   margin-bottom: 1rem;
@@ -146,7 +160,7 @@ h4 {
   font-family: "Lexend Deca", sans-serif;
   font-size: 21px;
 }
-p {
+p, a {
   margin: 0 0 0.5rem 0;
   font-family: "Fira Code", monospace;
 }

css/upload.css

@@ -14,7 +14,3 @@
 
   max-width: 621px;
 }
-
-form {
-  width: 100%;
-}

image.php

@@ -18,6 +18,10 @@
   $image_results = mysqli_query($conn, $get_image);
   $image = mysqli_fetch_assoc($image_results);
 
+  if ($_GET["update"] == "success") {
+    echo "<p class='alert alert-high space-top'>Information updated</p>";
+  }
+
   if (!isset($_GET['id'])) {
     echo "<p class='alert alert-low'>No ID present</p>";
 
@@ -43,7 +47,7 @@
     <?php
     // Image Description/Alt
     if (empty($image_alt)) {
-      echo "<p>Image uploaded prior to description being added</p>";
+      echo "<p>No description provided</p>";
     }else{
       echo "<p>".$image_alt."</p>";
     }
@@ -71,6 +75,7 @@
 
   <div class="danger-zone flex-down">
     <h2>Danger zone</h2>
+    <!-- DELETE BUTTON -->
     <?php
     // Image hover details
     echo "<form class='detail' method='POST' enctype='multipart/form-data'>";
@@ -94,6 +99,9 @@
       }
     }
     ?>
+
+    <!-- EDIT BUTTON -->
+    <?php echo "<a class='btn alert-low space-top' href='https://superdupersecteteuploadtest.fluffybean.gay/edit.php?id=".$image['id']."'>Modify image content</a>"; ?>
   </div>
 
   <?php include("ui/footer.php"); ?>

upload.php

@@ -11,11 +11,10 @@
   <?php include("ui/header.php"); ?>
 
   <div class="upload-root">
+    <h2 class="space-bottom">Upload image</h2>
     <form class="flex-down between" method="POST" action="upload.php" enctype="multipart/form-data">
-        <input class="btn alert-default" type="file" name="image" placeholder="select image UwU">
-        <br class="space-bottom">
-        <input class="btn alert-default" type="text" name="alt" placeholder="Description/Alt for image">
-        <br class="space-bottom">
+        <input class="btn alert-default space-bottom" type="file" name="image" placeholder="select image UwU">
+        <input class="btn alert-default space-bottom" type="text" name="alt" placeholder="Description/Alt for image">
         <button class="btn alert-default" type="submit" name="upload">Upload Image</button>
     </form>
     <?php