Commit Graph

12 Commits

Author SHA1 Message Date
m-e-l-u-h-a-n 03e4ccbc2d message-view: Increase spacing for lists coming after paragraphs.
Lists that were followed by a paragraph (i.e. our p+ul, p+ol CSS rule)
in messages had negative top margin of -3px.  Adjusting the margin
here is important, because the default styling would result in an
excessive gap that made bulleted lists weirdly far from the previous
paragraph.  See #12113 for background.

However, the -3px negative margin was so large that it reduced spaces
between paragraph and lists, such that there was too little visible
separation between the two.  We fix this by going with a 0px
margin-top instead.

This has been tested for various structures of messages:
1. text + bulleted list
2. bulleted list + unbulleted list(or two lists)
3. only list.

And it looks good in all cases.

Fixes #17284.
2021-02-16 08:56:26 -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 17f34bdfbf rendered_markdown: Use 575px instead of 600px for breakpoint.
This media query changes the how embedded messages is displayed
on small screens. Changing breakpoint to 575px offers similar
experience.
2021-01-25 14:49:32 -08:00
Kamal Marhubi 9c176bc0fa markdown: Remove border colour on inline code links
The visual noise from the blue border has bothered me forever and I
finally decided to do something about it. I don't know if this is the
best solution, but I do think it's a lot better than the status quo!
2020-11-05 09:32:05 -08:00
YashRE42 967efc32d2 widgets: Remove tictactoe example widget.
Steve asked me to remove this, since the tictactoe game was always
intended as a proof of concept. Now that we have poll and todo
widgets, the sample code for tictactoe has much less value.

We replace the content and type in test_widgets.py to maintain
coverage.
2020-11-03 14:46:39 -08:00
Sumanth V Rao adfe4cacc6 css: Add vertical scrollbar styling for view-source textarea.
This styles the vertical scrollbar similar to the horizontal
one for <pre/> (which can be seen in narrow windows). Strictly
speaking, this change shouldn't go in rendered_markdown.scss, but
placing it there helps unify the two scrollbar stylings rather than
duplicating them.
2020-10-08 17:13:50 -07:00
Sumanth V Rao ab9a011f89 css: Modify button styling to adjust for svg size change.
This builds on the previous commit and adds final touches to
both the button positioning and style.
2020-10-08 17:13:50 -07:00
Sumanth V Rao 792029cbb8 css: Refactor copy_message button to use copy_button_base class styling.
Z-index is added to the base class. This doesn't affect copy_code_button
in any way.

Attributes dropped/changed:
    - background-color
    - Base class on-hover property is now used.
    - height, width, padding is now the base classes.

We can also remove the TODO now.
2020-10-08 17:13:50 -07:00
Sumanth V Rao 26ff6db751 css: Extract copy_button_base from copy_codeblock class.
The base class will contain common styling which is used by both
copy_codeblock and copy_message buttons. This sets us up nicely
for following commit(s) which aims to unify the two button styling.
2020-10-08 17:13:50 -07:00
Sumanth V Rao 918b1ea61d css: Add styling for code_external_link hyperlink.
In case of previews, we tweak the positioning a bit more
to the right.

The previous styling also had the focus-within action
which isn't needed here as hovering over the codeblock
is enough to display both the icons.
2020-09-28 16:04:54 -07:00
Anders Kaseorg a3d26d701e styles: Rename .scss files back to .css.
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>
2020-09-15 16:33:28 -07:00