mirror of https://github.com/zulip/zulip.git
Restyle /hello to be more consistent with current app style.
(imported from commit 7e1df8cb885908f40569692283e98ac851ca3d2e)
This commit is contained in:
parent
4eded59dbe
commit
202ac0fe10
Binary file not shown.
Before Width: | Height: | Size: 8.3 KiB After Width: | Height: | Size: 65 KiB |
|
@ -282,26 +282,11 @@ img.screenshot{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 600px;
|
max-width: 600px;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
background: #ddd, url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/paper.jpg');
|
background: url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/paper.jpg');
|
||||||
background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 54%, rgba(0,0,0,0.2) 100%), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/paper.jpg');
|
background-repeat: repeat-x, repeat-x, repeat;
|
||||||
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(54%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.2))), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/paper.jpg');
|
background-position: top, bottom, center;
|
||||||
background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 54%,rgba(0,0,0,0.2) 100%), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/paper.jpg');
|
background-size: 40px auto, 40px auto, auto;
|
||||||
background: -o-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 54%,rgba(0,0,0,0.2) 100%), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/paper.jpg');
|
|
||||||
background: -ms-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 54%,rgba(0,0,0,0.2) 100%), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/paper.jpg');
|
|
||||||
background: radial-gradient(ellipse at center, rgba(0,0,0,0) 54%,rgba(0,0,0,0.2) 100%), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/airstripes.png'), url('/static/images/landing-page/signup/paper.jpg');
|
|
||||||
background-repeat: no-repeat, repeat-x, repeat-x, repeat;
|
|
||||||
background-position: center, top, bottom, center;
|
|
||||||
background-size: 100%, 40px auto, 40px auto, auto;
|
|
||||||
border-radius: 2px;
|
|
||||||
-webkit-border-radius: 2px;
|
|
||||||
-moz-border-radius: 2px;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
transform: rotate(359deg);
|
|
||||||
-webkit-transform: rotate(359deg);
|
|
||||||
-moz-transform: rotate(359deg);
|
|
||||||
-o-transform: rotate(359deg);
|
|
||||||
-ms-transform: rotate(359deg);
|
|
||||||
box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -402,18 +387,7 @@ input.text-error {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: #116353; /* Old browsers */
|
background-color: #7e98ad;
|
||||||
background: -moz-linear-gradient(top, rgba(172,197,193,1) 0%, rgba(220,241,234,1) 100%); /* FF3.6+ */
|
|
||||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(172,197,193,1)), color-stop(100%,rgba(220,241,234,1))); /* Chrome,Safari4+ */
|
|
||||||
background: -webkit-linear-gradient(top, rgba(172,197,193,1) 0%,rgba(220,241,234,1) 100%); /* Chrome10+,Safari5.1+ */
|
|
||||||
background: -o-linear-gradient(top, rgba(172,197,193,1) 0%,rgba(220,241,234,1) 100%); /* Opera 11.10+ */
|
|
||||||
background: -ms-linear-gradient(top, rgba(172,197,193,1) 0%,rgba(220,241,234,1) 100%); /* IE10+ */
|
|
||||||
background: linear-gradient(to bottom, rgba(172,197,193,1) 0%,rgba(220,241,234,1) 100%); /* W3C */
|
|
||||||
|
|
||||||
background-image: url(/static/images/backgrounds/lightteal.png);
|
|
||||||
background-size: 180px 180px;
|
|
||||||
|
|
||||||
border-bottom: 1px solid #314945;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer {
|
.footer {
|
||||||
|
@ -424,16 +398,13 @@ input.text-error {
|
||||||
|
|
||||||
.header-main .logo {
|
.header-main .logo {
|
||||||
display: block;
|
display: block;
|
||||||
height: 30px;
|
|
||||||
padding-top: 10px;
|
|
||||||
padding-left: 5px;
|
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header-main .logoimage {
|
.header-main .logoimage {
|
||||||
width: 45px;
|
height: 40px;
|
||||||
height: auto;
|
width: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app {
|
.app {
|
||||||
|
@ -442,17 +413,7 @@ input.text-error {
|
||||||
}
|
}
|
||||||
|
|
||||||
.main-headline {
|
.main-headline {
|
||||||
background-color: #333;
|
background-color: white;
|
||||||
background-image: url('/static/images/landing-page/hd-back2.jpg');
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 54%, rgba(0,0,0,0.6) 100%), url('/static/images/landing-page/hd-back2.jpg'), #333;
|
|
||||||
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(54%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.6))), url('/static/images/landing-page/hd-back2.jpg'), #333;
|
|
||||||
background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 54%,rgba(0,0,0,0.6) 100%), url('/static/images/landing-page/hd-back2.jpg'), #333;
|
|
||||||
background: -o-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 54%,rgba(0,0,0,0.6) 100%), url('/static/images/landing-page/hd-back2.jpg'), #333;
|
|
||||||
background: -ms-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 54%,rgba(0,0,0,0.6) 100%), url('/static/images/landing-page/hd-back2.jpg'), #333;
|
|
||||||
background: radial-gradient(ellipse at center, rgba(0,0,0,0) 54%,rgba(0,0,0,0.6) 100%), url('/static/images/landing-page/hd-back2.jpg'), #333;
|
|
||||||
background-position: center, center, center;
|
|
||||||
background-size: auto, cover, auto;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -484,32 +445,13 @@ input.text-error {
|
||||||
}
|
}
|
||||||
|
|
||||||
.feature-line.dark {
|
.feature-line.dark {
|
||||||
background: -moz-linear-gradient(top, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0) 100%), url('/static/images/backgrounds/greenfabric.png'); /* FF3.6+ */
|
background: #ddedf6;
|
||||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.25)), color-stop(100%,rgba(0,0,0,0))), url('/static/images/backgrounds/greenfabric.png'); /* Chrome,Safari4+ */
|
color: black;
|
||||||
background: -webkit-linear-gradient(top, rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 100%), url('/static/images/backgrounds/greenfabric.png'); /* Chrome10+,Safari5.1+ */
|
|
||||||
background: -o-linear-gradient(top, rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 100%), url('/static/images/backgrounds/greenfabric.png'); /* Opera 11.10+ */
|
|
||||||
background: -ms-linear-gradient(top, rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 100%), url('/static/images/backgrounds/greenfabric.png'); /* IE10+ */
|
|
||||||
background: linear-gradient(to bottom, rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 100%), url('/static/images/backgrounds/greenfabric.png'); /* W3C */
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.feature-line.dark a {
|
|
||||||
color: #ddf;
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.feature-line.dark a:hover {
|
|
||||||
color: #fff;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.feature-line.light {
|
.feature-line.light {
|
||||||
background: -moz-linear-gradient(top, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0) 100%), url('/static/images/backgrounds/lightfabric.png'); /* FF3.6+ */
|
background: white;
|
||||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.15)), color-stop(100%,rgba(0,0,0,0))), url('/static/images/backgrounds/lightfabric.png'); /* Chrome,Safari4+ */
|
}
|
||||||
background: -webkit-linear-gradient(top, rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 100%), url('/static/images/backgrounds/lightfabric.png'); /* Chrome10+,Safari5.1+ */
|
|
||||||
background: -o-linear-gradient(top, rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 100%), url('/static/images/backgrounds/lightfabric.png'); /* Opera 11.10+ */
|
|
||||||
background: -ms-linear-gradient(top, rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 100%), url('/static/images/backgrounds/lightfabric.png'); /* IE10+ */
|
|
||||||
background: linear-gradient(to bottom, rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 100%), url('/static/images/backgrounds/lightfabric.png'); /* W3C */
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.feature-line .feature-text {
|
.feature-line .feature-text {
|
||||||
|
@ -902,8 +844,7 @@ a.bottom-signup-button {
|
||||||
.main-headline-text {
|
.main-headline-text {
|
||||||
display: block;
|
display: block;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
color: #fff;
|
color: black;
|
||||||
text-shadow: 0px 0px 4px rgba(0,0,0,1);
|
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -915,7 +856,7 @@ a.bottom-signup-button {
|
||||||
.main-headline-text .footnote {
|
.main-headline-text .footnote {
|
||||||
display: block;
|
display: block;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
color: #fff;
|
color: black;
|
||||||
margin-top: 15px;
|
margin-top: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -923,7 +864,6 @@ a.bottom-signup-button {
|
||||||
margin-top: 15px;
|
margin-top: 15px;
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
font-size: 22px;
|
font-size: 22px;
|
||||||
box-shadow: 0px 0px 4px rgba(0,0,0,0.4);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.app-main,
|
.app-main,
|
||||||
|
@ -956,20 +896,12 @@ a.bottom-signup-button {
|
||||||
|
|
||||||
.footer-navigation li, .footer-navigation li a {
|
.footer-navigation li, .footer-navigation li a {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
color: #ddd;
|
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
color: black;
|
||||||
|
|
||||||
.footer-navigation li a {
|
|
||||||
-moz-transition: all 0.2s ease-in;
|
|
||||||
-webkit-transition: all 0.2s ease-in;
|
|
||||||
-o-transition: all 0.2s ease-in;
|
|
||||||
transition: all 0.2s ease-in;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer-navigation li a:hover {
|
.footer-navigation li a:hover {
|
||||||
color: #fff;
|
color: black;
|
||||||
text-decoration: none !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.little-bullet {
|
.little-bullet {
|
||||||
|
@ -994,7 +926,7 @@ a.bottom-signup-button {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding-top: 10px;
|
padding-top: 10px;
|
||||||
padding-right: 10px;
|
padding-right: 10px;
|
||||||
color: #cccccc;
|
color: black;
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
|
@ -1005,8 +937,7 @@ a.bottom-signup-button {
|
||||||
}
|
}
|
||||||
|
|
||||||
.top-links a:hover {
|
.top-links a:hover {
|
||||||
color: #ffffff;
|
color: black;
|
||||||
text-decoration: none;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mixpanel-badge {
|
.mixpanel-badge {
|
||||||
|
|
|
@ -283,7 +283,7 @@
|
||||||
|
|
||||||
<div class="app feature-line">
|
<div class="app feature-line">
|
||||||
<div class="app-main feature-line-container centered-content">
|
<div class="app-main feature-line-container centered-content">
|
||||||
<a href="{% url 'signup' %}" class="bottom-signup-button btn btn-large btn-info">Sign up now</a>
|
<a href="{% url 'signup' %}" class="bottom-signup-button btn btn-large btn-primary">Sign up now</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -69,7 +69,7 @@
|
||||||
|
|
||||||
<div class="signup-signature">
|
<div class="signup-signature">
|
||||||
<p>I'm looking forward to it!</p>
|
<p>I'm looking forward to it!</p>
|
||||||
<button type="submit" id="beta-signup" class="btn btn-large btn-info">Sign up</button>
|
<button type="submit" id="beta-signup" class="btn btn-large btn-primary">Sign up</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -11,18 +11,18 @@
|
||||||
</span>
|
</span>
|
||||||
<span class="footnote">* It's also great for sharing cat pictures.</span>
|
<span class="footnote">* It's also great for sharing cat pictures.</span>
|
||||||
{% if not_enterprise %}
|
{% if not_enterprise %}
|
||||||
<a href="{% url 'signup' %}" class="main-signup-button btn btn-large btn-info">Sign up now, for free!</a>
|
<a href="{% url 'signup' %}" class="main-signup-button btn btn-large btn-primary">Sign up now, for free!</a>
|
||||||
{% elif only_sso %}
|
{% elif only_sso %}
|
||||||
<a href="{% url 'login-sso' %}" class="main-signup-button btn btn-large btn-info">Log in now!</a>
|
<a href="{% url 'login-sso' %}" class="main-signup-button btn btn-large btn-primary">Log in now!</a>
|
||||||
{% else %}
|
{% else %}
|
||||||
<a href="{% url 'register' %}" class="main-signup-button btn btn-large btn-info">Register now!</a>
|
<a href="{% url 'register' %}" class="main-signup-button btn btn-large btn-primary">Register now!</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
<img src="/static/images/landing-page/laptop-screenshot.png" class="main-image" alt="Screenshot of Zulip" />
|
<img src="/static/images/landing-page/laptop-screenshot.png" class="main-image" alt="Screenshot of Zulip" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="app feature-line light">
|
<div class="app feature-line dark">
|
||||||
<div class="app-main feature-line-container">
|
<div class="app-main feature-line-container">
|
||||||
<div class="feature-text">
|
<div class="feature-text">
|
||||||
<span class="tagline">
|
<span class="tagline">
|
||||||
|
@ -43,7 +43,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="app feature-line dark">
|
<div class="app feature-line light">
|
||||||
<div class="app-main feature-line-container">
|
<div class="app-main feature-line-container">
|
||||||
<div class="feature-text">
|
<div class="feature-text">
|
||||||
<span class="tagline">
|
<span class="tagline">
|
||||||
|
@ -64,7 +64,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="app feature-line light">
|
<div class="app feature-line dark">
|
||||||
<div class="app-main feature-line-container">
|
<div class="app-main feature-line-container">
|
||||||
<div class="feature-text">
|
<div class="feature-text">
|
||||||
<span class="tagline">
|
<span class="tagline">
|
||||||
|
@ -82,7 +82,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="app feature-line dark">
|
<div class="app feature-line light">
|
||||||
<div class="app-main feature-line-container">
|
<div class="app-main feature-line-container">
|
||||||
<div class="feature-text">
|
<div class="feature-text">
|
||||||
<span class="tagline">
|
<span class="tagline">
|
||||||
|
@ -102,7 +102,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="app feature-line light">
|
<div class="app feature-line dark">
|
||||||
<div class="app-main feature-line-container">
|
<div class="app-main feature-line-container">
|
||||||
<div class="feature-text">
|
<div class="feature-text">
|
||||||
<span class="tagline">
|
<span class="tagline">
|
||||||
|
@ -120,7 +120,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="app feature-line dark">
|
<div class="app feature-line light">
|
||||||
<div class="app-main feature-line-container">
|
<div class="app-main feature-line-container">
|
||||||
<div class="feature-text">
|
<div class="feature-text">
|
||||||
<span class="tagline">
|
<span class="tagline">
|
||||||
|
@ -138,7 +138,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="app feature-line light">
|
<div class="app feature-line dark">
|
||||||
<div class="app-main feature-line-container">
|
<div class="app-main feature-line-container">
|
||||||
<div class="platform-text">
|
<div class="platform-text">
|
||||||
<span class="tagline">
|
<span class="tagline">
|
||||||
|
@ -174,14 +174,14 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="app feature-line dark">
|
<div class="app feature-line light">
|
||||||
<div class="app-main feature-line-container centered-content">
|
<div class="app-main feature-line-container centered-content">
|
||||||
{% if not_enterprise %}
|
{% if not_enterprise %}
|
||||||
<a href="{% url 'signup' %}" class="bottom-signup-button btn btn-large btn-info">Sign up now</a>
|
<a href="{% url 'signup' %}" class="bottom-signup-button btn btn-large btn-primary">Sign up now</a>
|
||||||
{% elif only_sso %}
|
{% elif only_sso %}
|
||||||
<a href="{% url 'login-sso' %}" class="bottom-signup-button btn btn-large btn-info">Log in now</a>
|
<a href="{% url 'login-sso' %}" class="bottom-signup-button btn btn-large btn-primary">Log in now</a>
|
||||||
{% else %}
|
{% else %}
|
||||||
<a href="{% url 'register' %}" class="bottom-signup-button btn btn-large btn-info">Register now</a>
|
<a href="{% url 'register' %}" class="bottom-signup-button btn btn-large btn-primary">Register now</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -18,7 +18,7 @@ hence the name.
|
||||||
<div class="header-main" id="top_navbar">
|
<div class="header-main" id="top_navbar">
|
||||||
<div class="column-left">
|
<div class="column-left">
|
||||||
<div>
|
<div>
|
||||||
<a class="brand logo" href="/"><img src="/static/images/logo/zulip@2x.png" class="logoimage" alt="Zulip" content="Zulip" /></a>
|
<a class="brand logo" href="/"><img src="/static/images/logo/zulipcornerlogo@2x.png" class="logoimage" alt="Zulip" content="Zulip" /></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue