Updates references to keyboard keys in the help center docs to use
`<kbd>` HTML elements, which also means updating them to be as the
key would appear on a keyboard.
Previously, uppercase and lowercase letters were used to indicate
when/if the `Shift` key was being used, and even that was not
consistent throughout the documentation.
For CSS styling, adds a similar rule for `<kbd>` elements that is
used in `/static/styles/app_components.css`. And updates the CSS
class used in `/static/js/portico/help.js` for `adjust_mac_shortcuts`
accordingly.
Also, takes advantage of revising these pages for making small
updates for current help center documentation practices.
Adds step-by-step instructions for mobile app users including the
corresponding image icons for the buttons that they should tap on
their screen.
Makes individual SVG image icons, for the help center docs, available
in `/static/images/help/`, instead of importing the entire set of
icons as dependencies.
Adds the icons for the "PMs" tab from https://feathericons.com, and
"Checkmark" and "Send" buttons from https://materialdesignicons.com.
Adds a new nested CSS selector to `.markdown img` so that the default
white border for images does not get applied to these icons.
Removes CSS rule that added a left margin and padding to not
first-child paragraph elements and `codehilite` class div elements
in ordered list elements.
Rule was added in 2017 and likely was correcting the alignment of
these elements due to another CSS rule that has since been removed.
Adds a line break before the descriptive text for return
values and events in the api documentation in order to
help with readability of descriptions with multiple
paragraphs of descriptive text.
Adjustments made to the CSS of list items in unordered
lists to visually group the first paragraph of text
to any following paragraphs or unordered lists.
Moves CSS rules that rely on list items in an ordered list being
wrapped in a `<p>` tag so that they apply to the list item itself.
Uses `position: absolute` to set the `::before` pseudo-element in
place and `position: relative` to adjust the list items so that they
do not overlap.
Ideally, when Safari supports the `content` property for `::marker`
pseudo-elements, this issue can be revisited.
Fixes#20440.
This made it impossible to e.g. use Font Awesome icons inside a `<ul>`
list item (they worked correctly inside `<ol>` list items).
This line was apparently added in
17ad591eb4. The original thinking
behind this line is not clear in the original PR, but is likely a
forgotten relic from experiments with a custom unordered list bullet
styling.
On our Markdown help docs, ordered lists that aren't encapsulated
in tabs don't have custom CSS that tells them how to display
themselves with proper indentation. An example of a doc that has
this issue is /help/saml-authentication. This commit adds some CSS
that targets such ordered lists.
Commit d84727ce7f (#17970) slightly
decreased the apparent size on some platforms depending on which font
was in use before, and some users complained that it was a bit hard to
read. Based on experiments with multiple platforms and monitors and
resolutions, this appears to be a good compromise that increases the
rendered height without increasing the width more than necessary.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
As demonstrated with the recent Zabbix integration, our line-wrapping
of numbered lists was busted in the presence of 2-digit numbers of steps.
Fixes#17634.
The code blocks and response blocks had small and unreadable font,
because they were using the bootstrap defaults without adjustment for
the size of content on the rest of the page. Fixes part of
zulip#15967.
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>
css-loader@4 broke @import statements referencing files with
extensions other than .css, unless those @import statements are
compiled away by another loader. Upstream is more interested in
arguing that such @import statements are semantically incorrect than
applying the one line fix.
https://github.com/webpack-contrib/css-loader/issues/1164
Signed-off-by: Anders Kaseorg <anders@zulip.com>
Lauryn Menard
David Rosa
Anders Kaseorg
Lauryn Menard
Alya Abbott
Tim Abbott
Eeshan Garg
slefforge
mandepsingh
Suyash Vardhan Mathur