chore: make panel toolbox sticky instead of fixed

No need to deal with width, that way.
This commit is contained in:
Yohan Boniface 2024-03-15 18:39:06 +01:00
parent cd01e4085f
commit 2f1a85144e
3 changed files with 4 additions and 13 deletions

View file

@ -58,14 +58,12 @@
gap: 5px; gap: 5px;
line-height: 2.2em; line-height: 2.2em;
background-color: #fff; background-color: #fff;
position: fixed; position: sticky;
top: 0;
} }
.panel.dark .toolbox { .panel.dark .toolbox {
background-color: var(--color-darkGray); background-color: var(--color-darkGray);
} }
.panel.full .toolbox {
width: calc(100% - 112px);
}
.panel .toolbox li { .panel .toolbox li {
cursor: pointer; cursor: pointer;
display: inline; display: inline;
@ -93,10 +91,6 @@
margin-top: 10px; margin-top: 10px;
width: 400px; width: 400px;
} }
.panel .toolbox {
/* It overflows otherwise, dunno why */
width: 398px;
}
.panel.condensed { .panel.condensed {
max-height: 500px; max-height: 500px;
bottom: initial; bottom: initial;
@ -131,9 +125,6 @@
.panel.left { .panel.left {
left: -100%; left: -100%;
} }
.panel .toolbox {
width: 100%;
}
.panel.on { .panel.on {
right: 0; right: 0;
left: 0; left: 0;

View file

@ -120,7 +120,7 @@ L.DomUtil.createLink = (className, container, content, url, target, title) => {
L.DomUtil.createIcon = (parent, className, title, size = 16) => { L.DomUtil.createIcon = (parent, className, title, size = 16) => {
return L.DomUtil.element( return L.DomUtil.element(
'i', 'i',
{ className: `icon icon-${size} ${className}`, title: title }, { className: `icon icon-${size} ${className}`, title: title || '' },
parent parent
) )
} }

View file

@ -99,7 +99,7 @@ U.TableEditor = L.Class.extend({
this.body.innerHTML = '' this.body.innerHTML = ''
this.datalayer.eachLayer(this.renderRow, this) this.datalayer.eachLayer(this.renderRow, this)
const addButton = L.DomUtil.create('li', 'add-property') const addButton = L.DomUtil.create('li', 'add-property')
L.DomUtil.create('i', 'icon icon-16 icon-add', addButton) L.DomUtil.createIcon(addButton, 'icon-add')
const label = L.DomUtil.create('span', '', addButton) const label = L.DomUtil.create('span', '', addButton)
label.textContent = label.title = L._('Add a new property') label.textContent = label.title = L._('Add a new property')
const addProperty = function () { const addProperty = function () {