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"] { select[multiple="multiple"] {
height: auto; height: auto;
} }
.button, input[type="submit"] { .button,
[type="button"],
input[type="submit"] {
display: block; display: block;
margin-bottom: 14px; margin-bottom: 14px;
text-align: center; text-align: center;
@ -177,12 +179,15 @@ select[multiple="multiple"] {
border: none; border: none;
text-decoration: none; text-decoration: none;
} }
.dark .button { .dark .button,
.dark [type="button"] {
background-color: #2a2e30; background-color: #2a2e30;
color: #eeeeec; color: #eeeeec;
border: 1px solid #1b1f20; 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; background-color: #2e3436;
} }
.dark a { .dark a {
@ -361,7 +366,8 @@ input.switch:checked ~ label:after {
.umap-multiplechoice.by4 { .umap-multiplechoice.by4 {
grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr 1fr;
} }
.button-bar .button { .button-bar .button,
.button-bar [type="button"] {
display: inline-block; display: inline-block;
} }
.umap-multiplechoice input[type='radio'] { .umap-multiplechoice input[type='radio'] {
@ -558,10 +564,12 @@ input.blur {
border-top-right-radius: 0; border-top-right-radius: 0;
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.blur + .button:before { .blur + .button:before,
.blur + [type="button"]:before {
content: '✔'; content: '✔';
} }
.blur + .button { .blur + .button,
.blur + [type="button"] {
width: 40px; width: 40px;
height: 18px; height: 18px;
display: inline-block; display: inline-block;
@ -571,7 +579,8 @@ input.blur {
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
box-sizing: border-box; box-sizing: border-box;
} }
input[type=hidden].blur + .button { input[type=hidden].blur + .button,
input[type=hidden].blur + [type="button"] {
display: none; 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) => { L.DomUtil.createButton = (className, container, content, callback, context) => {
// TODO: actually switch to buttons’ elements. // TODO: actually switch to buttons’ elements.
const el = L.DomUtil.add('a', className, container, content) // const el = L.DomUtil.add('a', className, container, content)
el.href = '#' // el.href = '#'
// const el = L.DomUtil.add('button', className, container, content) const el = L.DomUtil.add('button', className, container, content)
// el.type = 'button' el.type = 'button'
if (callback) { if (callback) {
L.DomEvent.on(el, 'click', L.DomEvent.stop).on(el, 'click', callback, context) L.DomEvent.on(el, 'click', L.DomEvent.stop).on(el, 'click', callback, context)
} }