UX: minor theme schema editor adjustments for mobile (#26434)
This commit is contained in:
parent
ba806eec74
commit
603dd89691
|
@ -46,7 +46,7 @@ export default class SchemaThemeSettingField extends Component {
|
|||
}
|
||||
|
||||
<template>
|
||||
<div class="schema-field" data-name={{@name}}>
|
||||
<div class="schema-field" data-name={{@name}} data-type={{@spec.type}}>
|
||||
<label class="schema-field__label">{{@label}}{{if
|
||||
@spec.required
|
||||
"*"
|
||||
|
|
|
@ -1,11 +1,22 @@
|
|||
.schema-field {
|
||||
margin-bottom: 1em;
|
||||
width: 100%;
|
||||
min-width: 200px;
|
||||
display: grid;
|
||||
grid-template-columns: 25% 1fr;
|
||||
gap: 1em;
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
grid-template-columns: 1fr;
|
||||
grid-template-rows: auto 1fr;
|
||||
gap: 0;
|
||||
&[data-type="boolean"] {
|
||||
grid-template-columns: auto 1fr;
|
||||
.schema-field__input {
|
||||
order: -1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.schema-field__label {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue