paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-03 21:43:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

compose: Let pill-container dictate spacing of pills.

Browse Source 
The 2px and 6px values expressed as variables here are taken from
@terpimost's mocks in Figma.
This commit is contained in:
Karl Stolley
2024-06-19 11:25:44 -04:00
committed by Tim Abbott
parent 0844e2cba9
commit 3a4719915c
2 changed files with 5 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/styles/app_variables.css
View File

@@ -204,6 +204,8 @@
/* 1.4286em is 20px at 14px/1em */
--height-input-pill: 1.4286em;
--length-input-pill-image: var(--height-input-pill);
--vertical-spacing-input-pill: 2px;
--horizontal-spacing-input-pill: 6px;
/* Overlay heights for streams modal */
--overlay-container-height: 95vh;

5
web/styles/input_pill.css
View File

@@ -17,7 +17,7 @@
min-width: 0;
height: var(--height-input-pill);
margin: 1px 2px;
margin: 0;
color: inherit;
border: 1px solid transparent;
@@ -157,7 +157,8 @@
}
#compose-direct-recipient .pill-container {
padding: 0 2px;
gap: var(--vertical-spacing-input-pill) var(--horizontal-spacing-input-pill);
padding: var(--vertical-spacing-input-pill);
border: 1px solid hsl(0deg 0% 0% / 20%);
background-color: hsl(0deg 0% 100%);