Commit Graph

468 Commits

Author SHA1 Message Date
David Rosa 4b8c99b01a widgets: Rename confusing attribute name in `tabbed_sections.py`.
Renames misleading attribute in HTML template using `code-section`
to refer to both language toggles in API docs and app toggles in
help center docs.
2023-08-31 11:55:28 -07:00
Signior-X 3392be5688 user docs: Convert browser scrollbar overflow from .markdown to html.
Remove overflow: hidden from the body and overflow: auto from the
.markdown element. Adjust the scroll-margin-top on the heading
elements so that using the hash, the page opens at perfect
location. Add position: fixed to .sidebar so that it does not scroll
with the content.

For the mobile view, change the .sidebar right from 100vw to 100%.

Also change how the hamburger menu changes its position: use right
instead of left as that works better than translate combined with
left.
2023-08-30 15:34:34 -07:00
Karl Stolley a1a8afa2f7 css_grid: Defensively prevent blowouts by using minmax().
This improves upon a change introduced in #26279. But rather than
setting an `overflow` value, this uses `minmax()` with a 0 minimum
value--pushing back against the default grid minimum column value
of `auto`. The `auto` value will always try to fit the content
into the grid, even if that means wreaking havoc on the grid as
defined.
2023-08-30 15:30:40 -07:00
Daniil Fadeev 198ef43ced left_sidebar: Fix the layout for filter names that are long. 2023-08-29 17:28:05 -07:00
Daniil Fadeev 53e081ae29 popover_menus: Create an API to render popovers as a centered overlay.
This commit lets us render popovers centered on the screen with a
background overlay. It's the same thing we did with Bootstrap
popovers, but optimized for use with Tippy.
2023-08-25 12:29:36 -07:00
Daniil Fadeev f3641b8369 popovers: Move color style declaration to a better place. 2023-08-25 12:29:36 -07:00
Daniil Fadeev 54c01ac46e emoji: Remove unnecessary style declaration.
The `.emoji-popover` element is a div and thus has display: block by
default.
2023-08-24 17:54:13 -07:00
Karl Stolley c7adc5ee74 actions: Show an arrow and render a tooltip on @ indicator. 2023-08-24 14:30:46 -07:00
Karl Stolley 9709e1b4ed actions: Show pointer on bell icon. 2023-08-24 14:30:46 -07:00
Karl Stolley 207a0d789f message_time: Lighten font-weight to 350.
The tabular figures in Source Sans 3 place a foot on the 1, and
overall just feel visually a little heavier than their proportional
counterparts.

To compensate for that, this takes advantage of the variable-font
properties of Source Sans 3 to subtly drop the weight to keep the
timestamp readable but not in fierce competition with the message
area.
2023-08-24 10:44:39 -07:00
Karl Stolley 3de007d9cd actions: Make uniform horizontal alignment. 2023-08-22 16:21:27 -07:00
Karl Stolley a17c7dfe0b controls: Present bell icon as a block.
This gives better positioning control over this icon, while not
inviting the side-effects and headaches of introducing another
flexbox.
2023-08-22 16:21:27 -07:00
Karl Stolley f07fb4fd58 time: Revert to Source Sans lnum, tnum defaults.
Source Sans 3 defaults to lining (lnum), tabular (tnum) figures,
the latter of which is necessary to have times like 11:11 and 11:18
line up in short, adjacent messages.

CZO discussion:
https://chat.zulip.org/#narrow/stream/6-frontend/topic/redesigned.20hover.20icons.20.2326283/near/1629117
2023-08-22 16:19:54 -07:00
Karl Stolley cd0ae56ad4 icons: Implement new gold star color and states.
This not only introduces a new gold color that works across light
and dark modes, but it also separates out the hover and focus-
visible styles for stars--regardless of whether a star has been
filled or not.
2023-08-21 17:13:43 -07:00
Karl Stolley adb3b24cb2 icons: Display focused icons only without default outline.
The :focus-visible selector is more appropriate here, as that
enables browsers to determine whether focus should be displayed
or not. That's generally the case with keyboard-achieved focus,
but pointers and fingers generally do not need focus to be
displayed.

