roberto/BrainMinder
1
0
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

CSS reworking

Browse Source
This commit is contained in:
roberto 2024-11-17 20:12:20 +01:00
parent 3d2ca9b09e
commit 478ef78b76
22 changed files with 186 additions and 222 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

130
assets/static/css/main.css
View File

@ -84,6 +84,101 @@ body {
min-height: 100vh;
}
.display-topleft {
position: absolute;
left: 0;
top: 0
}
.display-topright {
position: absolute;
right: 0;
top: 0
}
.display-bottomleft {
position: absolute;
left: 0;
bottom: 0
}
.display-bottomright {
position: absolute;
right: 0;
bottom: 0
}
.display-middle {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%)
}
.display-left {
position: absolute;
top: 50%;
left: 0%;
transform: translate(0%, -50%);
-ms-transform: translate(-0%, -50%)
}
.display-right {
position: absolute;
top: 50%;
right: 0%;
transform: translate(0%, -50%);
-ms-transform: translate(0%, -50%)
}
.display-topmiddle {
position: absolute;
left: 50%;
top: 0;
transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%)
}
.display-bottommiddle {
position: absolute;
left: 50%;
bottom: 0;
transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%)
}
.display-container:hover .display-hover {
display: block
}
.display-container:hover span.display-hover {
display: inline-block
}
.display-hover {
display: none
}
.display-position {
position: absolute
}
ul {
list-style-type: none;
padding: 0;
margin: 0
}
ul li {
padding: 8px 16px;
border-bottom: 1px solid #ddd
}
ul li:last-child {
border-bottom: none
}
.row:after {
content:"";
display:table;
@ -147,6 +242,14 @@ fieldset {
width: auto;
}
input {
padding: 2px;
display: block;
border: none;
border-bottom: 1px solid #ccc;
width: 100%
}
input[type='checkbox'],
input[type='radio'] {
width: 18px;
@ -187,7 +290,7 @@ input[type='radio'] {
}
.hoverable tbody tr:hover,
.ul.w3-hoverable li:hover {
.ul.hoverable li:hover {
background-color: #ccc
}
@ -209,13 +312,38 @@ input[type='radio'] {
padding-left: 16px
}
.card {
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)
}
.hover-shadow:hover {
box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19)
}
#page-main {
transition: margin-left .4s;
width: 100%;
}
#form-login-container {
position: relative;
}
#form-login {
width: 600px;
background-color: var(--primary-color);
color: #ffffff;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
border-radius: 4px;
padding: 12px 24px !important;
}
#form-login input {
border: 1px solid #ccc !important
}
#main-sidebar {

164
assets/static/css/orig.css
View File

@ -29,21 +29,6 @@
border-radius: 50%
}
.w3-ul {
list-style-type: none;
padding: 0;
margin: 0
}
.w3-ul li {
padding: 8px 16px;
border-bottom: 1px solid #ddd
}
.w3-ul li:last-child {
border-bottom: none
}
.w3-tooltip,
.w3-display-container {
position: relative
@ -65,65 +50,6 @@
transition: opacity 0s
}
.w3-input {
padding: 2px;
display: block;
border: none;
border-bottom: 1px solid #ccc;
width: 100%
}
.w3-select {
padding: 9px 0;
width: 100%;
border: none;
border-bottom: 1px solid #ccc
}
.w3-dropdown-click,
.w3-dropdown-hover {
position: relative;
display: inline-block;
cursor: pointer
}
.w3-dropdown-hover:hover .w3-dropdown-content {
display: block
}
.w3-dropdown-hover:first-child,
.w3-dropdown-click:hover {
background-color: #ccc;
color: #000
}
.w3-dropdown-hover:hover>.w3-button:first-child,
.w3-dropdown-click:hover>.w3-button:first-child {
background-color: #ccc;
color: #000
}
.w3-dropdown-content {
cursor: auto;
color: #000;
background-color: #fff;
display: none;
position: absolute;
min-width: 160px;
margin: 0;
padding: 0;
z-index: 1
}
.w3-check,
.w3-radio {
width: 18px;
height: 18px;
position: relative;
top: 6px;
accent-color: #2b5797;
}
.w3-bar-block .w3-dropdown-hover,
.w3-bar-block .w3-dropdown-click {
width: 100%
@ -565,86 +491,6 @@
z-index: 4;
}
.w3-display-topleft {
position: absolute;
left: 0;
top: 0
}
.w3-display-topright {
position: absolute;
right: 0;
top: 0
}
.w3-display-bottomleft {
position: absolute;
left: 0;
bottom: 0
}
.w3-display-bottomright {
position: absolute;
right: 0;
bottom: 0
}
.w3-display-middle {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%)
}
.w3-display-left {
position: absolute;
top: 50%;
left: 0%;
transform: translate(0%, -50%);
-ms-transform: translate(-0%, -50%)
}
.w3-display-right {
position: absolute;
top: 50%;
right: 0%;
transform: translate(0%, -50%);
-ms-transform: translate(0%, -50%)
}
.w3-display-topmiddle {
position: absolute;
left: 50%;
top: 0;
transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%)
}
.w3-display-bottommiddle {
position: absolute;
left: 50%;
bottom: 0;
transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%)
}
.w3-display-container:hover .w3-display-hover {
display: block
}
.w3-display-container:hover span.w3-display-hover {
display: inline-block
}
.w3-display-hover {
display: none
}
.w3-display-position {
position: absolute
}
.w3-circle {
border-radius: 50%
}
@ -690,16 +536,6 @@
margin-bottom: 4px
}
.w3-card,
.w3-card-2 {
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)
}
.w3-card-4,
.w3-hover-shadow:hover {
box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19)
}
.w3-spin {
animation: w3-spin 2s infinite linear
}

