Minor UI fixes
This commit is contained in:
parent
019addd855
commit
29ded53d52
6
components/dist/select.js
vendored
6
components/dist/select.js
vendored
@ -11,7 +11,6 @@ smSelect.innerHTML = `
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
--min-width: max-content;
|
||||
}
|
||||
:host([disabled]) .select{
|
||||
opacity: 0.6;
|
||||
@ -83,7 +82,8 @@ smSelect.innerHTML = `
|
||||
-webkit-box-direction: normal;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
min-width: var(--min-width);
|
||||
width: var(--options-width, 100%);
|
||||
min-width: var(--min-width, auto);
|
||||
max-height: var(--max-height, auto);
|
||||
background: rgba(var(--foreground-color,(255,255,255)), 1);
|
||||
border: solid 1px rgba(var(--text-color,(17,17,17)), 0.2);
|
||||
@ -365,13 +365,11 @@ smOption.innerHTML = `
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
min-width: max-content;
|
||||
width: 100%;
|
||||
gap: 0.5rem;
|
||||
grid-template-columns: max-content minmax(0, 1fr);
|
||||
padding: var(--padding, 0.6rem 1rem);
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
outline: none;
|
||||
user-select: none;
|
||||
border-radius: var(--border-radius, 0.3rem);
|
||||
|
||||
2
components/dist/select.min.js
vendored
2
components/dist/select.min.js
vendored
File diff suppressed because one or more lines are too long
1
components/dist/spinner.js
vendored
1
components/dist/spinner.js
vendored
@ -8,6 +8,7 @@ spinner.innerHTML = `
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.loader {
|
||||
display: flex;
|
||||
height: var(--size, 1.5rem);
|
||||
width: var(--size, 1.5rem);
|
||||
stroke-width: 8;
|
||||
|
||||
2
components/dist/spinner.min.js
vendored
2
components/dist/spinner.min.js
vendored
@ -1 +1 @@
|
||||
const spinner=document.createElement("template");spinner.innerHTML='\n<style> \n*{\n padding: 0;\n margin: 0;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n.loader {\n height: var(--size, 1.5rem);\n width: var(--size, 1.5rem);\n stroke-width: 8;\n overflow: visible;\n stroke: var(--accent-color, teal);\n fill: none;\n stroke-dashoffset: 180;\n stroke-dasharray: 180;\n animation: load 2s infinite, spin 1s linear infinite;\n}\n@keyframes load {\n 50% {\n stroke-dashoffset: 0;\n }\n 100%{\n stroke-dashoffset: -180;\n }\n}\n\n@keyframes spin {\n 100% {\n transform: rotate(360deg);\n }\n}\n</style>\n<svg viewBox="0 0 64 64" class="loader"><circle cx="32" cy="32" r="32" /></svg>\n\n';class SpinnerLoader extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}).append(spinner.content.cloneNode(!0))}}window.customElements.define("sm-spinner",SpinnerLoader);
|
||||
const spinner=document.createElement("template");spinner.innerHTML='\n<style> \n*{\n padding: 0;\n margin: 0;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n.loader {\n display: flex;\n height: var(--size, 1.5rem);\n width: var(--size, 1.5rem);\n stroke-width: 8;\n overflow: visible;\n stroke: var(--accent-color, teal);\n fill: none;\n stroke-dashoffset: 180;\n stroke-dasharray: 180;\n animation: load 2s infinite, spin 1s linear infinite;\n}\n@keyframes load {\n 50% {\n stroke-dashoffset: 0;\n }\n 100%{\n stroke-dashoffset: -180;\n }\n}\n\n@keyframes spin {\n 100% {\n transform: rotate(360deg);\n }\n}\n</style>\n<svg viewBox="0 0 64 64" class="loader"><circle cx="32" cy="32" r="32" /></svg>\n\n';class SpinnerLoader extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}).append(spinner.content.cloneNode(!0))}}window.customElements.define("sm-spinner",SpinnerLoader);
|
||||
Loading…
Reference in New Issue
Block a user