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

portico: Extend proper background gradients to /plans.

This commit is contained in:
Karl Stolley 2024-01-15 09:39:01 -06:00 committed by Tim Abbott
parent cc4bb3493a
commit 906559c2b5
3 changed files with 33 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
templates/corporate/plans.html
View File

@ -16,6 +16,9 @@
{% endif %}
<div class="portico-pricing plans {% if is_self_hosted_realm %} showing-self-hosted {% else %} showing-cloud {% endif %}">
<div class="body-bg">
<div class="body-bg__layer"></div>
</div>
<div class="main">
{% include "corporate/pricing_model.html" %}
</div>

52
web/styles/portico/hello.css
View File

@ -40,6 +40,32 @@ ul {
margin: 0;
}
.body-bg {
position: relative;
width: 0;
height: 0;
}
.body-bg__layer {
position: fixed;
z-index: -1;
width: 100vw;
height: 100vh;
background: linear-gradient(
180deg,
hsl(209.4deg 40.2% 50.2%) 30%,
hsl(238.4deg 27.9% 26.7%) 70%
);
@media (prefers-color-scheme: dark) {
background: linear-gradient(
180deg,
hsl(209deg 63% 40%) 30%,
hsl(238deg 28% 21%) 70%
);
}
}
.portico-hello-page {
._full-height-no-scroll {
height: 100%;
@ -63,24 +89,6 @@ ul {
border-style: none;
}
.body-bg {
position: relative;
width: 0;
height: 0;
}
.body-bg__layer {
position: fixed;
z-index: -1;
width: 100vw;
height: 100vh;
background: linear-gradient(
180deg,
hsl(209.4deg 40.2% 50.2%) 30%,
hsl(238.4deg 27.9% 26.7%) 70%
);
}
.page-wrapper {
height: 100vh;
overflow: scroll;
@ -603,14 +611,6 @@ ul {
background: hsl(209deg 63% 40%);
}
.body-bg__layer {
background: linear-gradient(
180deg,
hsl(209deg 63% 40%) 30%,
hsl(238deg 28% 21%) 70%
);
}
.screen-1 {
background: linear-gradient(
180deg,

8
web/styles/portico/pricing_plans.css
View File

@ -34,15 +34,15 @@
padding: 102px 0 58px;
background: linear-gradient(
180deg,
hsl(209deg 40% 50%) 0%,
hsl(210deg 48% 69%) 100%
var(--color-background-gradient-start) 0%,
var(--color-background-gradient-end) 100%
);
@media (prefers-color-scheme: dark) {
background: linear-gradient(
180deg,
hsl(209deg 63% 40%) 30%,
hsl(238deg 28% 50%) 100%
var(--color-background-gradient-start) 30%,
var(--color-background-gradient-end) 100%
);
}