mirror of
https://github.com/zulip/zulip.git
synced 2025-11-03 05:23:35 +00:00
compose: Size and place formatting icons to spec.
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:
@@ -1558,18 +1558,20 @@ textarea.new_message_textarea {
|
||||
.compose-control-buttons-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
/* 30px at 15px/1em */
|
||||
height: var(--compose-formatting-buttons-row-height);
|
||||
|
||||
.compose_control_button {
|
||||
/* 22px at 14px/1em */
|
||||
font-size: 1.5714em;
|
||||
/* 22px at 15px/1em */
|
||||
font-size: 1.4667em;
|
||||
/* 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;
|
||||
/* Coordinate with the value of
|
||||
--compose-formatting-buttons-row-height */
|
||||
/* 28px at 22px/1em */
|
||||
height: 1.2727em;
|
||||
/* 30px at 22px/1em */
|
||||
height: 1.3636em;
|
||||
width: 1.3636em;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
Reference in New Issue
Block a user