UI fixes

assets/static/css/main.css

@@ -358,6 +358,10 @@ input[type='text']{
   padding: 3px;
 }
 
+#fields-general {
+  margin-top: 10px;
+}
+
 .label-checkbox {
   top: 4px;
   position: relative;

assets/static/js/main.js

@@ -91,11 +91,7 @@ function bm_toggle_visibility(element_id) {
 
 function bm_toggle_visibility_list_search(element_id) {
   element = document.getElementById(element_id);
-  if (element.classList.contains("hidden")) {
+  element.hidden = !element.hidden;
-    element.classList.remove("hidden");
-  } else {
-    element.classList.add("hidden");
-  }
 
   var x = document.getElementsByClassName("stickyheader");
   for (var i = 0; i < x.length; i++) {
@@ -196,6 +192,26 @@ function bm_type_field_undelete(sender, type_field_id) {
     document.getElementById('Field-' + type_field_id).classList.remove('field-opaque');
 }
 
+function bm_item_relation_delete(sender, relation_name, relation_name_remove) {
+    document.getElementById(relation_name_remove).value = '1';
+    sender.hidden = true;
+    document.getElementById('Undelete-' + relation_name).hidden = false;
+    var x = document.getElementsByClassName(relation_name + "-Col");
+    for (var i = 0; i < x.length; i++) {
+        x[i].classList.add("field-opaque");
+    }
+}
+
+function bm_item_relation_undelete(sender, relation_name, relation_name_remove) {
+    document.getElementById(relation_name_remove).value = '';
+    sender.hidden = true;
+    document.getElementById('Delete-' + relation_name).hidden = false;
+    var x = document.getElementsByClassName(relation_name + "-Col");
+    for (var i = 0; i < x.length; i++) {
+        x[i].classList.remove("field-opaque");
+    }
+}
+
 function bm_showMessage() {
     document.getElementById('message').show();
     setTimeout(() => {

assets/templates/base.tmpl

@@ -29,7 +29,7 @@
         <div id="search-bar" class="hide-small">
           <form method="POST" hx-post="/items/search" hx-target="#page-content" hx-push-url="true" style="float: left">
           <input type="hidden" name="csrf_token" value="{{.CSRFToken}}" />
-          <input type="text" id="search-text" name="SearchText" class="w3-bar-item" placeholder="Search.." />
+          <input type="text" id="search-text" name="SearchText" class="bar-item" placeholder="Search.." />
           <button type="submit"><i class="bi bi-search"></i></button>
           </form>
           <a class="button" onclick="bm_toggle_quickbox();"><i class="bi bi-inbox-fill"></i></a>

assets/templates/categories/create_title.tmpl

@@ -1,6 +1,6 @@
 {{define "page:title"}}
     <div id="page-title-title"><h5>New Category</h5></div>
     <div class="hide-medium hide-large" id="top-toolbar">
-        <a href="#" onclick="bm_toggle_quickbox(); return false;" class="w3-button w3-medium w3-round-large"><i class='bi bi-inbox-fill'></i></a>
+        <a href="#" onclick="bm_toggle_quickbox(); return false;"><i class='bi bi-inbox-fill'></i></a>
     </div>
 {{end}}

assets/templates/categories/form.tmpl

@@ -1,19 +1,9 @@
 {{ define "page:content" }}
-<form
+<form method="POST" hx-post="{{.formAction}}" hx-target="{{.formTarget}}">
-  method="POST"
+  <div class="page-container">
-  hx-post="{{.formAction}}"
-  hx-target="{{.formTarget}}"
->
-  <div class="w3-container page-container">
     <p>
       <label for="category-name">Name</label>
-      <input
+      <input name="Name" id="category-name" type="text" value="{{.category.Name}}"/>
-        name="Name"
-        class=" w3-border"
-        id="category-name"
-        type="text"
-        value="{{.category.Name}}"
-      />
     </p>
 
   </div>

assets/templates/categories/list.tmpl

@@ -1,34 +1,16 @@
 {{define "categories:list"}}
-<div
+<div id="all_categories_search" hidden>
-  id="all_categories_search"
+  <div class="panel-search">
-  class="w3-panel w3-border w3-round-large w3-display-container"
+  <form method="POST" hx-post="/categories" hx-target="#categories">
-  style="display: none"
+    <div class="row">
->
+      <div class="col half" style="padding-right: 4px">
-  <form
-    class="w3-container"
-    method="POST"
-    hx-post="/categories"
-    hx-target="#categories"
-  >
-    <input type="hidden" name="csrf_token" value="{{.CSRFToken}}" />
-    <div class="w3-row">
-      <div class="w3-half" style="padding-right: 4px">
         <label for="category-name">Name</label>
-        <input
+        <input name="Name" id="category-name" type="text" value=""/>
-          name="Name"
-          class=" w3-border"
-          id="category-name"
-          type="text"
-          value=""
-        />
       </div>
     </div>
-    <div class="w3-bar" style="padding-top: 8px; padding-bottom: 8px">
+    <div class="bar" style="padding-top: 8px; padding-bottom: 8px"><button type="submit" class="main"><i class="bi bi-search"></i> Find</button></div>
-      <button type="submit" class="w3-btn w3-metro-dark-blue w3-round-large">
-        <i class="bi bi-search"></i> Find
-      </button>
-    </div>
   </form>
+  </div>
 </div>
 <div id="categories" class="list">
   <table class="table-all striped">
@@ -37,7 +19,7 @@
         <th>Name</th>
         <th class="operations">
           <a class="button" hx-get="/category/create" hx-push-url="true" hx-target="#page-content"><i class="bi bi-plus-circle"></i></a>
-          <a class="button" href="#" _="on click toggle the *display of #all_categories_search"><i class="bi bi-search"></i></a>
+          <a class="button" href="#" onclick="bm_toggle_visibility_list_search('all_categories_search'); return false;"><i class="bi bi-search"></i></a>
         </th>
       </tr>
     </thead>

assets/templates/items/add_relation.tmpl

@@ -2,12 +2,7 @@
 {{ $relation_name := printf "%s%v" "ItemRelation-New-" .relatedItem.Id }}
 <tr id="{{$relation_name}}-Row">
     <td class="no-label"><i class="{{.relatedItem.Type_icon}}"></i> {{.relatedItem.Type_title}} :
-    <a
+    <a href="/item/view/{{.relatedItem.Id}}" hx-get="/item/view/{{.relatedItem.Id}}" hx-target="body" hx-swap="beforeend">{{.relatedItem.Title}}</a>
-    href="/item/view/{{.relatedItem.Id}}"
-    hx-get="/item/view/{{.relatedItem.Id}}"
-    hx-target="#modal-container"
-      >{{.relatedItem.Title}}</a
-    >
     </td>
     <td class="no-label">
       {{ if gt (len .relatedItem.Categories) 0 }}
@@ -30,16 +25,9 @@
         {{ end }}
       {{ end }}
     </td>
-    <td class="no-label">{{ widget_relation_type $relation_name "Link" `id="$relation_name" class=" w3-border"` }}</td>
+    <td class="no-label">{{ widget_relation_type $relation_name "Link" `id="$relation_name"` }}</td>
     <td class="no-label">
-      <div class="w3-bar">
+      <a class="button delete" href="#" onclick="document.getElementById('{{$relation_name}}-Row').remove()"><i class="bi bi-link-45deg" title="Remove relation"></i><span> Remove</span></a>
-      <a
-          class="w3-right w3-btn w3-metro-dark-red w3-round-large"
-          href="#"
-          _="on click remove #{{$relation_name}}-Row"
-          ><i class="bi bi-link-45deg" title="Remove relation"></i><span class="hide-small"> Remove</span></a
-        >
-        </div>
     </td>
   </tr>
   {{ end }}

assets/templates/items/all_list.tmpl

@@ -1,5 +1,5 @@
 {{define "itemsAll:list"}}
-<div id="all_items_search" class="hidden">
+<div id="all_items_search" hidden>
 <div class="panel-search">
   <form method="POST" hx-post="/items" hx-target="#items">
     <div class="row">
@@ -16,14 +16,12 @@
         <input name="Keywords" id="item-tags" type="text" value=""/>
       </div>
     </div>
-    <div class="bar" style="padding-top: 8px; padding-bottom: 8px">
+    <div class="bar" style="padding-top: 8px; padding-bottom: 8px"><button type="submit" class="main"><i class="bi bi-search"></i> Find</button></div>
-      <button type="submit" class="main"><i class="bi bi-search"></i> Find</button>
-    </div>
   </form>
   </div>
 </div>
 <div id="items" class="list">
-  <table class="table-all responsive w3-striped stickyheader">
+  <table class="table-all responsive striped stickyheader">
     <thead>
       <tr>
         <th>Title</th>

assets/templates/items/form.tmpl

@@ -47,7 +47,7 @@
     {{ if eq .item.Type_show_description 1}}
     <p>
       <label for="item-description">Description</label>
-      <textarea name="Description" class=" w3-border" id="item-description" rows="10">{{.item.Description}}</textarea>
+      <textarea name="Description" id="item-description" rows="10">{{.item.Description}}</textarea>
     </p>
     {{ end }}
     <div class="row">

assets/templates/items/list.tmpl

@@ -1,5 +1,5 @@
 {{define "items:list"}}
-<div  id="items_search" class="hidden">
+<div  id="items_search" hidden>
 <div class="panel-search">
   <form method="POST" hx-post="/items/type/{{.type.Id}}" hx-target="#items">
     <div class="row">

assets/templates/items/list_for_relations.tmpl

@@ -1,5 +1,5 @@
 {{define "items:list-for-relations"}}
-  <table class="table-all w3-striped responsive">
+  <table class="table-all striped responsive">
     <thead>
       <tr>
         <th>Item</th>

assets/templates/items/read.tmpl

@@ -1,9 +1,9 @@
 {{define "page:content"}}
 <div id="item">
-  <div class="w3-container page-container">
+  <div class="page-container">
     <h5 class="title">{{ .item.Title }}</h5>
     {{ if gt (len .item.Summary) 0}}
-    <div class="w3-round-large summary">
+    <div>
       {{.item.Summary_rendered | safeHTML}}
     </div>
     {{ end }}

assets/templates/items/relations.tmpl

@@ -25,7 +25,7 @@
           {{ $relation_type = "Parent" }}
         {{ end }}
       {{ end }}
-    <a href="/item/view/{{$target_id}}" hx-get="/item/view/{{$target_id}}" hx-target="#modal-container"><i class="{{.Type_icon}}" title="{{.Type_title}}"></i> {{.Title}}</a>
+    <a href="/item/view/{{$target_id}}" hx-get="/item/view/{{$target_id}}" hx-target="body" hx-swap="beforeend"><i class="{{.Type_icon}}" title="{{.Type_title}}"></i> {{.Title}}</a>
     <input type="hidden" id="{{$relation_name_remove}}" name="{{$relation_name_remove}}" value=""/>
     </td>
     <td class="no-label {{$relation_name}}-Col">
@@ -49,20 +49,10 @@
         {{ end }}
       {{ end }}
     </td>
-    <td class="no-label {{$relation_name}}-Col">{{ widget_relation_type $relation_name $relation_type `id="$relation_name" class=" w3-border"` }}</td>
+    <td class="no-label {{$relation_name}}-Col">{{ widget_relation_type $relation_name $relation_type `id="$relation_name"` }}</td>
     <td class="no-label">
-      <div class="bar">
+        <button id="Delete-{{$relation_name}}" class="delete" type="button" onclick="bm_item_relation_delete(this, {{$relation_name}}, {{$relation_name_remove}})"><i class="bi bi-x-square" title="Remove"></i><span> Remove</span></button>
-        <button id="Delete-{{$relation_name}}" class="delete" type="button"
+        <button id="Undelete-{{$relation_name}}" style="margin-right: 5px;" class="delete" type="button" onclick="bm_item_relation_undelete(this, {{$relation_name}}, {{$relation_name_remove}})" hidden><i class="bi bi-arrow-counterclockwise" title="Undo"></i><span> Undo</span></button>
-          _="on click set {value: '1'} on #{{$relation_name_remove}} then hide me then show #Undelete-{{$relation_name}} then add .w3-opacity-max to .{{$relation_name}}-Col"
-        >
-          <i class="bi bi-x-square" title="Remove"></i><span class="hide-small"> Remove</span>
-        </button>
-        <button id="Undelete-{{$relation_name}}" style="margin-right: 5px; display: none" class="delete" type="button"
-          _="on click set {value: ''} on #{{$relation_name_remove}} then hide me then show #Delete-{{$relation_name}} then remove .w3-opacity-max from .{{$relation_name}}-Col"
-        >
-          <i class="bi bi-arrow-counterclockwise" title="Undo"></i><span class="hide-small"> Undo</span>
-        </button>
-      </div>    
     </td>
   </tr>
   {{ end }}

assets/templates/items/relations_view.tmpl

@@ -1,6 +1,6 @@
 {{define "item:relations_view"}}
 {{ if (gt (len .relations)  0) }}
-<fieldset class="w3-round-large" style="margin-bottom: 40px">
+<fieldset style="margin-bottom: 40px">
   <legend>Relations</legend>
   <ul>
     {{
@@ -21,12 +21,7 @@
       end
     }}
     <li>
-      <a
+      <a href="/item/view/{{ $target_id }}" hx-get="/item/view/{{ $target_id }}" hx-target="#modal-container"><i class="{{.Type_icon}}" title="{{.Type_title}}"></i> {{.Title}}</a>
-        href="/item/view/{{ $target_id }}"
-        hx-get="/item/view/{{ $target_id }}"
-        hx-target="#modal-container"
-      >
-      <i class="{{.Type_icon}}" title="{{.Type_title}}"></i> {{.Title}}</a>
     </li>
     {{
       end

assets/templates/notebooks/form.tmpl

@@ -1,43 +1,19 @@
 {{ define "page:content" }}
-<form
+<form method="POST" hx-post="{{.formAction}}" hx-target="{{.formTarget}}" style="margin-bottom: 10px;">
-  method="POST"
+  <div class="page-container">
-  hx-post="{{.formAction}}"
-  hx-target="{{.formTarget}}"
-  style="margin-bottom: 10px;"
->
-  <div class="w3-container page-container">
   <p>
     <label for="notebook-title">Title</label>
-    <input
+    <input name="Title" id="notebook-title" type="text" value="{{.notebook.Title}}" />
-      name="Title"
-      class=" w3-border"
-      id="notebook-title"
-      type="text"
-      value="{{.notebook.Title}}"
-    />
   </p>
 
   <p>
     <label for="type-icon">Icon</label>
-    <input
+    <input name="Icon" id="notebook-icon" type="text" value="{{.notebook.Icon}}"/>
-      name="Icon"
-      class=" w3-border"
-      id="notebook-icon"
-      type="text"
-      value="{{.notebook.Icon}}"
-    />
   </p>
 
   <p>
     <label for="type-description">Description</label>
-    <textarea
+    <textarea name="Description" id="notebook-description" type="text" rows="5">{{.notebook.Description}}</textarea>
-      name="Description"
-      class=" w3-border"
-      id="notebook-description"
-      type="text"
-      rows="5"
-      >{{.notebook.Description}}</textarea
-    >
   </p>
 
   </div>

assets/templates/notebooks/list.tmpl

@@ -1,34 +1,18 @@
 {{define "notebooks:list"}}
-<div
+<div id="all_notebooks_search" hidden>
-  id="all_types_search"
+  <div class="panel-search">
-  class="w3-panel w3-border w3-round-large w3-display-container"
+  <form method="POST" hx-post="/notebooks" hx-target="#notebooks">
-  style="display: none"
+    <div class="row">
->
+      <div class="col half" style="padding-right: 4px">
-  <form
-    class="w3-container"
-    method="POST"
-    hx-post="/notebooks"
-    hx-target="#notebooks"
-  >
-    <input type="hidden" name="csrf_token" value="{{.CSRFToken}}" />
-    <div class="w3-row">
-      <div class="w3-half" style="padding-right: 4px">
         <label for="notebook-title">Title</label>
-        <input
+        <input name="Title" id="notebook-title" type="text" value=""/>
-          name="Title"
-          class=" w3-border"
-          id="notebook-title"
-          type="text"
-          value=""
-        />
       </div>
     </div>
-    <div class="w3-bar" style="padding-top: 8px; padding-bottom: 8px">
+    <div class="bar" style="padding-top: 8px; padding-bottom: 8px">
-      <button type="submit" class="w3-btn w3-metro-dark-blue w3-round-large">
+      <button type="submit" class="main"><i class="bi bi-search"></i> Find</button>
-        <i class="bi bi-search"></i> Find
-      </button>
     </div>
   </form>
+  </div>
 </div>
 <div id="notebooks">
   <table class="table-all striped">
@@ -37,7 +21,7 @@
         <th>Title</th>
         <th class="operations">
           <a class="button" hx-get="/notebook/create" hx-push-url="true" hx-target="#page-content"><i class="bi bi-plus-circle"></i></a>
-          <a class="button" href="#" _="on click toggle the *display of #all_types_search"><i class="bi bi-search"></i></a>
+          <a class="button" href="#" onclick="bm_toggle_visibility_list_search('all_notebooks_search'); return false;"><i class="bi bi-search"></i></a>
         </th>
       </tr>
     </thead>

assets/templates/partials/sidebar.tmpl

@@ -49,7 +49,7 @@
 
   <div class="sidebar-block">
     <h5 class="accordion" onclick="bm_toggle_visibility('types_menu')">
-      <i class="bi bi-list-task"></i> Items <i class='bi bi-chevron-down types_menu'></i><i class='w3-right bi bi-chevron-up hidden types_menu'></i>
+      <i class="bi bi-list-task"></i> Items <i class='bi bi-chevron-down types_menu'></i><i class='bi bi-chevron-up hidden types_menu'></i>
     </h5>
   </div>
 
@@ -66,7 +66,7 @@
   
   <div class="sidebar-block">
     <h5 class="accordion" onclick="bm_toggle_visibility('settings_menu')">
-      <i class="bi bi-gear-fill"></i> Settings <i class='bi bi-chevron-down settings_menu'></i><i class='w3-right bi bi-chevron-up hidden settings_menu'></i>
+      <i class="bi bi-gear-fill"></i> Settings <i class='bi bi-chevron-down settings_menu'></i><i class='bi bi-chevron-up hidden settings_menu'></i>
     </h5>
   </div>
 

assets/templates/quickbox/add.tmpl

@@ -4,6 +4,6 @@
     <button class="button" hx-delete="/quickbox/delete/{{.quicknote.Id}}" hx-target="closest div.quickbox-row" hx-swap="outerHTML swap:1s" hx-trigger='confirmed' onClick="bm_show_confirm_delete(this, 'Quickbox', 'Delete this note ?')"><i class="bi bi-dash-square"></i></button>
     <button class="button" hx-target="body" hx-swap="beforeend" hx-get="/quickbox/transform/{{.quicknote.Id}}"><i class='bi bi-arrow-up-left-circle-fill'></i></button>
   </div>
-  <div class="w3-rest">{{.quicknote.Note_rendered | safeHTML}}</div>
+  <div>{{.quicknote.Note_rendered | safeHTML}}</div>
 </div>
 {{end}}

assets/templates/types/field_new.tmpl

@@ -16,14 +16,14 @@
       <input type="text" id="Fields-New-{{.counter}}-Valid_values" name="Fields-New-{{.counter}}-Valid_values" value=""/>
     </div>
     <div class="col half">
-        {{ widget_select (print "Fields-"  .Type_field_id "-Ui_section") "Section" "general" $.uisections `class=" w3-border"` }}
+        {{ widget_select (print "Fields-"  .Type_field_id "-Ui_section") "Section" "general" $.uisections `` }}
     </div>
   </div>
 
   <div class="row">
-    <p>{{ widget_checkbox "Fields-New-{{.counter}}-Show_on_list" "Show on list" "1" .Show_on_list }}</p>
+    <p>{{ widget_checkbox (print "Fields-New-" .counter "-Show_on_list") "Show on list" "1" .Show_on_list }}</p>
-    <p>{{ widget_checkbox "Fields-New-{{.counter}}-Show_on_view" "Show on view" "1" .Show_on_view }}</p>
+    <p>{{ widget_checkbox (print "Fields-New-" .counter "-Show_on_view") "Show on view" "1" .Show_on_view }}</p>
-    <p>{{ widget_checkbox "Fields-New-{{.counter}}-Is_multiple" "Multiple" "1" .Is_multiple }}</p>
+    <p>{{ widget_checkbox (print "Fields-New-" .counter "-Is_multiple") "Multiple" "1" .Is_multiple }}</p>
   </div>
   <div class="bar">
     <button type="button" style="float:right; margin-right: 5px;" onclick="document.getElementById('field-new-{{.counter}}').remove()" class="delete"><i class="bi bi-file-minus" title="Remove"></i><span class="hide-small"> Remove</span></button>

assets/templates/types/fields.tmpl

@@ -18,13 +18,13 @@
         <input type="text" id="Fields-{{.Type_field_id}}-Valid_values" name="Fields-{{.Type_field_id}}-Valid_values" value="{{.Valid_values}}"/>
       </div>
       <div class="col half">
-        {{ widget_select (print "Fields-"  .Type_field_id "-Ui_section") "Section" .Ui_section $.uisections `class=" w3-border"` }}
+        {{ widget_select (print "Fields-"  .Type_field_id "-Ui_section") "Section" .Ui_section $.uisections `` }}
       </div>
     </div>
 
-    <p>{{ widget_checkbox "Fields-{{.Type_field_id}}-Show_on_list" "Show on list" "1" .Show_on_list }}</p>
+    <p>{{ widget_checkbox (print "Fields-" .Type_field_id "-Show_on_list") "Show on list" "1" .Show_on_list }}</p>
-    <p>{{ widget_checkbox "Fields-{{.Type_field_id}}-Show_on_view" "Show on view" "1" .Show_on_view }}</p>
+    <p>{{ widget_checkbox (print "Fields-" .Type_field_id "-Show_on_view") "Show on view" "1" .Show_on_view }}</p>
-    <p>{{ widget_checkbox "Fields-{{.Type_field_id}}-Is_multiple" "Multiple" "1" .Is_multiple }}</p>
+    <p>{{ widget_checkbox (print "Fields-" .Type_field_id "-Is_multiple") "Multiple" "1" .Is_multiple }}</p>
 
     <input type="hidden" id="Fields-{{.Type_field_id}}-ToRemove" name="Fields-{{.Type_field_id}}-ToRemove" value=""/>
   </div>

assets/templates/types/list.tmpl

@@ -1,43 +1,25 @@
 {{define "types:list"}}
-<div
+<div id="all_types_search" hidden>
-  id="all_types_search"
+  <div class="panel-search">
-  class="w3-panel w3-border w3-round-large w3-display-container"
+  <form method="POST" hx-post="/types" hx-target="#types">
-  style="display: none"
+    <div class="row">
->
+      <div class="col half" style="padding-right: 4px">
-  <form
-    class="w3-container"
-    method="POST"
-    hx-post="/types"
-    hx-target="#types"
-  >
-    <input type="hidden" name="csrf_token" value="{{.CSRFToken}}" />
-    <div class="w3-row">
-      <div class="w3-half" style="padding-right: 4px">
         <label for="type-title">Title</label>
-        <input
+        <input name="Title" id="type-title" type="text" value=""/>
-          name="Title"
-          class=" w3-border"
-          id="type-title"
-          type="text"
-          value=""
-        />
       </div>
     </div>
-    <div class="w3-bar" style="padding-top: 8px; padding-bottom: 8px">
+    <div class="bar" style="padding-top: 8px; padding-bottom: 8px"><button type="submit" class="main"><i class="bi bi-search"></i> Find</button></div>
-      <button type="submit" class="w3-btn w3-metro-dark-blue w3-round-large">
-        <i class="bi bi-search"></i> Find
-      </button>
-    </div>
   </form>
+  </div>
 </div>
 <div id="types" class="list" style="overflow-x:auto;">
-  <table class="table-all w3-striped">
+  <table class="table-all striped">
     <thead>
       <tr>
         <th>Title</th>
         <th class="operations">
           <a class="button" hx-get="/type/create" hx-push-url="true" hx-target="#page-content"><i class="bi bi-plus-circle"></i></a>
-          <a class="button" href="#" _="on click toggle the *display of #all_types_search"><i class="bi bi-search"></i></a>
+          <a class="button" href="#" onclick="bm_toggle_visibility_list_search('all_types_search'); return false;"><i class="bi bi-search"></i></a>
         </th>
       </tr>
     </thead>