- Fix too big margins - Fix horizontal scrolbar (caused by margin in text field) - Add some spacing between the items (4px) - Center items (I love flex) Signed-off-by: Carl Schwan <carl@carlschwan.eu>tags/v25.0.0beta6
@@ -161,6 +161,8 @@ export default { | |||
</script> | |||
<style lang="scss" scoped> | |||
$externalMargin: 8px; | |||
.header-menu { | |||
&__trigger { | |||
display: flex; | |||
@@ -191,11 +193,11 @@ export default { | |||
top: 50px; | |||
right: 0; | |||
box-sizing: border-box; | |||
margin: 0; | |||
margin: 0 $externalMargin; | |||
border-radius: 0 0 var(--border-radius) var(--border-radius); | |||
background-color: var(--color-main-background); | |||
filter: drop-shadow(0 1px 5px var(--color-box-shadow)); | |||
padding: 20px; | |||
padding: 8px; | |||
border-radius: var(--border-radius-large); | |||
} | |||
@@ -215,7 +217,7 @@ export default { | |||
&__content { | |||
overflow: auto; | |||
width: 350px; | |||
max-width: 100vw; | |||
max-width: calc(100vw - 2 * $externalMargin); | |||
min-height: calc(44px * 1.5); | |||
max-height: calc(100vh - 50px * 2); | |||
} |
@@ -169,6 +169,7 @@ $margin: 10px; | |||
.unified-search__result { | |||
display: flex; | |||
align-items: center; | |||
height: $clickable-area; | |||
padding: $margin; | |||
border-bottom: 1px solid var(--color-border); |
@@ -710,9 +710,14 @@ $input-padding: 6px; | |||
align-self: flex-start; | |||
font-weight: bold; | |||
font-size: 18px; | |||
margin-left: 13px; | |||
} | |||
} | |||
&__form-input { | |||
margin: 0 !important; | |||
} | |||
&__input-row { | |||
display: flex; | |||
width: 100%; | |||
@@ -774,9 +779,10 @@ $input-padding: 6px; | |||
&-reset, &-submit { | |||
position: absolute; | |||
top: 0; | |||
right: 0; | |||
right: 4px; | |||
width: $input-height - $input-padding; | |||
height: $input-height - $input-padding; | |||
min-height: 30px; | |||
padding: 0; | |||
opacity: .5; | |||
border: none; | |||
@@ -799,11 +805,15 @@ $input-padding: 6px; | |||
&-header { | |||
display: block; | |||
margin: $margin; | |||
margin-bottom: $margin - 4px; | |||
margin-left: $margin + $input-padding; | |||
color: var(--color-primary-element); | |||
font-weight: normal; | |||
font-size: 18px; | |||
} | |||
display: flex; | |||
flex-direction: column; | |||
gap: 4px; | |||
} | |||
.unified-search__result-more::v-deep { |