mirror of https://github.com/zulip/zulip.git
plans_page: Rough out structures and grid layout.
This commit is contained in:
parent
a6498ad666
commit
52f8f56286
|
@ -16,12 +16,56 @@
|
|||
<div class="portico-pricing plans">
|
||||
<div class="main">
|
||||
{% include "corporate/pricing_model.html" %}
|
||||
<div class="plans_top_faq plans_faq_questions">
|
||||
<h2>Other questions?</h2>
|
||||
<p>
|
||||
See our <a href="/help/zulip-cloud-billing">billing help page</a> for
|
||||
additional details
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="additional-pricing-information">
|
||||
<div class="discounts-section">
|
||||
<header>
|
||||
<h2>Discounts?</h2>
|
||||
<p>
|
||||
We sponsor hundreds of worthy organizations
|
||||
</p>
|
||||
</header>
|
||||
<div class="discounted-community-plan">
|
||||
<h3>Community plan</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/for/open-source/">Open source projects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/for/research/">Research groups or departments</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/for/events/">Academic conferences and most other non-profit events</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="discounted-business-plan">
|
||||
<h3>Business plan with 85% discount</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/for/education/">Education</a> (online or in-person)
|
||||
</li>
|
||||
<li>
|
||||
<a href="/for/communities/">Non-profits and communities</a>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="{{ sponsorship_url }}">Request sponsorship</a>
|
||||
<p>
|
||||
If you don’t have a Zulip account yet, contact us via
|
||||
<a href="mailto:contact@zulip.com">contact@zulip.com</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="questions-section">
|
||||
<header>
|
||||
<h2>Other questions?</h2>
|
||||
<p>
|
||||
See our <a href="/help/zulip-cloud-billing">billing help page</a> for
|
||||
additional details
|
||||
</p>
|
||||
</header>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/help/zulip-cloud-billing#differences-between-zulip-cloud-plans">Differences between Zulip Cloud plans</a>
|
||||
|
@ -47,44 +91,7 @@
|
|||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="discounts-section">
|
||||
<header>
|
||||
<h2>Discounts?</h2>
|
||||
<p>
|
||||
We sponsor hundreds of worthy organizations
|
||||
</p>
|
||||
</header>
|
||||
<div class="discounted-community-plan">
|
||||
<h3>Community plan</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/for/open-source/">Open source projects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/for/research/">Research groups or departments</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/for/events/">Academic conferences and most other non-profit events</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="discounted-business-plan">
|
||||
<h3>Business plan with 85% discount</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/for/education/">Education</a> (online or in-person)
|
||||
</li>
|
||||
<li>
|
||||
<a href="/for/communities/">Non-profits and communities</a>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="{{ sponsorship_url }}">Request sponsorship</a>
|
||||
<p>
|
||||
If you don’t have a Zulip account yet, contact us via
|
||||
<a href="mailto:contact@zulip.com">contact@zulip.com</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include 'zerver/footer.html' %}
|
||||
{% endblock %}
|
||||
|
|
|
@ -1062,9 +1062,7 @@ ul {
|
|||
}
|
||||
|
||||
.portico-pricing {
|
||||
.padded-content {
|
||||
padding: 102px 0;
|
||||
}
|
||||
padding: 102px 0 58px;
|
||||
|
||||
h1 {
|
||||
font-weight: 500;
|
||||
|
@ -1098,4 +1096,47 @@ ul {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pricing-container {
|
||||
display: grid;
|
||||
grid-template:
|
||||
". cloud-title self-hosted-title . " auto
|
||||
"pricing pricing pricing pricing" auto / 30px minmax(
|
||||
0,
|
||||
1fr
|
||||
) minmax(0, 1fr) 30px;
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.cloud-plan-title {
|
||||
grid-area: cloud-title;
|
||||
}
|
||||
|
||||
.cloud-plan-pricing {
|
||||
grid-area: pricing;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
|
||||
grid-template-rows: auto;
|
||||
}
|
||||
|
||||
.self-hosted-plan-title {
|
||||
grid-area: self-hosted-title;
|
||||
}
|
||||
|
||||
.self-hosted-plan-pricing {
|
||||
grid-area: pricing;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
|
||||
grid-template-rows: auto;
|
||||
}
|
||||
|
||||
.additional-pricing-information {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
grid-template-rows: auto;
|
||||
column-gap: 32px;
|
||||
max-width: 912px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue