Radiquum/radiquum.github.io
1
0
Fork 0
mirror of https://github.com/Radiquum/radiquum.github.io.git synced 2025-05-08 13:59:34 +05:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: better header scroll handling

Browse source
This commit is contained in:
Kentai Radiquum 2024-09-16 12:19:24 +05:00
parent 6c0f477436
commit 2c9fb22de2
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
3 changed files with 39 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

10
index.html
View file

@ -24,9 +24,9 @@
</div>
</div>
</header>
<div class="container h-screen" id="section_landing">
<div class="text-white h-full max-h-[60vh] relative">
<div class="bg-bg-pink w-full h-full max-h-[60vh] max-w-[46.25%] absolute top-0 right-0 -z-10"></div>
<div class="container px-2 2xl:h-screen" id="section_landing">
<div class="text-white h-full xl:max-h-[40vh] 2xl:max-h-[60vh] relative">
<div class="bg-bg-pink w-full h-full xl:max-h-[40vh] 2xl:max-h-[60vh] max-w-[46.25%] absolute top-0 right-0 -z-10"></div>
<div class="flex items-center justify-center gap-12 px-8 py-8">
<img src="./static/avatar_512.png" alt="" class="w-[256px] lg:w-[372px] 2xl:w-[512px]" />
<div>
@ -56,10 +56,10 @@
href="https://last.fm/user/radiquum" id="track-name" target="_blank" referrerpolicy="origin">"LOADING . . ."</a></p>
</div>
</div>
<div class="flex items-end justify-end w-full max-w-[45%] gap-4 p-8 font-medium text-4xl mb-[3%]">
<div class="flex items-end justify-end w-full max-w-[45%] gap-4 p-8 font-medium text-4xl mb-[3%] flex-col 2xl:flex-row">
<a class="border-black border-4 hover:translate-x-2 hover:-translate-y-2 shadow-transparent hover:shadow-md hover:shadow-black transition-all border-t-8 border-l-8 border-solid w-[320px] h-[75px] flex items-end justify-end pr-2 pb-2 bg-bg-blue"
href="#section_about">ABOUT ME</a>
<a class="border-black border-4 hover:translate-x-2 hover:-translate-y-2 shadow-transparent hover:shadow-md hover:shadow-black transition-all border-t-8 border-l-8 border-solid w-[300px] h-[75px] flex items-end justify-end pr-2 pb-2 bg-bg-blue"
<a class="border-black border-4 hover:translate-x-2 hover:-translate-y-2 shadow-transparent hover:shadow-md hover:shadow-black transition-all border-t-8 border-l-8 border-solid w-[320px] 2xl:w-[300px] h-[75px] flex items-end justify-end pr-2 pb-2 bg-bg-blue"
href="#section_links">LINKS</a>
</div>
</div>