2
assets/templates/base.tmpl
View File

@ -92,7 +92,7 @@
<form method="POST">
<div class="w3-row">
<div class="w3-col w3-right button"><button type="button" hx-validate="true" hx-post="/quickbox/add" hx-target="#quickbox-notes" hx-swap="beforeend" class="w3-bar-item w3-right w3-round-large" id="quickbox-send"><i class='bi bi-caret-right-square-fill' style="margin-top: 4px;"></i></button></div>
<div class="w3-rest textarea"><textarea required class="w3-input w3-border w3-round-large" id="quickbox-note" style="resize: none;" name="Note"></textarea></div>
<div class="w3-rest textarea"><textarea required class=" w3-border w3-round-large" id="quickbox-note" style="resize: none;" name="Note"></textarea></div>
</div>
</form>
</div>

2
assets/templates/categories/form.tmpl
View File

@ -9,7 +9,7 @@
<label for="category-name">Name</label>
<input
name="Name"
class="w3-input w3-border"
class=" w3-border"
id="category-name"
type="text"
value="{{.category.Name}}"

2
assets/templates/categories/list.tmpl
View File

@ -16,7 +16,7 @@
<label for="category-name">Name</label>
<input
name="Name"
class="w3-input w3-border"
class=" w3-border"
id="category-name"
type="text"
value=""

2
assets/templates/items/add_relation.tmpl
View File

@ -30,7 +30,7 @@
{{ end }}
{{ end }}
</td>
<td class="no-label">{{ widget_relation_type $relation_name "Link" `id="$relation_name" class="w3-input w3-border"` }}</td>
<td class="no-label">{{ widget_relation_type $relation_name "Link" `id="$relation_name" class=" w3-border"` }}</td>
<td class="no-label">
<div class="w3-bar">
<a

6
assets/templates/items/all_list.tmpl
View File

@ -16,7 +16,7 @@
<label for="item-title">Title</label>
<input
name="Title"
class="w3-input w3-border"
class=" w3-border"
id="item-title"
type="text"
value=""
@ -26,7 +26,7 @@
<label for="item-title">Category</label>
<input
name="Category"
class="w3-input w3-border"
class=" w3-border"
id="item-category"
type="text"
value=""
@ -36,7 +36,7 @@
<label for="item-tags">Tags</label>
<input
name="Keywords"
class="w3-input w3-border"
class=" w3-border"
id="item-tags"
type="text"
value=""

2
assets/templates/items/form.tmpl
View File

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

6
assets/templates/items/list.tmpl
View File

@ -16,7 +16,7 @@
<label for="item-title">Title</label>
<input
name="Title"
class="w3-input w3-border"
class=" w3-border"
id="item-title"
type="text"
value=""
@ -26,7 +26,7 @@
<label for="item-title">Category</label>
<input
name="Category"
class="w3-input w3-border"
class=" w3-border"
id="item-category"
type="text"
value=""
@ -36,7 +36,7 @@
<label for="item-tags">Tags</label>
<input
name="Tags"
class="w3-input w3-border"
class=" w3-border"
id="item-tags"
type="text"
value=""

