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

compose: Size and place formatting icons to spec.

Browse Source 
Note that this establishes a 30px by 30px box at
Vlad's original font-size, 15px. His spec called for
a 30px by 28px box, but does not reflect the height of
the Send button, which is 30px tall. So to maintain
that height and perfectly center the icons, we create
a 30px square for the button.
This commit is contained in:
Karl Stolley
2025-07-10 09:17:29 -05:00
committed by Tim Abbott
parent 02528992a2
commit ac0cc78327
1 changed files with 7 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
web/styles/compose.css
View File

@@ -1558,18 +1558,20 @@ textarea.new_message_textarea {
.compose-control-buttons-container { .compose-control-buttons-container {
display: flex; display: flex;
align-items: center; align-items: center;
/* 30px at 15px/1em */
height: var(--compose-formatting-buttons-row-height);
.compose_control_button { .compose_control_button {
/* 22px at 14px/1em */ /* 22px at 15px/1em */
font-size: 1.5714em; font-size: 1.4667em;
/* Constrain icon fonts to a perfect /* Constrain icon fonts to a perfect
box (22px at 14px/1em) */ box (22px at 15px/1em) to sit centered
in the 30px by 30px button area. */
line-height: 1; line-height: 1;
/* Coordinate with the value of /* Coordinate with the value of
--compose-formatting-buttons-row-height */ --compose-formatting-buttons-row-height */
/* 28px at 22px/1em */
height: 1.2727em;
/* 30px at 22px/1em */ /* 30px at 22px/1em */
height: 1.3636em;
width: 1.3636em; width: 1.3636em;
display: flex; display: flex;
align-items: center; align-items: center;