Commit Graph

13 Commits

Author SHA1 Message Date
Tim Abbott 64f9721ce5 css: Use default font size for user search icon.
This icon always looked really small, so it's probably visually better
this way, and this lets us remove an unnecessary font-size override.
2021-06-11 16:03:39 -07:00
Tim Abbott f5369db8f1 css: Remove duplicate specifications of default font size.
These unnecessary references to 14px font size complicate any effort
to adjust the font size in Zulip.
2021-06-11 15:11:33 -07:00
Tim Abbott 01245c86b3 sidebars: Add a bit of margin above sidebar links.
This avoids slightly glitchy looking behavior in certain scroll
positions where there just isn't enough space above link to make it
look like it's top of the other element.
2021-04-30 16:07:25 -07:00
Aman Agrawal 6744522229 user_presence_row: Use `unread_counts` class for showing unread count. 2021-04-14 10:57:16 -07:00
Gaurav Pandey dea5245590 right-sidebar: Fix design bugs with keyboard-shortcuts.
The keyboard-shortcuts icon currently has a fix position
causing design related bugs such as overlapping with userlist
in the sidebar.

The fix wraps the invite-more-users link and keyboard icon inside
a div with display property as flex instead of just using the anchor
tags inside the side-bar items.
2021-03-22 19:29:46 -07:00
Gaurav Pandey 60c6ba7c3a right-sidebar: Display ellipsis icon by default on touch-based devices.
Hover does not work for touch-based devices like mobile phones.
Hence the icons on the right sidebar do not appear, making the
user unaware of its presence on such devices. The following
media property displays the icon by default for such behaviour.
2021-03-02 12:05:50 -08:00
Megamind d001916b78
right sidebar: Increase hover opacity of "filter users".
Usually we increase the opacity of an interactable icon on hover, but the search-icon at the top of the 
right sidebar was missing the behavior.

Co-authored-by: ritik <ritikcn05@gmail.com>
2021-02-23 15:30:45 -08:00
Anders Kaseorg 64b78ad992 styles: Use range context queries to eliminate *_max variables.
On a high-DPI display or with a non-default zoom level, the browser
viewport may have a width strictly between md_max = 767px and md_min =
768px.  Use only the *_min bounds for consistency.

This requires queries with strict inequalities to express upper
bounds (width < md_min).  Fortunately, that functionality is provided
by range context queries.  Unfortunately, those are not supported in
all browsers.  Fortunately, we can compile them away using
postcss-media-minmax.  Unfortunately, postcss-media-minmax currently
subtracts 1px for strict inequalities anyway to work around a Safari
rounding bug.  Fortunately, 0.02px should be sufficient for that, so I
submitted a PR:

https://github.com/postcss/postcss-media-minmax/pull/28

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-02-05 09:23:59 -08:00
Aman Agrawal f8aea9aecb postcss_vars: Use underscore to follow better naming convention. 2021-01-25 14:49:32 -08:00
Aman Agrawal ac09572317 media_query: Use 575px instead of 500px to reduce spacing.
At 575px, we used to reduce spacing for
all components around webapp.

This is basically the standard breakpoint for mobile devices.
2021-01-25 14:49:32 -08:00
Aman Agrawal e941ee4a15 media_query: Use 767px instead of 775px as md breakpoint.
We use 767px for hiding left column.

The components changed here were tested to be working fine.

This change is not likely to introduce any regression as the
calculations in the components here were not dependent upon the
breakpoint being at 775px.
2021-01-25 14:49:32 -08:00
Aman Agrawal 5a8150e34b media_query: Use 1199px instead of 1165px as xl breakpoint.
We use 1199px for hiding right column.

The components changed here were tested to be working fine.

This change is not likely to introduce any regression as the
calculations in the components here were not dependent upon the
breakpoint being at 1165px.
2021-01-25 14:49:32 -08:00
YashRE42 51f82ad839 right_sidebar: Rename .css file to right_sidebar.css.
This changes the file name to existing conventions, it does not,
however, change the actual `.right_sidebar` tag used in the
app.
2020-10-18 14:09:47 -07:00