1diff --git a/pkg/view/settings.go b/pkg/view/settings.go
  2index 14f4e49fbaa75c5258c946507e6163b8ff1b02f8..bee3dc201b1f21d24ceb66ed7ae59df7cb95b491 100644
  3--- a/pkg/view/settings.go
  4+++ b/pkg/view/settings.go
  5@@ -3,9 +3,9 @@
  6 import (
  7 	"github.com/valyala/fasthttp"
  8 
  9-	"git.sr.ht/~gabrielgio/img"
 10 	"git.sr.ht/~gabrielgio/img/pkg/database/repository"
 11 	"git.sr.ht/~gabrielgio/img/pkg/ext"
 12+	"git.sr.ht/~gabrielgio/img/templates"
 13 )
 14 
 15 type (
 16@@ -13,11 +13,6 @@ 	SettingsView struct {
 17 		// there is not need to create a controller for this
 18 		settingsRepository repository.SettingsRepository
 19 		userRepository     repository.UserRepository
 20-	}
 21-
 22-	SettingsPage struct {
 23-		Settings *repository.Settings
 24-		Users    []*repository.User
 25 	}
 26 )
 27 
 28@@ -42,13 +37,12 @@ 	if err != nil {
 29 		return err
 30 	}
 31 
 32-	return img.Render(ctx, "settings.html", &img.HTMLView[*SettingsPage]{
 33-		Title: "Settings",
 34-		Data: &SettingsPage{
 35-			Settings: s,
 36-			Users:    users,
 37-		},
 38+	templates.WritePageTemplate(ctx, &templates.SettingsPage{
 39+		Settings: s,
 40+		Users:    users,
 41 	})
 42+
 43+	return nil
 44 }
 45 
 46 func (self *SettingsView) Save(ctx *fasthttp.RequestCtx) error {
 47diff --git a/templates/settings.html b/templates/settings.qtpl
 48rename from templates/settings.html
 49rename to templates/settings.qtpl
 50index 8c08773338919637ec0c3cb18e2b050f22945a66..509cddd76e1a34dadd953a7d84a2f838cd3ade31 100644
 51--- a/templates/settings.html
 52+++ b/templates/settings.qtpl
 53@@ -1,13 +1,22 @@
 54-{{template "layout.html" .}}
 55-{{define "title"}} {{.Title}} {{end}}
 56-{{define "content"}}
 57+{% import "git.sr.ht/~gabrielgio/img/pkg/database/repository" %}
 58+
 59+{% code
 60+type SettingsPage struct {
 61+    Settings *repository.Settings
 62+    Users    []*repository.User
 63+}
 64+%}
 65+
 66+{% func (p *SettingsPage) Title() %}Settings{% endfunc %}
 67+
 68+{% func (p *SettingsPage) Content() %}
 69 <div class="columns">
 70     <div class="column is-one-third">
 71         <form action="/settings/", method="post">
 72             <div class="field">
 73                 <div class="control">
 74                     <label class="checkbox">
 75-                        <input type="checkbox" id="showMode" name="showMode" {{if .Data.Settings.ShowMode}}checked{{end}}>
 76+                        <input type="checkbox" id="showMode" name="showMode" {% if p.Settings.ShowMode %}checked{% endif %}>
 77                         Show File Modes
 78                     </label>
 79                 </div>
 80@@ -15,7 +24,7 @@             </div>
 81             <div class="field">
 82                 <div class="control">
 83                     <label class="checkbox">
 84-                        <input type="checkbox" id="showOwner" name="showOwner" {{if .Data.Settings.ShowOwner}}checked{{end}}>
 85+                        <input type="checkbox" id="showOwner" name="showOwner" {% if p.Settings.ShowOwner %}checked{% endif %}>
 86                         Show File Owner
 87                     </label>
 88                 </div>
 89@@ -26,19 +35,22 @@             </div>
 90         </form>
 91     </div>
 92     <div class="column">
 93-        {{range .Data.Users}}
 94+    {% for _, user := range p.Users %}
 95         <div class="panel-block">
 96             <div class="columns wide-column is-gapless is-mobile">
 97                 <div class="column">
 98-                    {{.Username}}
 99+                    {%s user.Username %}
100                 </div>
101                 <div class="column">
102-                    {{.Path}}
103+                    {%s user.Path %}
104                 </div>
105                 <div class="column  has-text-right"><a href="#">Edit</a> / <a href="#" class="is-danger">Delete</a></div>
106             </div>
107         </div>
108-        {{end}}
109+    {% endfor %}
110     </div>
111 </div>
112-{{end}}
113+{% endfunc %}
114+
115+{% func (p *SettingsPage) Script() %}
116+{% endfunc %}