Commit Graph

11 Commits

Author SHA1 Message Date
Aman Agrawal 233b486618 css: Use variable font when using Source Sans 3.
This is to overcome the limitations of previous static font,
which didn't allow us to use various font widths.
2023-07-06 17:57:37 -07:00
Wladimir Ramos b80a205dbe
portico: Polish UI for portico pages copy-codeblock button.
* Add a Copy code tooltip.
* Add cursor pointer.
* Add a hover effect.
* Move variables to snake_case.

Fixes: #25962.
2023-07-06 16:18:59 -07:00
Karl Stolley d6c21c2237 docs: Correct scope of copied material from copy button.
This traverses the DOM to the <pre> element containing the
copyable material of interest.

The button is attached to the .codehilite element to ensure
that the button does not move with horizontally-scrolling
code content that exceeds the width of the content column,
as happens frequently at mobile scales or for very long
lines of content.

Fixes #26093.
2023-06-24 07:51:54 -07:00
UBC Student 1cbff7094b docs: Add copy code button to portico docs.
Added a copy-to-clipboard button to the code blocks in the API and
Help Center docs. Previously, copying code from the docs required
manual copying, which was cumbersome.

Used the same copy-to-clipboard svg icon as the one used in
web/src but manually created the button within the js function instead
of using a template. Updated the pre CSS element to have relative
positioning and gave the copy-codeblock element absolute positioning
to ensure the button stayed in the top-right corner.

Fixes #25726.
2023-06-09 11:26:05 -07:00
Anders Kaseorg d274583d8f styles: Use modern color notation.
postcss-preset-env transpiles this back as necessary.  (It does a
better job than we did, in fact: we had several four-argument hsl()
calls that should have been hsla().)

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-03-24 17:26:55 -07:00
Anders Kaseorg 5cdf38b1f7 styles: Use standard CSS nesting syntax.
CSS nesting is being standardized with the syntactic restriction that
the nested selector cannot start with an identifier.  This was
necessary to allow the syntax to be parsed without lookahead.

https://webkit.org/blog/13813/try-css-nesting-today-in-safari-technology-preview/
https://www.w3.org/TR/css-nesting-1/#syntax

The postcss-nesting plugin used by postcss-preset-env enforces this
restriction.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-03-20 11:26:30 -07:00
Joelute e44a87b271 documentation: Reduce `max-width` on content.
In the documentation, text-lines felt a bit too long
in text-heavy pages. This change aims to reduce
`max-width` on the content to 700px.

[CZO discussion](https://chat.zulip.org/#narrow/stream/19-documentation/topic/line.20wrapping.20code.20blocks/near/1516561)
2023-03-03 11:36:06 -08:00
Lauryn Menard 262debb72b css: Update code element styling for documentation pages.
Updates `markdown.css` to remove border styling from code
elements, and instead use background-color (as well as
font-family) to visually highlight inline code elements
as distinct from regular text.

Updates code element font-family to be the same as in
`zulip.css`.

Makes padding on the left and right the symmetrical for
inline code elements. Previously there was 4px padding on
the right, but not on the left.

Maintains anchor font-color styling for code elements that
are also links.
2023-03-02 13:32:50 -08:00
Lauryn Menard 3c63025d88 css: Remove code elements from bootstrap.css.
Updates `markdown.css` and `rendered_markdown.css` for the rules
in `bootstrap.css` that were being used to style code elements and
removes the now redundant/ignored rules from `bootstrap.css`.
2023-03-02 13:32:50 -08:00
Joelute 4c6f85727c documentation: Add horizontal scrollbar to code blocks in help center.
Some code blocks in the help center have lines that are too long
to fit, and wrap onto the next line. This can look awkward, and
may cause confusion. An horizontal scroll bar is added to the code
blocks to help fit everything into their own lines and clear up
confusions.

Fixes #24004.
2023-02-27 11:52:01 -08:00
Anders Kaseorg c1675913a2 web: Move web app to ‘web’ directory.
Ever since we started bundling the app with webpack, there’s been less
and less overlap between our ‘static’ directory (files belonging to
the frontend app) and Django’s interpretation of the ‘static’
directory (files served directly to the web).

Split the app out to its own ‘web’ directory outside of ‘static’, and
remove all the custom collectstatic --ignore rules.  This makes it
much clearer what’s actually being served to the web, and what’s being
bundled by webpack.  It also shrinks the release tarball by 3%.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-02-23 16:04:17 -08:00