2
assets/templates/items/read.tmpl
View File

@ -11,7 +11,7 @@
{{.item.Description_rendered | safeHTML}}
{{ if gt (len .fields) 0}}
<ul class="w3-ul fields">
<ul class="fields">
{{ range .fields }}
<li><span style="font-weight: bold;">{{.Title}}</span> : {{ renderFieldValue .Value .Widget}}</li>
{{ end }}

2
assets/templates/items/relations.tmpl
View File

@ -59,7 +59,7 @@
{{ end }}
{{ end }}
</td>
<td class="no-label {{$relation_name}}-Col">{{ widget_relation_type $relation_name $relation_type `id="$relation_name" class="w3-input w3-border"` }}</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">
<div class="w3-bar">
<button

2
assets/templates/items/relations_view.tmpl
View File

@ -2,7 +2,7 @@
{{ if (gt (len .relations) 0) }}
<fieldset class="w3-round-large" style="margin-bottom: 40px">
<legend>Relations</legend>
<ul class="w3-ul">
<ul>
{{
range.relations
}}

10
assets/templates/items/share.tmpl
View File

@ -14,7 +14,7 @@
<label for="share-start-datetime">Start date time</label>
<input
name="start-datetime"
class="w3-input w3-border"
class=" w3-border"
id="share-start-datetime"
type="datetime-local"
value=""
@ -26,7 +26,7 @@
<label for="share-end-datetime">End date time</label>
<input
name="end-datetime"
class="w3-input w3-border"
class=" w3-border"
id="share-end-datetime"
type="datetime-local"
value=""
@ -58,7 +58,7 @@
<label for="share-password">Password</label>
<input
name="password"
class="w3-input w3-border"
class=" w3-border"
id="share-password"
type="password"
value=""
@ -72,7 +72,7 @@
<div class="w3-col l6">
<p>
<label class="switch">
<input class="w3-check" name="read" type="checkbox" value="1" checked="checked">
<input class="" name="read" type="checkbox" value="1" checked="checked">
<span class="slider round"></span>
</label><span class="label-checkbox">Read</span>
</p>
@ -80,7 +80,7 @@
<div class="w3-col l6">
<p>
<label class="switch">
<input class="w3-check" name="edit" type="checkbox" value="1">
<input class="" name="edit" type="checkbox" value="1">
<span class="slider round"></span>
</label><span class="label-checkbox">Edit</span>
</p>

2
assets/templates/items/view.tmpl
View File

@ -18,7 +18,7 @@
{{.item.Description_rendered | safeHTML}}
{{ if gt (len .fields) 0}}
<ul class="w3-ul fields">
<ul class="fields">
{{ range .fields }}
<li><span style="font-weight: bold;">{{.Title}}</span> : {{ renderFieldValue .Value .Widget}}</li>
{{ end }}

6
assets/templates/notebooks/form.tmpl
View File

@ -10,7 +10,7 @@
<label for="notebook-title">Title</label>
<input
name="Title"
class="w3-input w3-border"
class=" w3-border"
id="notebook-title"
type="text"
value="{{.notebook.Title}}"
@ -21,7 +21,7 @@
<label for="type-icon">Icon</label>
<input
name="Icon"
class="w3-input w3-border"
class=" w3-border"
id="notebook-icon"
type="text"
value="{{.notebook.Icon}}"
@ -32,7 +32,7 @@
<label for="type-description">Description</label>
<textarea
name="Description"
class="w3-input w3-border"
class=" w3-border"
id="notebook-description"
type="text"
rows="5"

2
assets/templates/notebooks/list.tmpl
View File

@ -16,7 +16,7 @@
<label for="notebook-title">Title</label>
<input
name="Title"
class="w3-input w3-border"
class=" w3-border"
id="notebook-title"
type="text"
value=""

8
assets/templates/pages/login.tmpl
View File

