From 7df19e377f203b69a79e8bf62fe81b1187d90768 Mon Sep 17 00:00:00 2001
From: Rico Hoppe <rico.hoppe@ipfire.org>
Date: Sun, 15 Oct 2023 14:26:14 +0000
Subject: [PATCH] docs/edit: restyled the page

---
 src/templates/docs/edit.html | 122 ++++++++++++++++++++++++++---------
 1 file changed, 92 insertions(+), 30 deletions(-)

diff --git a/src/templates/docs/edit.html b/src/templates/docs/edit.html
index 5717c0f6..3f1f3404 100644
--- a/src/templates/docs/edit.html
+++ b/src/templates/docs/edit.html
@@ -5,9 +5,9 @@
 {% block main %}
 	{% import os.path %}
 
-	<div class="card mb-4">
-		<div class="card-body">
-			<h4 class="card-title">
+	<div class="container">
+		<section class="section">
+			<h4 class="title is-4">
 				{% if page %}{{ _("Edit %s") % page.title }}{% else %}{{ _("Create A New Page") }}{% end %}
 			</h4>
 
@@ -15,7 +15,7 @@
 				{% raw xsrf_form_html() %}
 
 				<div class="mb-3">
-					<div class="btn-toolbar mb-3" role="toolbar">
+					<!--<div class="btn-toolbar mb-3" role="toolbar">
 						<div class="btn-group btn-group-sm mr-2" role="group">
 							<button type="button" class="btn btn-secondary"
 									id="bold" title="{{ _("Bold") }} [{{ _("Ctrl") }}-B]">
@@ -54,56 +54,118 @@
 						<a class="btn btn-sm btn-secondary" href="{{ path }}/_files"
 								target="_blank" title="{{ _("Files") }}">
 							<i class="fas fa-images"></i>
-						</a>
-					</div>
+						</a>-->
+
+						<div class="field has-addons">
+							<p class="control">
+								<button type="button" class="button"
+										id="bold" title="{{ _("Bold") }} [{{ _("Ctrl") }}-B]">
+									<i class="fas fa-bold"></i>
+								</button>
+							</p>
+							<p class="control">
+								<button type="button" class="button"
+										id="italic" title="{{ _("Italic") }} [{{ _("Ctrl") }}-I]">
+									<i class="fas fa-italic"></i>
+								</button>
+							</p>
+							<p class="control">
+								<button type="button" class="button"
+										id="code" title="{{ _("Code") }} [{{ _("Ctrl") }}-C]">
+									<i class="fas fa-code"></i>
+								</button>
+							</p>
+						</div>
+						<div class="field has-addons">
+							<p class="control">
+								<button type="button" class="button"
+										id="headline-up" title="{{ _("Headline one level up") }}">
+									<i class="fas fa-chevron-left"></i>
+								</button>
+							</p>
+							<p class="control">
+								<button type="button" class="button"
+										id="headline" title="{{ _("Headline") }} [{{ _("Ctrl") }}-H]">
+									<i class="fas fa-heading"></i>
+								</button>
+							</p>
+							<p class="control">
+								<button type="button" class="button"
+										id="headline-down" title="{{ _("Headline one level down") }}">
+									<i class="fas fa-chevron-right"></i>
+								</button>
+							</p>
+						</div>
+						<div class="field has-addons">
+							<p class="control">
+								<button type="button" class="button"
+										id="link" title="{{ _("Link") }} [{{ _("Ctrl") }}-L]">
+									<i class="fas fa-link"></i>
+								</button>
+							</p>
+							<p class="control">
+								<a class="button" href="{{ path }}/_files"
+										target="_blank" title="{{ _("Files") }}">
+									<i class="fas fa-images"></i>
+								</a>
+							</p>
+						</div>
+
 
-					<textarea class="form-control" rows="16" name="content" id="content" placeholder="{{ _("Text") }}"
-						>{% if page and page.markdown %}{{ page.markdown }}{% end %}</textarea>
+					<div class="field">
+						<div class="control">
+							<textarea class="textarea" rows="16" name="content" id="content" placeholder="{{ _("Text") }}"
+							>{% if page and page.markdown %}{{ page.markdown }}{% end %}</textarea>
+						</div>
+					</div>
 				</div>
 
-				<div class="mb-3 row">
-					<label class="col-sm-4 col-form-label">{{ _("What has changed?") }}</label>
-					<div class="col-sm-8">
-						<input type="text" class="form-control" name="changes" required>
+				<div class="field">
+					<label class="label">{{ _("What has changed?") }}</label>
+					<div class="control">
+						<input type="text" class="input" name="changes" required>
 					</div>
 				</div>
 
 				{% if page and not page.is_watched_by(current_user) %}
-					<div class="mb-3 form-check">
-						<div class="form-check">
-							<input class="form-check-input" type="checkbox" name="watch" id="watch" checked>
-							<label class="form-check-label" for="watch">{{ _("Watch this page") }}</label>
+					<div class="block">
+						<div class="control">
+							<label class="checkbox" for="watch">{{ _("Watch this page") }}</label>
+								<input type="checkbox" name="watch" id="watch" checked>
+							</label>
 						</div>
 
 						<small class="form-text text-muted">
-							{{ _("Get notified when this page is changed") }}
+							{{_("Get notified when this page is changed") }}
 						</small>
 					</div>
 				{% end %}
 
-				<div class="d-grid">
-					<button type="submit" class="btn btn-primary">
+				<div class="control">
+					<button type="submit" class="button is-primary">
 						{% if page %}{{ _("Save Page") }}{% else %}{{ _("Create Page") }}{% end %}
 					</button>
 				</div>
 			</form>
 		</div>
-	</div>
+	</section>
 
-	<div id="preview" class="fade show">
-		<div class="d-flex align-items-center mb-4">
-			<h4 class="mb-0">{{ _("Preview") }}</h4>
-			<div id="spinner" class="spinner-border ml-auto" role="status" aria-hidden="true"></div>
-		</div>
+	<section class="section">
+		<div id="preview" class="fade show">
+			<div class="d-flex align-items-center mb-4">
+				<h4 class="mb-0">{{ _("Preview") }}</h4>
+				<div id="spinner" class="spinner-border ml-auto" role="status" aria-hidden="true"></div>
+			</div>
 
-		<div class="card">
-			<div class="card-body mb-0">
-				<div id="preview-content" class="wiki-content mb-0">
-					{{ _("Loading...") }}
+			<div class="card">
+				<div class="card-body mb-0">
+					<div id="preview-content" class="wiki-content mb-0">
+						{{ _("Loading...") }}
+					</div>
 				</div>
 			</div>
 		</div>
-	</div>
+	</section>
 {% end block %}
 
 {% block javascript %}
-- 
2.47.2