mirror_php/formwork
1
0
Fork 0
mirror of https://github.com/getformwork/formwork.git synced 2025-02-22 16:56:50 +01:00
Code Issues Packages Projects Releases Wiki Activity

Use flexbox to improve array input sizing

Browse Source
This commit is contained in:
Giuseppe Criscione 2021-07-19 20:13:32 +02:00
parent d162084c0c
commit d06507e892
4 changed files with 11 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
admin/assets/css/admin-dark.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
admin/assets/css/admin.min.css vendored
View File

File diff suppressed because one or more lines are too long

20
admin/assets/scss/components/_forms-custom.scss
View File

@ -377,7 +377,12 @@ input[type=range] {
@include user-select-none;
}
.array-input .sort-handle .icon {
vertical-align: middle;
}
.array-input-row {
display: flex;
margin: 0 (-$array-input-row-padding-h);
padding: $array-input-row-padding-v $array-input-row-padding-h;
white-space: nowrap;
@ -396,22 +401,11 @@ input[type=range] {
.array-input-value {
margin-right: $array-input-value-margin-right;
width: $array-input-value-width-xs;
@media (min-width: map.get($responsive-breakpoints, 'xs')) {
width: $array-input-value-width-s;
}
}
.array-input-associative .array-input-value {
margin-right: $array-input-value-margin-right;
width: $array-input-associative-value-width-xs;
@media (min-width: map.get($responsive-breakpoints, 'xs')) {
width: $array-input-associative-value-width-s;
}
}
.array-input-add,
.array-input-remove {
margin-right: $array-input-actions-margin-right;
padding: 0;
min-width: 0;
min-width: 1rem;
}

7
admin/assets/scss/components/_variables.scss
View File

@ -214,15 +214,12 @@ $array-input-margin-bottom: 0.5rem;
$array-input-row-padding-v: 0.25rem;
$array-input-row-padding-h: 0.5rem;
$array-input-key-margin-right: 0.125rem;
$array-input-key-margin-right: 0.25rem;
$array-input-key-width: 30%;
$array-input-value-margin-right: 0.25rem;
$array-input-value-width-xs: 81%;
$array-input-value-width-s: 86%;
$array-input-associative-value-width-xs: 50%;
$array-input-associative-value-width-s: 55%;
$array-input-actions-margin-right: 0.25rem;
// ===
// Dropdowns