@ -2,18 +2,18 @@
{{define "page:content"}}
<div class="w3-display-container" style="min-height: 400px;">
<div id="form-login" class="w3-display-middle w3-card-4 w3-padding-large w3-metro-dark-blue w3-round-medium">
<div id="form-login-container" style="min-height: 400px;">
<div id="form-login">
<h2 class="w3-center"><img src="/static/img/brainminder.svg" style="height: 50px; padding-right: 10px;" /><span style="font-weight: bold;">B</span>rain<span style="font-weight: bold;">M</span>inder</h2>
<form method="POST" action="/login">
<input type="hidden" name="csrf_token" value="{{.CSRFToken}}" />
<p>
<label for="email">Email:</label>
<input class="w3-input w3-border" id="email" type="email" name="Email" value="{{.Form.Email}}" />
<input id="email" type="email" name="Email" value="{{.Form.Email}}" />
</p>
<p>
<label for="password">Password:</label>
<input class="w3-input w3-border" id="password" type="password" name="Password" />
<input id="password" type="password" name="Password" />
</p>
<button class="w3-block w3-btn w3-metro-light-blue w3-round-medium" style="margin-top: 50px; margin-bottom: 20px;"><i class='bi bi-lock'></i> Login</button>
</form>

14
assets/templates/quickbox/transform.tmpl
View File

@ -12,7 +12,7 @@
<label for="item-title">Title</label>
<input
name="Title"
class="w3-input w3-border"
class=" w3-border"
id="item-title"
type="text"
value=""
@ -21,12 +21,12 @@
<div class="w3-row">
<div class="w3-half" style="padding-right: 4px">
<p>
{{ widget_select "Type_id" "Type" 0 .types `class="w3-input w3-border"` }}
{{ widget_select "Type_id" "Type" 0 .types `class=" w3-border"` }}
</p>
</div>
<div class="w3-half" style="padding-left: 4px">
<p>
{{ widget_checkboxes "Notebooks" "Notebooks" "" .notebooks `class="w3-check"` }}
{{ widget_checkboxes "Notebooks" "Notebooks" "" .notebooks `class=""` }}
</p>
</div>
</div>
@ -36,7 +36,7 @@
<label for="item-tags">Tags</label>
<input
name="Tags"
class="w3-input w3-border"
class=" w3-border"
id="item-tags"
type="text"
value=""
@ -45,7 +45,7 @@
</div>
<div class="w3-half" style="padding-left: 4px">
<p>
{{ widget_select "Categories" "Categories" "" .categories `multiple="true" class="w3-input w3-border"` }}
{{ widget_select "Categories" "Categories" "" .categories `multiple="true" class=" w3-border"` }}
</p>
</div>
</div>
@ -53,7 +53,7 @@
<label for="item-description">Description</label>
<textarea
name="Description"
class="w3-input w3-border"
class=" w3-border"
id="item-description"
type="text"
rows="5"
@ -63,7 +63,7 @@
<p>
<label class="switch">
<input
class="w3-check"
class=""
name="Keep_in_quickbox"
type="checkbox"
value="1"

16
assets/templates/types/field_new.tmpl
View File

@ -6,12 +6,12 @@
>
<div class="w3-row">
<div class="w3-half">
{{ widget_select (print "Fields-New-" .counter "-Widget_id") "Widget" "" .widgets `class="w3-input w3-border"` }}
{{ widget_select (print "Fields-New-" .counter "-Widget_id") "Widget" "" .widgets `class=" w3-border"` }}
</div>
<div class="w3-half">
<label for="Fields-New-{{.counter}}-Title">Title</label>
<input
class="w3-input w3-border"
class=" w3-border"
type="text"
id="Fields-New-{{.counter}}-Title"
name="Fields-New-{{.counter}}-Title"
@ -24,7 +24,7 @@
<div class="w3-half">
<label for="Fields-New-{{.counter}}-Attributes">Attributes</label>
<input
class="w3-input w3-border"
class=" w3-border"
type="text"
id="Fields-New-{{.counter}}-Attributes"
name="Fields-New-{{.counter}}-Attributes"
@ -34,7 +34,7 @@
<div class="w3-half">
<label for="Fields-New-{{.counter}}-Valid_values">Valid values</label>
<input
class="w3-input w3-border"
class=" w3-border"
type="text"
id="Fields-New-{{.counter}}-Valid_values"
name="Fields-New-{{.counter}}-Valid_values"
@ -48,7 +48,7 @@
<input
id="Fields-New-{{.counter}}-Show_on_list"
name="Fields-New-{{.counter}}-Show_on_list"
class="w3-check"
class=""
type="checkbox"
value="1"
/>
@ -58,7 +58,7 @@
<input
id="Fields-New-{{.counter}}-Show_on_view"
name="Fields-New-{{.counter}}-Show_on_view"
class="w3-check"
class=""
type="checkbox"
value="1"
/>
@ -68,7 +68,7 @@
<input
id="Fields-New-{{.counter}}-Is_multiple"
name="Fields-New-{{.counter}}-Is_multiple"
class="w3-check"
class=""
type="checkbox"
value="1"
/>
@ -76,7 +76,7 @@
</p>
</div>
<div class="w3-half">
{{ widget_select (print "Fields-" .Type_field_id "-Ui_section") "Section" "general" $.uisections `class="w3-input w3-border"` }}
{{ widget_select (print "Fields-" .Type_field_id "-Ui_section") "Section" "general" $.uisections `class=" w3-border"` }}
</div>
</div>
<div class="w3-bar">

