fix: improve mobile tariff row editor layout
This commit is contained in:
@@ -1,5 +1,3 @@
|
|||||||
|
|
||||||
|
|
||||||
.admin-toolbar-search .input,
|
.admin-toolbar-search .input,
|
||||||
.admin-toolbar-search .admin-btn {
|
.admin-toolbar-search .admin-btn {
|
||||||
height: 36px;
|
height: 36px;
|
||||||
@@ -57,7 +55,9 @@
|
|||||||
padding: 0 12px;
|
padding: 0 12px;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
outline: none;
|
outline: none;
|
||||||
transition: border-color 0.12s ease, box-shadow 0.12s ease;
|
transition:
|
||||||
|
border-color 0.12s ease,
|
||||||
|
box-shadow 0.12s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-screen-wrap .admin-translations-search .input,
|
.admin-screen-wrap .admin-translations-search .input,
|
||||||
@@ -110,7 +110,10 @@
|
|||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
|
transition:
|
||||||
|
background 0.12s ease,
|
||||||
|
border-color 0.12s ease,
|
||||||
|
color 0.12s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-btn:hover:not(:disabled) {
|
.admin-btn:hover:not(:disabled) {
|
||||||
@@ -239,7 +242,9 @@
|
|||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
line-height: 1.45;
|
line-height: 1.45;
|
||||||
outline: none;
|
outline: none;
|
||||||
transition: border-color 0.12s ease, box-shadow 0.12s ease;
|
transition:
|
||||||
|
border-color 0.12s ease,
|
||||||
|
box-shadow 0.12s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-setting-control .admin-setting-textarea:focus {
|
.admin-setting-control .admin-setting-textarea:focus {
|
||||||
@@ -290,6 +295,14 @@
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.admin-row-editor-line .input,
|
||||||
|
.admin-row-editor-line input,
|
||||||
|
.admin-row-editor-line select {
|
||||||
|
height: var(--admin-row-editor-action-size, 36px);
|
||||||
|
min-height: var(--admin-row-editor-action-size, 36px);
|
||||||
|
padding-block: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.admin-action-grid > .admin-btn {
|
.admin-action-grid > .admin-btn {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 36px;
|
height: 36px;
|
||||||
|
|||||||
@@ -1660,7 +1660,9 @@
|
|||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
outline: none;
|
outline: none;
|
||||||
transition: border-color 0.12s ease, box-shadow 0.12s ease;
|
transition:
|
||||||
|
border-color 0.12s ease,
|
||||||
|
box-shadow 0.12s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-pagination-jump-input:focus {
|
.admin-pagination-jump-input:focus {
|
||||||
@@ -3667,6 +3669,7 @@
|
|||||||
display: grid;
|
display: grid;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-row-editor-line {
|
.admin-row-editor-line {
|
||||||
@@ -3698,7 +3701,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.admin-row-editor-line.admin-row-editor-drag {
|
.admin-row-editor-line.admin-row-editor-drag {
|
||||||
grid-template-columns: 24px minmax(90px, 1fr) minmax(110px, 1fr) minmax(110px, 1fr)
|
grid-template-columns:
|
||||||
|
24px minmax(90px, 1fr) minmax(110px, 1fr) minmax(110px, 1fr)
|
||||||
var(--admin-row-editor-action-size);
|
var(--admin-row-editor-action-size);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -3910,6 +3914,59 @@
|
|||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.admin-tariff-dialog {
|
||||||
|
width: min(100%, calc(100vw - 24px));
|
||||||
|
gap: 12px;
|
||||||
|
padding: 14px;
|
||||||
|
border-radius: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-tariff-dialog .dialog-head {
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-tariff-dialog .dialog-title-copy {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-tariff-dialog .admin-tabs-list {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-tariff-dialog .admin-tabs-trigger {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
padding-inline: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-tariff-dialog .admin-tabs-content,
|
||||||
|
.admin-tariff-dialog .admin-editor-section,
|
||||||
|
.admin-tariff-dialog .admin-editor-section-title {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-tariff-dialog .admin-editor-section {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-tariff-dialog .admin-editor-section-head {
|
||||||
|
align-items: stretch;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-tariff-dialog .admin-editor-section-head > .admin-editor-section-actions,
|
||||||
|
.admin-tariff-dialog .admin-editor-section-actions {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-tariff-dialog .admin-editor-section-actions .admin-btn {
|
||||||
|
width: 100%;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-row-editor-line.admin-row-editor-header {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
.admin-form-row.admin-form-row-3,
|
.admin-form-row.admin-form-row-3,
|
||||||
.admin-row-editor-line,
|
.admin-row-editor-line,
|
||||||
.admin-row-editor-line.admin-row-editor-4,
|
.admin-row-editor-line.admin-row-editor-4,
|
||||||
@@ -3917,6 +3974,27 @@
|
|||||||
.admin-row-editor-line.admin-row-editor-period,
|
.admin-row-editor-line.admin-row-editor-period,
|
||||||
.admin-row-editor-line.admin-row-editor-drag {
|
.admin-row-editor-line.admin-row-editor-drag {
|
||||||
grid-template-columns: 1fr;
|
grid-template-columns: 1fr;
|
||||||
|
align-items: stretch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-row-editor-line:not(.admin-row-editor-header) {
|
||||||
|
padding: 10px;
|
||||||
|
border: 1px solid var(--admin-border);
|
||||||
|
border-radius: 8px;
|
||||||
|
background: color-mix(in srgb, var(--admin-surface-2) 58%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-row-editor-line .ui-sortable-handle.ui-sortable-handle {
|
||||||
|
width: 100%;
|
||||||
|
height: 28px;
|
||||||
|
min-height: 28px;
|
||||||
|
border: 1px dashed var(--admin-border);
|
||||||
|
border-radius: 7px;
|
||||||
|
background: color-mix(in srgb, var(--admin-muted) 8%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-row-editor-line .admin-btn {
|
||||||
|
justify-self: end;
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-dialog-actions {
|
.admin-dialog-actions {
|
||||||
@@ -3981,6 +4059,8 @@
|
|||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 4px;
|
gap: 4px;
|
||||||
|
max-width: 100%;
|
||||||
|
min-width: 0;
|
||||||
padding: 4px;
|
padding: 4px;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
background: var(--admin-surface-2);
|
background: var(--admin-surface-2);
|
||||||
|
|||||||
Reference in New Issue
Block a user