Fisrt steps to remove w3css and introduce simolecss

This commit is contained in:
roberto 2024-10-17 18:53:03 +02:00
parent 584c6aaa8f
commit 6e5f4d4966
11 changed files with 856 additions and 503 deletions

File diff suppressed because it is too large Load Diff

View File

@ -1,4 +1,4 @@
if (typeof(registerServiceWorker) == undefined) { if (typeof(registerServiceWorker) === undefined) {
const registerServiceWorker = async () => { const registerServiceWorker = async () => {
if ("serviceWorker" in navigator) { if ("serviceWorker" in navigator) {
try { try {
@ -31,7 +31,7 @@ if (typeof(_bm_yDown) == undefined) {
function bm_toggle_dropdown(list_id) { function bm_toggle_dropdown(list_id) {
var list = document.getElementById(list_id); var list = document.getElementById(list_id);
if (list.className.indexOf("w3-show") == -1) { if (list.className.indexOf("w3-show") === -1) {
list.className += " w3-show"; list.className += " w3-show";
} else { } else {
list.className = list.className.replace(" w3-show", ""); list.className = list.className.replace(" w3-show", "");
@ -143,12 +143,9 @@ function bm_toggle_quickbox() {
function bm_show_confirm(sender, title, message) { function bm_show_confirm(sender, title, message) {
document.querySelector("#modal-confirm-dialog h5").innerHTML = title; document.querySelector("#modal-confirm-dialog h5").innerHTML = title;
document.querySelector("#modal-confirm-dialog p").innerHTML = message; document.querySelector("#modal-confirm-dialog p").innerHTML = message;
let btn_ok = document.getElementById("modal-confirm-ok");
btn_ok = document.getElementById("modal-confirm-ok");
btn_ok.outerHTML = btn_ok.outerHTML;
document.getElementById("modal-confirm-ok").addEventListener('click', (event) => { document.getElementById("modal-confirm-ok").addEventListener('click', (event) => {
htmx.trigger(sender, 'confirmed'); htmx.trigger(sender, 'confirmed', null);
document.getElementById("modal-confirm-dialog").style.display = "none"; document.getElementById("modal-confirm-dialog").style.display = "none";
}); });
@ -156,11 +153,11 @@ function bm_show_confirm(sender, title, message) {
} }
function bm_item_field_add(type_field_id, widget) { function bm_item_field_add(type_field_id, widget) {
template = Handlebars.templates['items/field-' + widget] let template = Handlebars.templates['items/field-' + widget]
fields_list = document.getElementById('fields-' + type_field_id); let fields_list = document.getElementById('fields-' + type_field_id);
counter = parseInt(document.getElementById('fields-' + type_field_id + '-counter').innerHTML); let counter = parseInt(document.getElementById('fields-' + type_field_id + '-counter').innerHTML);
fields_list.insertAdjacentHTML('beforeend', template({type_field_id:type_field_id,counter:counter, value:""})); fields_list.insertAdjacentHTML('beforeend', template({type_field_id:type_field_id,counter:counter, value:""}));
document.getElementById('fields-' + type_field_id + '-counter').innerHTML = counter + 1; document.getElementById('fields-' + type_field_id + '-counter').innerHTML = (counter + 1).toString();
} }
document.addEventListener("DOMContentLoaded", function(event){ document.addEventListener("DOMContentLoaded", function(event){

View File

@ -1,4 +1,4 @@
const cacheVersion = "0.271" const cacheVersion = "0.281"
const cacheName = "speedtech-brainminder" const cacheName = "speedtech-brainminder"
const cacheFiles = [ const cacheFiles = [
'/static/bootstrap-icons/font/bootstrap-icons.min.css', '/static/bootstrap-icons/font/bootstrap-icons.min.css',

View File

@ -72,7 +72,7 @@
<div id="modal-confirm-dialog" class="w3-modal" style="display: none;"> <div id="modal-confirm-dialog" class="w3-modal" style="display: none;">
<div id="modal-confirm-dialog-content" class="w3-modal-content w3-round-large w3-padding w3-animate-top"> <div id="modal-confirm-dialog-content" class="w3-modal-content w3-round-large w3-padding w3-animate-top">
<header class="w3-container" style="margin-bottom: 20px;"> <header class="w3-container">
<span _="on click hide #modal-confirm-dialog" <span _="on click hide #modal-confirm-dialog"
class="w3-button w3-small w3-round-large w3-display-topright" style="margin-top: 2px; margin-right: 8px; padding: 8px;"><i class='bi bi-x-circle-fill'></i></span> class="w3-button w3-small w3-round-large w3-display-topright" style="margin-top: 2px; margin-right: 8px; padding: 8px;"><i class='bi bi-x-circle-fill'></i></span>
<h5></h5> <h5></h5>

View File

@ -39,21 +39,15 @@
<div class="w3-half"> <div class="w3-half">
<p> <p>
<label for="item-title">Title</label> <label for="item-title">Title</label>
<input <input name="Title" id="item-title" type="text" value="{{.item.Title}}" style="width: 100%"/>
name="Title"
class="w3-input w3-border"
id="item-title"
type="text"
value="{{.item.Title}}"
/>
</p> </p>
<p> <p>
{{ widget_select "Type_id" "Type" .item.Type_id .types `class="w3-input w3-border"` }} {{ widget_select "Type_id" "Type" .item.Type_id .types `style="width: 100%"` }}
</p> </p>
</div> </div>
<div class="w3-half"> <div class="w3-half">
<p> <p>
{{ widget_checkboxes "Notebooks" "Notebooks" .item.Notebooks .notebooks `class="w3-check"` }} {{ widget_checkboxes "Notebooks" "Notebooks" .item.Notebooks .notebooks `` }}
</p> </p>
</div> </div>
</div> </div>
@ -65,14 +59,7 @@
{{ if eq .item.Type_show_summary 1}} {{ if eq .item.Type_show_summary 1}}
<p> <p>
<label for="item-summary">Summary</label> <label for="item-summary">Summary</label>
<textarea <textarea name="Summary" id="item-summary" type="text" rows="5">{{.item.Summary}}</textarea>
name="Summary"
class="w3-input w3-border"
id="item-summary"
type="text"
rows="5"
>{{.item.Summary}}</textarea
>
</p> </p>
{{ end }} {{ end }}
@ -93,40 +80,21 @@
<div class="w3-half"> <div class="w3-half">
<p> <p>
<label for="item-tags">Tags</label> <label for="item-tags">Tags</label>
<input <input name="Tags" id="item-tags" type="text" value="{{.item.Tags}}" style="width: 100%" />
name="Tags"
class="w3-input w3-border"
id="item-tags"
type="text"
value="{{.item.Tags}}"
/>
</p> </p>
</div> </div>
<div class="w3-half"> <div class="w3-half">
<p> <p>
{{ widget_slim_select "Categories" "Categories" .item.Categories .categories `multiple="true" class="w3-input w3-border"` }} {{ widget_slim_select "Categories" "Categories" .item.Categories .categories `multiple="true"` }}
</p> </p>
</div> </div>
</div> </div>
<p> <p>
<label class="switch"> <label>
<input <input id="on_dashboard" name="On_dashboard" type="checkbox" value="1" {{if eq .item.On_dashboard 1}} checked="checked" {{end}} />
id="on_dashboard" On dashboard
class="w3-check" </label>
name="On_dashboard"
type="checkbox"
value="1"
{{if
eq
.item.On_dashboard
1
}}
checked="checked"
{{end}}
/>
<span class="slider round"></span>
</label><label for="on_dashboard" class="label-checkbox">On dashboard</label>
</p> </p>
</div> </div>
@ -150,7 +118,6 @@
<div class="w3-row"> <div class="w3-row">
<div class="w3-col l6 m9 s10"> <div class="w3-col l6 m9 s10">
<input <input
class="w3-input w3-border"
id="search-item-relation" id="search-item-relation"
name="SearchText" name="SearchText"
type="text" type="text"

View File

@ -20,7 +20,7 @@
{{ template "item:relations_view" .}} {{ template "item:relations_view" .}}
<div class="w3-row" style="margin-bottom: 20px"> <div class="w3-row">
<div class="w3-half"> <div class="w3-half">
{{if gt (len .item.Categories) 0 }} {{if gt (len .item.Categories) 0 }}
<i class="w3-hide-medium w3-hide-large bi bi-tags-fill"></i> <i class="w3-hide-medium w3-hide-large bi bi-tags-fill"></i>

View File

@ -1,7 +1,7 @@
{{define "page:content"}} {{define "page:content"}}
<div id="modal" class="w3-modal"> <div id="modal" class="w3-modal">
<div class="w3-modal-content w3-round-large"> <div class="w3-modal-content w3-round-large">
<header class="w3-container w3-padding" style="margin-bottom: 20px; font-weight: bold;"> <header class="w3-container" style="margin-bottom: 20px; font-weight: bold;">
<span _="on click remove #modal" <span _="on click remove #modal"
class="w3-button w3-round-large w3-display-topright" style="margin-top: 2px; margin-right: 2px;"><i class='bi bi-x-circle-fill'></i></span> class="w3-button w3-round-large w3-display-topright" style="margin-top: 2px; margin-right: 2px;"><i class='bi bi-x-circle-fill'></i></span>
<h5><i class="{{.item.Type_icon}}" title="{{.item.Type_title}}"></i> {{.item.Type_title}} : {{.item.Title}}</h5> <h5><i class="{{.item.Type_icon}}" title="{{.item.Type_title}}"></i> {{.item.Type_title}} : {{.item.Title}}</h5>

View File

@ -1,4 +1,4 @@
{{define "partial:notebooks-list"}} {{define "partial:notebooks-list"}}
{{ widget_select "current_notebook_id" "" .current_notebook_id .notebooksList `hx-on:change="bm_sidebar_click('main-sidebar')" hx-post="/" hx-push-url="true" hx-target="#page-content" hx-trigger="change" id="current_notebook_id" class="w3-input w3-border"` }} {{ widget_select "current_notebook_id" "" .current_notebook_id .notebooksList `hx-on:change="bm_sidebar_click('main-sidebar')" hx-post="/" hx-push-url="true" hx-target="#page-content" hx-trigger="change" id="current_notebook_id" style="width: 100%"` }}
{{ end }} {{ end }}

View File

@ -17,23 +17,11 @@
<div id="main-sidebar-content"> <div id="main-sidebar-content">
<div class="w3-bar-block w3-container" id="searchSidebar"> <div class="w3-bar-block w3-container" id="searchSidebar">
<form <form method="POST" hx-post="/items/search" hx-target="#page-content" hx-push-url="true" hx-on:submit="bm_sidebar_click('main-sidebar')">
method="POST"
hx-post="/items/search"
hx-target="#page-content"
hx-push-url="true"
hx-on:submit="bm_sidebar_click('main-sidebar')"
>
<input type="hidden" name="csrf_token" value="{{.CSRFToken}}" /> <input type="hidden" name="csrf_token" value="{{.CSRFToken}}" />
<div class="w3-row"> <div class="w3-row">
<div class="threequarter"> <div class="threequarter">
<input <input type="text" id="searchText" name="SearchText" placeholder="Search.." />
type="text"
id="searchText"
name="SearchText"
class="w3-input"
placeholder="Search.."
/>
</div> </div>
<div class="quarter"> <div class="quarter">
<button type="submit" class="w3-right w3-button w3-round-large w3-metro-dark-blue" style="padding: 4px 8px; margin-top: 5px; margin-right: 8px;"><i class='bi bi-search'></i></button> <button type="submit" class="w3-right w3-button w3-round-large w3-metro-dark-blue" style="padding: 4px 8px; margin-top: 5px; margin-right: 8px;"><i class='bi bi-search'></i></button>
@ -43,7 +31,7 @@
</div> </div>
<div class="w3-container"> <div class="w3-container">
<h6 class="w3-text-metro-dark-blue"> <h5 class="w3-text-metro-dark-blue">
<a <a
hx-get="/" hx-get="/"
hx-target="#page-content" hx-target="#page-content"
@ -53,11 +41,11 @@
> >
<i class="bi bi-speedometer"></i> Dashboard <i class="bi bi-speedometer"></i> Dashboard
</a> </a>
</h6> </h5>
<h6 class="w3-text-metro-dark-blue"> <h5 class="w3-text-metro-dark-blue">
<i class="bi bi-journals"></i> Notebook <i class="bi bi-journals"></i> Notebook
</h6> </h5>
<form method="POST" action="/" hx-post="/" hx-push-url="true" hx-target="#page-content"> <form method="POST" action="/" hx-post="/" hx-push-url="true" hx-target="#page-content">
<input type="hidden" name="csrf_token" value="{{.CSRFToken}}" /> <input type="hidden" name="csrf_token" value="{{.CSRFToken}}" />
{{template "partial:notebooks-list" . }} {{template "partial:notebooks-list" . }}
@ -65,9 +53,9 @@
</div> </div>
<div class="w3-container"> <div class="w3-container">
<h6 class="w3-text-metro-dark-blue accordion" onclick="bm_toggle_visibility('types_menu')"> <h5 class="w3-text-metro-dark-blue accordion" onclick="bm_toggle_visibility('types_menu')">
<i class="bi bi-list-task"></i> Items <i class='w3-right bi bi-caret-down-fill types_menu'></i><i class='w3-right bi bi-caret-up-fill hidden types_menu'></i> <i class="bi bi-list-task"></i> Items <i class='w3-right bi bi-caret-down types_menu'></i><i class='w3-right bi bi-caret-up hidden types_menu'></i>
</h6> </h5>
</div> </div>
<div id="types_menu" class="w3-bar-block w3-margin-left w3-margin-right hidden"> <div id="types_menu" class="w3-bar-block w3-margin-left w3-margin-right hidden">
{{template "partial:types-list" . }} {{template "partial:types-list" . }}
@ -84,9 +72,9 @@
</div> </div>
<div class="w3-container"> <div class="w3-container">
<h6 class="w3-text-metro-dark-blue accordion" onclick="bm_toggle_visibility('settings_menu')"> <h5 class="w3-text-metro-dark-blue accordion" onclick="bm_toggle_visibility('settings_menu')">
<i class="bi bi-gear-fill"></i> Settings <i class='w3-right bi bi-caret-down-fill settings_menu'></i><i class='w3-right bi bi-caret-up-fill hidden settings_menu'></i> <i class="bi bi-gear-fill"></i> Settings <i class='w3-right bi bi-caret-down settings_menu'></i><i class='w3-right bi bi-caret-up hidden settings_menu'></i>
</h6> </h5>
</div> </div>
<div id="settings_menu" class="w3-bar-block w3-margin-left w3-margin-right hidden"> <div id="settings_menu" class="w3-bar-block w3-margin-left w3-margin-right hidden">
<a <a
@ -118,9 +106,9 @@
</a> </a>
</div> </div>
<div class="w3-container"> <div class="w3-container">
<h6 class="w3-text-metro-dark-blue"> <h5 class="w3-text-metro-dark-blue">
<a href="/logout"><i class="bi bi-box-arrow-left"></i></i> Logout</a> <a href="/logout"><i class="bi bi-box-arrow-left"></i></i> Logout</a>
</h6> </h5>
</div> </div>
</div> </div>
</nav> </nav>

View File

@ -41,13 +41,11 @@
hx-get="/type/create" hx-get="/type/create"
hx-push-url="true" hx-push-url="true"
hx-target="#page-content" hx-target="#page-content"
><i class="bi bi-plus-circle"></i ><i class="bi bi-plus-circle"></i></a>
></a>
<a <a
class="w3-button w3-small w3-border w3-round-large w3-metro-blue" class="w3-button w3-small w3-border w3-round-large w3-metro-blue"
href="#" href="#"
_="on click toggle the *display of #all_types_search"><i class="bi bi-search"></i _="on click toggle the *display of #all_types_search"><i class="bi bi-search"></i></a>
></a>
</th> </th>
</tr> </tr>
</thead> </thead>
@ -56,15 +54,7 @@
range .types range .types
}} }}
<tr> <tr>
<td class="title" data-label="Title"> <td class="title" data-label="Title">{{.Title}}</td>
<a
href="/type/read/{{.Id}}"
hx-get="/type/read/{{.Id}}"
hx-push-url="true"
hx-target="#page-content"
><i class="{{.Icon}}"></i> {{.Title}}</a
>
</td>
<td class="w3-right-align"> <td class="w3-right-align">
<button <button
class="w3-button w3-edit w3-small w3-border w3-round-large" class="w3-button w3-edit w3-small w3-border w3-round-large"

View File

@ -351,7 +351,7 @@ func widget_relation_type(name string, value string, attributes string) template
} }
func widget_select(name string, label string, value any, options []WidgetOption, attributes string) template.HTML { func widget_select(name string, label string, value any, options []WidgetOption, attributes string) template.HTML {
return render_select(name, label, value, options, attributes, "w3-input w3-border") return render_select(name, label, value, options, attributes, "")
} }
func widget_slim_select(name string, label string, value any, options []WidgetOption, attributes string) template.HTML { func widget_slim_select(name string, label string, value any, options []WidgetOption, attributes string) template.HTML {
@ -428,8 +428,9 @@ func widget_checkboxes(name string, label string, value any, options []WidgetOpt
} }
id_str := strings.ReplaceAll(name+"-"+option.Key, " ", "-") id_str := strings.ReplaceAll(name+"-"+option.Key, " ", "-")
o = o + "<p>" o = o + "<p>"
o = o + fmt.Sprintf(`<label class="switch"><input id="%v" type="checkbox" name="%v" %v value="%v" %v /><span class="slider round"></span></label>`, id_str, name, checked, option.Key, attributes) //o = o + fmt.Sprintf(`<label class="switch"><input id="%v" type="checkbox" name="%v" %v value="%v" %v /><span class="slider round"></span></label>`, id_str, name, checked, option.Key, attributes)
o = o + fmt.Sprintf(`<label class="label-checkbox" for="%v">%v</label>`, id_str, option.Value) o = o + fmt.Sprintf(`<label><input id="%v" type="checkbox" name="%v" %v value="%v" %v />%v</label>`, id_str, name, checked, option.Key, attributes, option.Value)
//o = o + fmt.Sprintf(`<label class="label-checkbox" for="%v">%v</label>`, id_str, option.Value)
o = o + "</p>" o = o + "</p>"
} }
o = o + "</fiedlset>" o = o + "</fiedlset>"
@ -441,7 +442,7 @@ func widget_text(name string, label string, value string, attributes string) tem
if len(label) > 0 { if len(label) > 0 {
o = o + fmt.Sprintf(`<label for="%v">%v</label>`, name, label) o = o + fmt.Sprintf(`<label for="%v">%v</label>`, name, label)
} }
o = o + fmt.Sprintf(`<input id="%v" type="text" name="%v" value="%v" class="w3-input w3-border" %v />`, name, name, value, attributes) o = o + fmt.Sprintf(`<input id="%v" type="text" name="%v" value="%v" %v />`, name, name, value, attributes)
return template.HTML(o) return template.HTML(o)
} }
@ -450,7 +451,7 @@ func widget_url(name string, label string, value string, attributes string) temp
if len(label) > 0 { if len(label) > 0 {
o = o + fmt.Sprintf(`<label for="%v">%v</label>`, name, label) o = o + fmt.Sprintf(`<label for="%v">%v</label>`, name, label)
} }
o = o + fmt.Sprintf(`<input id="%v" type="url" name="%v" value="%v" class="w3-input w3-border" %v />`, name, name, value, attributes) o = o + fmt.Sprintf(`<input id="%v" type="url" name="%v" value="%v" %v />`, name, name, value, attributes)
return template.HTML(o) return template.HTML(o)
} }