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

portico: Fix trapsarent gradient styling inconsistencies. 

Instead of using the `trapsarent` keyword, which is interpreted
as Safari as black with an opacity of 0%, re-use the gradient colors
themselves in order to lead to a single color gradient. This allows
for the homepage to look the same regardless of browser.

Fix #11985.
This commit is contained in:
Marco Burstein 2019-03-25 15:48:40 -07:00 committed by Tim Abbott
parent 62d9241c03
commit feadc8bf46
1 changed files with 10 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
static/styles/landing-page.scss
View File

@ -702,23 +702,23 @@ nav ul li.active::after {
} }
.portico-landing.hello .gradients .gradient.dark-blue { .portico-landing.hello .gradients .gradient.dark-blue {
background: linear-gradient(10deg, transparent 50%, rgba(15, 46, 57, 0.7)); background: linear-gradient(10deg, rgba(15, 46, 57, 0) 50%, rgba(15, 46, 57, 0.7));
} }
.portico-landing.hello .gradients .gradient.green { .portico-landing.hello .gradients .gradient.green {
background: linear-gradient(-25deg, transparent 40%, hsl(156, 47%, 47%)); background: linear-gradient(-25deg, hsla(156, 47%, 47%, 0) 40%, hsl(156, 47%, 47%));
} }
.portico-landing.hello .gradients .gradient.blue { .portico-landing.hello .gradients .gradient.blue {
background: linear-gradient(25deg, transparent 40%, hsl(196, 38%, 51%)); background: linear-gradient(25deg, hsla(196, 38%, 51%, 0) 40%, hsl(196, 38%, 51%));
} }
.portico-landing.hello .gradients .gradient.sunburst { .portico-landing.hello .gradients .gradient.sunburst {
background: linear-gradient(5deg, transparent 20%, hsl(49, 71%, 68%)); background: linear-gradient(5deg, hsla(49, 71%, 68%, 0) 20%, hsl(49, 71%, 68%));
} }
.portico-landing.hello .gradients .gradient.white-fade { .portico-landing.hello .gradients .gradient.white-fade {
background: linear-gradient(0deg, hsl(0, 0%, 98%) 0%, transparent 40%); background: linear-gradient(0deg, hsl(0, 0%, 98%) 0%, hsla(0, 0%, 98%, 0) 40%);
} }
.portico-landing.hello .hero .waves { .portico-landing.hello .hero .waves {
@ -2792,23 +2792,23 @@ nav ul li.active::after {
} }
.gradients .gradient.dark-blue { .gradients .gradient.dark-blue {
background: linear-gradient(10deg, transparent 50%, rgba(15, 46, 57, 0.7)); background: linear-gradient(10deg, rgba(15, 46, 57, 0) 50%, rgba(15, 46, 57, 0.7));
} }
.gradients .gradient.green { .gradients .gradient.green {
background: linear-gradient(-25deg, transparent 40%, hsl(156, 47%, 47%)); background: linear-gradient(-25deg, hsla(156, 47%, 47%, 0) 40%, hsl(156, 47%, 47%));
} }
.gradients .gradient.blue { .gradients .gradient.blue {
background: linear-gradient(25deg, transparent 40%, hsl(196, 38%, 51%)); background: linear-gradient(25deg, hsla(196, 38%, 51%, 0) 40%, hsl(196, 38%, 51%));
} }
.gradients .gradient.sunburst { .gradients .gradient.sunburst {
background: linear-gradient(5deg, transparent 20%, hsl(49, 71%, 68%)); background: linear-gradient(5deg, hsla(49, 71%, 68%, 0) 20%, hsl(49, 71%, 68%));
} }
.gradients .gradient.white-fade { .gradients .gradient.white-fade {
background: linear-gradient(0deg, hsl(0, 0%, 98%) 0%, transparent 40%); background: linear-gradient(0deg, hsl(0, 0%, 98%) 0%, hsla(0, 0%, 98%, 0) 40%);
} }
/* -- pricing css -- */ /* -- pricing css -- */