nercone-dev/website
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Activity

--

Browse Source
This commit is contained in:
nercone
2026-04-25 18:38:17 +09:00
parent 6bc97e0057
commit 5e354c3935
2 changed files with 11 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/assets/css/style-extra.css
+10 -5
View File
@@ -39,11 +39,16 @@ header::after {
-webkit-mask-image: linear-gradient(to top, transparent var(--from), black var(--to)); -webkit-mask-image: linear-gradient(to top, transparent var(--from), black var(--to));
mask-image: linear-gradient(to top, transparent var(--from), black var(--to)); mask-image: linear-gradient(to top, transparent var(--from), black var(--to));
} }
.header-blur > div:nth-child(1) { --blur: 1px; --from: 0%; --to: 20%; } .header-blur > div:nth-child(1) { --blur: 0.5px; --from: 0%; --to: 10%; }
.header-blur > div:nth-child(2) { --blur: 2px; --from: 20%; --to: 40%; } .header-blur > div:nth-child(2) { --blur: 1px; --from: 10%; --to: 20%; }
.header-blur > div:nth-child(3) { --blur: 4px; --from: 40%; --to: 60%; } .header-blur > div:nth-child(3) { --blur: 1.5px; --from: 20%; --to: 30%; }
.header-blur > div:nth-child(4) { --blur: 8px; --from: 60%; --to: 80%; } .header-blur > div:nth-child(4) { --blur: 2px; --from: 30%; --to: 40%; }
.header-blur > div:nth-child(5) { --blur: 16px; --from: 80%; --to: 100%; } .header-blur > div:nth-child(5) { --blur: 3px; --from: 40%; --to: 50%; }
.header-blur > div:nth-child(6) { --blur: 4px; --from: 50%; --to: 60%; }
.header-blur > div:nth-child(7) { --blur: 6px; --from: 60%; --to: 70%; }
.header-blur > div:nth-child(8) { --blur: 8px; --from: 70%; --to: 80%; }
.header-blur > div:nth-child(9) { --blur: 12px; --from: 80%; --to: 90%; }
.header-blur > div:nth-child(10) { --blur: 16px; --from: 90%; --to: 100%; }
/* Fonts */ /* Fonts */
@font-face { @font-face {
public/assets/js/script-extra.js
+1 -1
View File
@@ -6,7 +6,7 @@ function initProgressiveHeaderBlur() {
const container = document.createElement('div'); const container = document.createElement('div');
container.className = 'header-blur'; container.className = 'header-blur';
container.setAttribute('aria-hidden', 'true'); container.setAttribute('aria-hidden', 'true');
for (let i = 0; i < 5; i++) container.appendChild(document.createElement('div')); for (let i = 0; i < 10; i++) container.appendChild(document.createElement('div'));
header.prepend(container); header.prepend(container);
} }
initProgressiveHeaderBlur(); initProgressiveHeaderBlur();