By not displaying a different icon color on simple :focus, this
will also ensure that star icons behave predictably when hovered
or focused via keyboard in both starred and unstarred states.
2023-08-21 17:13:43 -07:00
Karl Stolley 2ac578537c icons: Remove :focus-within styles on hover controls.
This corrects for an issue where hover controls would remain
visible after multiple clicks on one of the hover control icons,
despite the mouse pointer leaving the area.

This does not really create a regression for keyboard focus, as
there is currently no reasonable way to get a Tab key into the
hover controls area.

However, if one clicks multiple times on the vdots icon, and uses
Tab to move back and forth, the icons still remain visible--thanks
to the mouse pointer still being in the hover area.
2023-08-21 17:13:43 -07:00
Karl Stolley 14e9f65349 grid: Apply mobile-style grid when middle column is small.
This introduces a new breakpoint. In the future, this kind of
round-about sizing will be made unncessary by container queries,
but while those ship in all modern browsers, their availability
is quite recent:

https://developer.mozilla.org/en-US/docs/Web/CSS/@container
2023-08-21 17:13:43 -07:00
Karl Stolley 68ac18a338 time: Increase font-size to 13px.
This is an effort to better unify the size of the timestamp text
with the redesigned hover controls.

CZO discussion:
https://chat.zulip.org/#narrow/stream/6-frontend/topic/redesigned.20hover.20icons.20.2326283/near/1621756
2023-08-21 17:13:43 -07:00
Karl Stolley 5d293c82cd icons: Size vdots icon for greater prominence. 2023-08-21 17:13:43 -07:00
Karl Stolley 6380184973 time: Align :hover color with message controls. 2023-08-21 17:13:43 -07:00
Karl Stolley 59e9849a7f icons: Improve hover, focus states and target areas. 2023-08-21 17:13:43 -07:00
Karl Stolley b0c428edf1 icons: Add microlayout for new icons.
This, along with the preceding commits, fixes #25903.
2023-08-21 17:13:43 -07:00
Karl Stolley b05f76c29e icons: Implement monochrome colors and scaled active state. 2023-08-21 17:13:43 -07:00
Karl Stolley 058d21c4e2 css: Rename .message_table to .message-list. 2023-08-21 15:17:45 -07:00
Karl Stolley c741c43800 css: Rename .focused_table to .focused-message-list. 2023-08-21 15:17:45 -07:00
Karl Stolley e68af8a48d css: Rename .message_list to .message-feed. 2023-08-21 15:17:45 -07:00
Sahil Batra 882663394a settings: Reduce width of "Actions" column in tables.
This commit reduces the width of "Actions" column in tables so
that they do not take any unnecessary space.
2023-08-21 15:00:39 -07:00
Sahil Batra 75126c96a4 settings: Make custom profile fields table similar to other tables.
This commit updates the admin custom profile fields table to be
similar to other tables in settings page. After this change,
the table will be horizontally scrollable for narrow screens
and the buttons in actions column will not wrap to multiple lines.

This increases the width of "Actions" column and it takes some
unnecessary space, but this will be handled in the next commit
which will adjust "Actions" column in all the tables.
2023-08-21 15:00:39 -07:00
Sahil Batra ebdd63f327 settings: Fix heading borders for striped tables.
The bottom border of heading row in striped (and not bordered)
tables was thicker than needed due to two borders being present -
one from the bottom border for heading element and one from top
border for the first row in the table.

This commit changes the CSS to remove the top border of the first
row.
2023-08-21 15:00:39 -07:00
Sahil Batra 154f4f16b5 css: Remove unnecessary CSS defined using table-condensed class.
This commit removes unnecessary CSS defined for tables using
table-condensed class.

The vertical-align property for "td" elements is not needed
since by default the vertical-align property for "td" elements
is inherited and is set to "middle".

