jeff/umap
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Better styles for buttons (vs. links)

Browse source
This commit is contained in:
David Larlet 2023-09-08 09:46:19 -04:00
parent a28d427ba1
commit 7695906c38
No known key found for this signature in database
GPG key ID: 3E2953A359E7E7BD
2 changed files with 20 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
umap/static/umap/base.css
View file

@ -163,7 +163,9 @@ select {
select[multiple="multiple"] {
height: auto;
}
.button, input[type="submit"] {
.button,
[type="button"],
input[type="submit"] {
display: block;
margin-bottom: 14px;
text-align: center;
@ -177,12 +179,15 @@ select[multiple="multiple"] {
border: none;
text-decoration: none;
}
.dark .button {
.dark .button,
.dark [type="button"] {
background-color: #2a2e30;
color: #eeeeec;
border: 1px solid #1b1f20;
}
.dark .button:hover, .dark input[type="submit"]:hover {
.dark .button:hover,
.dark [type="button"]:hover,
.dark input[type="submit"]:hover {
background-color: #2e3436;
}
.dark a {
@ -361,7 +366,8 @@ input.switch:checked ~ label:after {
.umap-multiplechoice.by4 {
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.button-bar .button {
.button-bar .button,
.button-bar [type="button"] {
display: inline-block;
}
.umap-multiplechoice input[type='radio'] {
@ -558,10 +564,12 @@ input.blur {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.blur + .button:before {
.blur + .button:before,
.blur + [type="button"]:before {
content: '✔';
}
.blur + .button {
.blur + .button,
.blur + [type="button"] {
width: 40px;
height: 18px;
display: inline-block;
@ -571,7 +579,8 @@ input.blur {
border-bottom-left-radius: 0;
box-sizing: border-box;
}
input[type=hidden].blur + .button {
input[type=hidden].blur + .button,
input[type=hidden].blur + [type="button"] {
display: none;
}

8
umap/static/umap/js/umap.core.js
View file

@ -315,10 +315,10 @@ L.DomUtil.createFieldset = (container, legend, options) => {
L.DomUtil.createButton = (className, container, content, callback, context) => {
// TODO: actually switch to buttons’ elements.
const el = L.DomUtil.add('a', className, container, content)
el.href = '#'
// const el = L.DomUtil.add('button', className, container, content)
// el.type = 'button'
// const el = L.DomUtil.add('a', className, container, content)
// el.href = '#'
const el = L.DomUtil.add('button', className, container, content)
el.type = 'button'
if (callback) {
L.DomEvent.on(el, 'click', L.DomEvent.stop).on(el, 'click', callback, context)
}