diff --git a/src/components/common/VnInput.vue b/src/components/common/VnInput.vue index d93ad74657d..9bbd97d3955 100644 --- a/src/components/common/VnInput.vue +++ b/src/components/common/VnInput.vue @@ -130,17 +130,32 @@ const mixinRules = [ .q-field__append { padding-inline: 0; } - +.q-field.q-field--rounded > .q-field__inner > .q-field__control { + // background-color: red; + align-items: center; + height: 30px; +} +.q-field.q-field--labeled:not(.q-field--outlined) > .q-field__inner > .q-field__control { + // background-color: blue; + align-items: center; + height: 40px; + align-items: flex-end; +} .q-field__append.q-field__marginal.row.no-wrap.items-center.row { - height: 20px; + height: 30px; + // background-color: green; + align-items: flex-end; } -.q-field--outlined .q-field__append.q-field__marginal.row.no-wrap.items-center.row { - height: auto; -} -.q-field__control { - height: unset; -} - +// .q-field__control { +// &.relative-position.row.no-wrap { +// background-color: blue; +// } +// height: unset; +// } +// .q-field.q-field--standard.q-input >.q-field{ +// background-color: rosybrown; +// padding: unset; +// } .q-field--labeled { .q-field__native, .q-field__prefix, @@ -148,6 +163,18 @@ const mixinRules = [ .q-field__input { padding-bottom: 0; min-height: 15px; + align-items: flex-start; + } +} +.q-field__inner { + .q-field__control { + min-height: auto !important; + display: flex; + align-items: flex-end; + padding-bottom: 2px; + .q-field__native.row { + min-height: auto !important; + } } } diff --git a/src/css/app.scss b/src/css/app.scss index c77af41f92e..c5465ec57fc 100644 --- a/src/css/app.scss +++ b/src/css/app.scss @@ -288,6 +288,7 @@ input::-webkit-inner-spin-button { color: $info; } } + .q-field__inner { .q-field__control { min-height: auto !important; @@ -299,3 +300,11 @@ input::-webkit-inner-spin-button { } } } + +// .q-field.q-field--standard.q-input +// .q-field__inner +// .q-field__control +// .q-field__control-container { +// // height: 15px; +// background-color: rosybrown; +// }