The margin properties set for the tables in informational
overlay is also not needed since we have set the width
to 100% and setting the margin to auto does not result in
anything different.
2023-08-21 15:00:39 -07:00
Anders Kaseorg 8dba4cbba6 help: Stop pretending to be a single page application.
The API and user documentation pages gain nothing from being a single
page application other than a bunch of random errors.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-08-21 14:32:19 -07:00
Karl Stolley 13311ef91d reactions: Present alt-code emoji like other reaction emoji. 2023-08-21 11:38:39 -07:00
Karl Stolley 65466cec44 reactions: Let emoji and count act as simple flex items.
This commit uses a `gap` property on the containing reactions
flexbox to recreate space previously set by margins.
2023-08-21 11:38:39 -07:00
Karl Stolley 69413fe887 reactions: Mirror reaction_button styles with message_reaction. 2023-08-21 11:38:39 -07:00
Karl Stolley c0c62e477c reactions: Use a flex layout for reactions. 2023-08-21 11:38:39 -07:00
Karl Stolley c25da457e5 grid: Allow message toggles to occupy message area. 2023-08-21 11:29:00 -07:00
Karl Stolley 72119d161b grid: Use message_time to maintain baseline group. 2023-08-21 11:29:00 -07:00
Karl Stolley ce7f5ba785 message_edit: Hide length controller when editing. 2023-08-21 11:29:00 -07:00
Daniil Fadeev d4ef28bc8d unread_count: Remove letter spacing for better horizontal alignment. 2023-08-21 11:23:35 -07:00
Aman Agrawal f7b0282a0d navbar: Hide right arrow displayed by Safari on summary elements. 2023-08-20 23:15:18 -07:00
Prakhar Pratyush 41697f2663 message_header: Add support to follow topic from the message header bar.
This commit replaces the mute/unmute topic button in the message
header bar with a button that allows the user to set the
visibility_policy of the topic to muted, unmuted, followed or inherit.

The button in the message header bar has an icon corresponding to the
current visibility policy of the topic.

In a muted stream:
A click on the button opens a popover with 'Mute', 'Default', 'Unmute',
and 'Follow' options.

In a not muted stream:
A click on the button opens a popover with 'Mute', 'Default', and
'Follow' options. 'Unmute' option is available only when the
visibility_policy is set to 'Unmute'.

The current visibility_policy of the topic is highlighted in the
popover.
2023-08-17 13:30:24 -07:00
Aman Agrawal 0988751d6c widgets: Remove box-shadow and use background-color to show focus.
The box-shadows cuts off on left and overlaps with button on right.
We instead change background-color in dark theme and border color in
white theme to show focus.
2023-08-16 10:06:40 -07:00
Aman Agrawal 8c4efb4f2e css: Rename variable name.
This will be used in other widgets too.
2023-08-16 10:06:40 -07:00
Aman Agrawal eda91378ec portico_signin: Fix back to login button alignment. 2023-08-16 10:05:15 -07:00
Satyam Bansal eefa124351 dialog_widget: Add horizontal padding to the modal content.
Previously, the modal content bottom border sometimes got hidden
due to subpixel rounding.
2023-08-16 10:38:42 -05:00
Karl Stolley d73ae26e4b alerts: Remove unused .alert-msg elements. 2023-08-15 12:20:35 -07:00
Zixuan James Li 5301060954 linkifiers: Support dragging and reordering linkifiers.
This also removes sorting on the pattern and the URL template, because
it does not make sense anymore as we make linkifiers draggable.

Fixes #23716
2023-08-14 15:21:48 -07:00
Zixuan James Li 31b7003d61 settings: Rename movable-profile-field-row.
So that we can reuse it for other movable rows in places like
.admin_linkifiers_table.
2023-08-14 15:21:48 -07:00
Satyam Bansal fe39f28497 drafts: Rename class name to provide more context. 2023-08-11 15:54:17 -07:00
Julia Bichler fed866449d drafts: Add functionality to bulk delete drafts.
Fixes #19360.

Co-authored-by: Satyam Bansal <sbansal1999@gmail.com>
2023-08-11 15:54:17 -07:00