fix(styles): large blur radius is causing color issues with safari

pull/3126/head
Divyansh Singh 8 months ago
parent 56b3ce5032
commit a31e143afa

@ -33,13 +33,14 @@ features:
title: Ship Fast Sites title: Ship Fast Sites
details: Fast initial load with static HTML, fast post-load navigation with client-side routing. details: Fast initial load with static HTML, fast post-load navigation with client-side routing.
--- ---
<style> <style>
:root { :root {
--vp-home-hero-name-color: transparent; --vp-home-hero-name-color: transparent;
--vp-home-hero-name-background: -webkit-linear-gradient(120deg, #bd34fe 30%, #41d1ff); --vp-home-hero-name-background: -webkit-linear-gradient(120deg, #bd34fe 30%, #41d1ff);
--vp-home-hero-image-background-image: linear-gradient(-45deg, #bd34fe 50%, #47caff 50%); --vp-home-hero-image-background-image: linear-gradient(-45deg, #bd34fe 50%, #47caff 50%);
--vp-home-hero-image-filter: blur(40px); --vp-home-hero-image-filter: blur(44px);
} }
@media (min-width: 640px) { @media (min-width: 640px) {
@ -50,7 +51,7 @@ features:
@media (min-width: 960px) { @media (min-width: 960px) {
:root { :root {
--vp-home-hero-image-filter: blur(72px); --vp-home-hero-image-filter: blur(68px);
} }
} }
</style> </style>

@ -103,7 +103,7 @@
#bd34fe 50%, #bd34fe 50%,
#47caff 50% #47caff 50%
); );
--vp-home-hero-image-filter: blur(40px); --vp-home-hero-image-filter: blur(44px);
} }
@media (min-width: 640px) { @media (min-width: 640px) {
@ -114,7 +114,7 @@
@media (min-width: 960px) { @media (min-width: 960px) {
:root { :root {
--vp-home-hero-image-filter: blur(72px); --vp-home-hero-image-filter: blur(68px);
} }
} }

Loading…
Cancel
Save