Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

pills: Size pill components and inputs in ems.

This commit is contained in:
Karl Stolley 2024-06-19 11:16:38 -04:00 committed by Tim Abbott
parent 39d4ddaa96
commit 0844e2cba9
2 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
web/styles/app_variables.css
View File

@ -200,6 +200,11 @@
We expect `resize.ts` to update this once UI is initialized. */
--recent-topics-filters-height: 50px;
/* Pill dimensions. */
/* 1.4286em is 20px at 14px/1em */
--height-input-pill: 1.4286em;
--length-input-pill-image: var(--height-input-pill);
/* Overlay heights for streams modal */
--overlay-container-height: 95vh;
--overlay-container-max-height: 1000px;

11
web/styles/input_pill.css
View File

@ -16,7 +16,7 @@
max-width: 100%;
min-width: 0;
height: 20px;
height: var(--height-input-pill);
margin: 1px 2px;
color: inherit;
@ -32,8 +32,8 @@
}
.pill-image {
height: 20px;
width: 20px;
height: var(--length-input-pill-image);
width: var(--length-input-pill-image);
border-radius: 4px 0 0 4px;
}
@ -137,7 +137,10 @@
.input {
display: inline-block;
padding: 2px 4px;
/* This keeps the input sized to
the same height as pills. */
line-height: var(--height-input-pill);
padding: 0 4px;
min-width: 2px;
word-break: break-all;