14
assets/templates/types/fields.tmpl
View File

@ -4,12 +4,12 @@
<div id="Field-{{.Type_field_id}}">
<div class="w3-row">
<div class="w3-half">
{{ widget_select (print "Fields-" .Type_field_id "-Widget_id") "Widget" .Widget_id $.widgets `class="w3-input w3-border"` }}
{{ widget_select (print "Fields-" .Type_field_id "-Widget_id") "Widget" .Widget_id $.widgets `class=" w3-border"` }}
</div>
<div class="w3-half">
<label for="Fields-{{.Type_field_id}}-Title">Title</label>
<input
class="w3-input w3-border"
class=" w3-border"
type="text"
id="Fields-{{.Type_field_id}}-Title"
name="Fields-{{.Type_field_id}}-Title"
@ -24,7 +24,7 @@
>Valid values</label
>
<input
class="w3-input w3-border"
class=" w3-border"
type="text"
id="Fields-{{.Type_field_id}}-Valid_values"
name="Fields-{{.Type_field_id}}-Valid_values"
@ -32,7 +32,7 @@
/>
</div>
<div class="w3-half">
{{ widget_select (print "Fields-" .Type_field_id "-Ui_section") "Section" .Ui_section $.uisections `class="w3-input w3-border"` }}
{{ widget_select (print "Fields-" .Type_field_id "-Ui_section") "Section" .Ui_section $.uisections `class=" w3-border"` }}
</div>
</div>
<div class="w3-row">
@ -40,7 +40,7 @@
<input
id="Fields-{{.Type_field_id}}-Show_on_list"
name="Fields-{{.Type_field_id}}-Show_on_list"
class="w3-check"
class=""
type="checkbox"
value="1"
{{if eq .Show_on_list 1 }}
@ -55,7 +55,7 @@
<input
id="Fields-{{.Type_field_id}}-Show_on_view"
name="Fields-{{.Type_field_id}}-Show_on_view"
class="w3-check"
class=""
type="checkbox"
value="1"
{{if eq .Show_on_view 1 }}
@ -70,7 +70,7 @@
<input
id="Fields-{{.Type_field_id}}-Is_multiple"
name="Fields-{{.Type_field_id}}-Is_multiple"
class="w3-check"
class=""
type="checkbox"
value="1"
{{if eq .Is_multiple 1 }}

12
assets/templates/types/form.tmpl
View File

@ -29,7 +29,7 @@
<label for="type-title">Title</label>
<input
name="Title"
class="w3-input w3-border"
class=" w3-border"
id="type-title"
type="text"
value="{{.type.Title}}"
@ -39,7 +39,7 @@
<label for="type-icon">Icon</label>
<input
name="Icon"
class="w3-input w3-border"
class=" w3-border"
id="type-icon"
type="text"
value="{{.type.Icon}}"
@ -48,7 +48,7 @@
</div>
<div class="w3-half">
<p>
{{ widget_checkboxes "Notebooks" "Notebooks" .type.Notebooks .notebooks `class="w3-check"` }}
{{ widget_checkboxes "Notebooks" "Notebooks" .type.Notebooks .notebooks `class=""` }}
</p>
</div>
</div>
@ -57,7 +57,7 @@
<label for="type-description">Description</label>
<textarea
name="Description"
class="w3-input w3-border"
class=" w3-border"
id="type-description"
type="text"
rows="5"
@ -69,7 +69,7 @@
<label class="switch">
<input
id="show_summary"
class="w3-check"
class=""
name="Show_summary"
type="checkbox"
value="1"
@ -85,7 +85,7 @@
<label class="switch">
<input
id="show_description"
class="w3-check"
class=""
name="Show_description"
type="checkbox"
value="1"

2
assets/templates/types/list.tmpl
View File

@ -16,7 +16,7 @@
<label for="type-title">Title</label>
<input
name="Title"
class="w3-input w3-border"
class=" w3-border"
id="type-title"
type="text"
value=""