jonah/jonahbauer.eu
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add browser specific optimizations

Browse Source 
- firefox has a problem with flashes of unstyled content
- chrome only supports mask-image without -webkit prefix very recently
This commit is contained in:
jbb01 2024-09-13 16:40:49 +02:00
parent 42ba20a075
commit c96af40b2d
2 changed files with 6 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.css
View File

@ -24,6 +24,8 @@ html::before {
z-index: -1; z-index: -1;
background: conic-gradient(from 0deg in hsl longer hue, hsl(0deg 100% 12.5%) 0 0); background: conic-gradient(from 0deg in hsl longer hue, hsl(0deg 100% 12.5%) 0 0);
-webkit-mask-image: url("pattern.svg");
-webkit-mask-size: 5rem;
mask-image: url("pattern.svg"); mask-image: url("pattern.svg");
mask-size: 5rem; mask-size: 5rem;
} }

4
index.html
View File

@ -9,6 +9,10 @@
<link href="https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap" rel="stylesheet">
<link href="index.css" rel="stylesheet"/> <link href="index.css" rel="stylesheet"/>
<script>
/*to prevent Firefox FOUC, this must be here*/
let FF_FOUC_FIX;
</script>
</head> </head>
<body> <body>
<main class="content"> <main class="content">