Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

landing: Fix responsive styling for navbar custom messages. 

The previous styling was brittle and ended up breaking in very small
phone-size views with the text overflowing the boundaries of the page.

The right fix is to move those heading outside the portico-header
class, since the CSS for that isn't generally appropriate here.
This commit is contained in:
Tim Abbott 2020-05-26 22:57:51 -07:00
parent 2091b14764
commit 23f0b3bc45
2 changed files with 7 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
static/styles/portico/portico.scss
View File

@ -1771,14 +1771,14 @@ input.new-organization-button {
font-size: 1rem;
background-color: hsl(177, 52%, 55%);
background: linear-gradient(145deg, hsl(191, 56%, 55%), hsl(169, 65%, 42%));
color: hsl(0, 0%, 100%);
font-weight: 600;
text-align: center;
position: relative;
top: -40px;
margin-left: calc(50% - 50vw);
width: 100vw;
top: 0px;
padding: 10px;
border-bottom: 1px solid hsl(177, 52%, 55%);
z-index: 5;
a {
color: hsl(0, 0%, 100%);

5
templates/zerver/landing_nav.html
View File

@ -1,10 +1,13 @@
{% if not isolated_page %}
<nav class="portico-header">
{% if landing_page_navbar_message %}
<div id="navbar-custom-message">
{{ landing_page_navbar_message |safe }}
</div>
{% endif %}
{% endif %}
{% if not isolated_page %}
<nav class="portico-header">
<div class="content">
<a class="brand logo" href="{{ root_domain_uri }}">
<svg class="brand-logo" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 40 40" version="1.1">