Merge pull request 'Fix search bar input field height #36' (#38) from bugfix/searchbar-input-field-height into main

Reviewed-on: #38
Reviewed-by: Johannes D. Vos
Reviewed-by: Jakob Gregory
This commit was merged in pull request #38.
This commit is contained in:
2026-05-07 21:11:27 +02:00
2 changed files with 11 additions and 5 deletions
+7 -5
View File
@@ -24,15 +24,16 @@ limitations under the License.
<style scoped>
.search-wrapper {
--submit-button-padding-y: 8px;
--submit-button-content-height: 18px;
--content-height: 32px;
--padding: 4px;
display: flex;
align-items: center;
border: 1.5px solid #ccc;
box-shadow: 0 0px 32px rgba(69, 98, 190, 0.25);
border-radius: calc(var(--submit-button-content-height) * 0.5 + var(--submit-button-padding-y) + var(--padding));
border-radius: calc(var(--content-height) * 0.5 + var(--submit-button-padding-y) + var(--padding));
padding: var(--padding);
padding-left: calc(var(--submit-button-content-height) + var(--padding));
padding-left: calc(var(--content-height) + var(--padding));
width: 100%;
}
.search-wrapper input {
@@ -41,12 +42,13 @@ limitations under the License.
width: 100%;
font-size: 1rem;
background: transparent;
height: calc(var(--content-height) + 2 * var(--submit-button-padding-y));
}
.search-button {
font-size: 1rem;
height: calc(var(--submit-button-content-height) + 2 * var(--submit-button-padding-y));
border-radius: calc(var(--submit-button-content-height) * 0.5 + var(--submit-button-padding-y));
height: calc(var(--content-height) + 2 * var(--submit-button-padding-y));
border-radius: calc(var(--content-height) * 0.5 + var(--submit-button-padding-y));
border: none;
padding: var(--submit-button-padding-y) 20px;
background: #4562BE;
+4
View File
@@ -66,4 +66,8 @@ import Searchbar from '../features/search/components/Searchbar.vue'
margin: 0;
font-size: small;
}
#search-form {
width: 70%;
}
</style>