From 687b327cf8fd2b7122eb9b5ba6c8a24996b60966 Mon Sep 17 00:00:00 2001
From: Gabriel Arakaki Giovanini <mail@gabrielgio.me>
Date: Sun, 25 Jun 2023 17:10:29 +0200
Subject: feat: Add mockup for user settings

---
 scss/main.scss          |  9 +++++-
 templates/settings.html | 74 +++++++++++++++++++++++++++++++++++++------------
 2 files changed, 64 insertions(+), 19 deletions(-)

diff --git a/scss/main.scss b/scss/main.scss
index faad1ca..033315f 100644
--- a/scss/main.scss
+++ b/scss/main.scss
@@ -1,7 +1,7 @@
 $breakpoint: 520px;
 
 $tablet: $breakpoint;
-$body-font-size: 1.3rem;
+$body-font-size: 1rem;
 $radius-rounded: 0;
 $container-max-width: 920px;
 
@@ -15,6 +15,9 @@ $card-shadow: 0;
 $card-radius: 0;
 $card-content-padding: 0;
 
+$table-cell-padding: 0.5em;
+$table-cell-border-width: 0;
+
 @import "bulma/sass/base/_all.sass";
 @import "bulma/sass/utilities/_all.sass";
 @import "bulma/sass/grid/_all.sass";
@@ -65,6 +68,10 @@ nav {
     }
 }
 
+th {
+    font-weight: normal;
+}
+
 .img {
     object-fit: cover;
 }
diff --git a/templates/settings.html b/templates/settings.html
index f8423fc..2aa1a80 100644
--- a/templates/settings.html
+++ b/templates/settings.html
@@ -1,25 +1,63 @@
 {{template "layout.html" .}}
 {{define "title"}} {{.Title}} {{end}}
 {{define "content"}}
-<form action="/settings/", method="post">
-    <div class="field">
-        <div class="control">
-            <label class="checkbox">
-                <input type="checkbox" id="showMode" name="showMode" {{if .Data.ShowMode}}checked{{end}}>
-                Show File Modes
-            </label>
-        </div>
+<div class="columns">
+    <div class="column is-one-third">
+        <form action="/settings/", method="post">
+            <div class="field">
+                <div class="control">
+                    <label class="checkbox">
+                        <input type="checkbox" id="showMode" name="showMode" {{if .Data.ShowMode}}checked{{end}}>
+                        Show File Modes
+                    </label>
+                </div>
+            </div>
+            <div class="field">
+                <div class="control">
+                    <label class="checkbox">
+                        <input type="checkbox" id="showOwner" name="showOwner" {{if .Data.ShowOwner}}checked{{end}}>
+                        Show File Owner
+                    </label>
+                </div>
+            </div>
+            <div class="field">
+                <input class="button" value="save" type="submit">
+            </div>
+        </form>
     </div>
-    <div class="field">
-        <div class="control">
-            <label class="checkbox">
-                <input type="checkbox" id="showOwner" name="showOwner" {{if .Data.ShowOwner}}checked{{end}}>
-                Show File Owner
-            </label>
+    <div class="column">
+        <div class="table-container">
+            <table class="table">
+                <thead>
+                    <tr>
+                        <th>Username</th>
+                        <th>Path</th>
+                        <th>Is Admin?</th>
+                        <th>Action</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td>gabrielgio</td>
+                        <td>/home/gabrielgio</td>
+                        <td>yes</td>
+                        <td>
+                            <a href="#" class="button is-small">Edit</button>
+                            <a href="#" class="button is-small is-danger">Delete</button>
+                        </td>
+                    </tr>
+                    <tr>
+                        <td>beatriz</td>
+                        <td>/home/beatriz</td>
+                        <td>no</td>
+                        <td>
+                            <a href="#" class="button is-small">Edit</button>
+                            <a href="#" class="button is-small is-danger">Delete</button>
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
         </div>
     </div>
-    <div class="field">
-        <input class="button" value="save" type="submit">
-    </div>
-</form>
+</div>
 {{end}}
-- 
cgit v1.2.3