Skip to content

Commit

Permalink
Make search sizing more sensible due to search textbox and query now …
Browse files Browse the repository at this point in the history
…being sticky

* Move search height into variables

* Lock max query height to roughly 2-2.5 lines

* Reduce search textbox max height to 5 lines

<rikaitan.link>Yjg4NGVjODI5NWZiYjc1YjMzOGNmYWY3NTkxMTI2OGZjODllYzM2YQo=</rikaitan.link>
  • Loading branch information
Kuuuube committed Jun 25, 2024
1 parent ce00b9e commit e60ec04
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 6 deletions.
1 change: 1 addition & 0 deletions ext/css/display.css
Original file line number Diff line number Diff line change
Expand Up @@ -605,6 +605,7 @@ button.sidebar-button.sidebar-button-highlight {
margin-top: 0.5em;
font-size: var(--query-parser-font-size);
white-space: pre-wrap;
max-height: calc(var(--query-parser-font-size) * 2);
}
#query-parser-content[data-term-spacing=true] .query-parser-term {
margin-right: 0.2em;
Expand Down
16 changes: 10 additions & 6 deletions ext/css/search.css
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,10 @@

--background-color: #ffffff;
--separator-color1: #cccccc;

--search-textbox-height: calc(var(--textarea-line-height) + var(--textarea-padding) * 2);
--search-textbox-min-height: calc(var(--textarea-line-height) + var(--textarea-padding) * 2);
--search-textbox-max-height: calc(var(--textarea-line-height) * 5 + var(--textarea-padding) * 2);
}
:root:not([data-loaded=true]) {
--animation-duration: 0s;
Expand Down Expand Up @@ -79,9 +83,9 @@ h1 {
border: 0;
outline: none;
width: 100%;
height: calc(var(--textarea-line-height) + var(--textarea-padding) * 2);
min-height: calc(var(--textarea-line-height) + var(--textarea-padding) * 2);
max-height: calc(var(--textarea-line-height) * 10 + var(--textarea-padding) * 2);
height: var(--search-textbox-height);
min-height: var(--search-textbox-min-height);
max-height: var(--search-textbox-max-height);
resize: none;
font-size: var(--font-size);
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
Expand All @@ -92,9 +96,9 @@ h1 {
flex: 0 0 auto;
position: relative;
width: 2.5em;
height: calc(var(--textarea-line-height) + var(--textarea-padding) * 2);
min-height: calc(var(--textarea-line-height) + var(--textarea-padding) * 2);
max-height: calc(var(--textarea-line-height) * 10 + var(--textarea-padding) * 2);
height: var(--search-textbox-height);
min-height: var(--search-textbox-min-height);
max-height: var(--search-textbox-max-height);
background-color: var(--input-background-color);
border: 0;
padding: 0;
Expand Down

0 comments on commit e60ec04

Please sign in to comment.