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

compose: Adjust popover-button breakpoints for wider left sidebar.

This commit is contained in:
Karl Stolley 2024-07-22 14:20:02 -04:00 committed by Tim Abbott
parent c7cdda08f9
commit ce56c51e33
1 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
web/styles/compose.css
View File

@ -1250,7 +1250,7 @@ textarea.new_message_textarea {
vdot menu icon, so that it is hidden when all compose buttons fit
in the main row below the compose box. So, this is the same as
the media query for .show_popover_buttons. */
@media (((width < 1398px) and (width >= $xl_min)) or (width < 1158px)) {
@media (((width < 1418px) and (width >= $xl_min)) or (width < 1178px)) {
display: block;
.compose_control_menu {
@ -1264,7 +1264,7 @@ textarea.new_message_textarea {
we hide and show in a popover instead when they no longer fit in a
single row. The media query below handles the hiding and showing of the
buttons from the main row of compose buttons below the compose box. */
@media (((width < 1398px) and (width >= $xl_min)) or (width < 1158px)) {
@media (((width < 1418px) and (width >= $xl_min)) or (width < 1178px)) {
display: none;
}
}
@ -1273,7 +1273,7 @@ textarea.new_message_textarea {
/* This is similar to show_popover_buttons, but it's only for those
compose buttons that we hide, and show in the popover only when the
screen gets extremely narrow. */
@media ((width < 596px) or ((width < 919px) and (width >= $md_min))) {
@media ((width < 596px) or ((width < 939px) and (width >= $md_min))) {
display: none;
}
}
@ -1281,7 +1281,7 @@ textarea.new_message_textarea {
&.show_in_popover {
/* This is to show the popover 2 buttons in the popover, only when
they are hidden in the main row below the compose box. */
@media ((width < 596px) or ((width < 919px) and (width >= $md_min))) {
@media ((width < 596px) or ((width < 939px) and (width >= $md_min))) {
display: flex;
}
}