guz013/keikos.work
1
0
Fork 0
Code Issues Pull Requests Activity

feat: desktop styling

Browse Source
This commit is contained in:
Guz
2024-12-16 15:35:09 -03:00
parent f49b460517
commit 1c55aaaef2
1 changed files with 16 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
handlers/pages/home.templ
View File

@@ -18,18 +18,24 @@ func (p *Home) ServeHTTP(w http.ResponseWriter, r *http.Request) {
templ (p *Home) page() {
@layouts.Page() {
<main class="fixed w-100% h-screen">
<h1 class="absolute z-3 top-0 left-0 text-stroke-1px text-stroke-white text-transparent text-9xl m-4 vertical-lr">
<main class="fixed w-100% h-screen md:flex justify-center items-center">
<h1
class={ "absolute z-3 top-0 left-0 text-stroke-1px text-stroke-white text-transparent text-9xl m-4 vertical-lr",
"md:relative md:m-0 md:horizontal-tb md:w-fit" }
>
Keiko <span class="font-japanese text-8xl">稽古</span>
</h1>
<div
class="absolute z-2 top-0 left-0 w-100% h-100% bg-gradient-to-r from-black opacity-50 to-transparent"
aria-hidden="true"
></div>
<img
class="absolute z-1 top-0 left-0 -translate-x-15% h-100%"
src="/assets/img/2.png"
/>
<div class="absolute z-2 w-100% h-100% md:flex justify-center items-center top-0 left-0">
<div
class={ "absolute z-2 top-0 left-0 w-100% h-100% bg-gradient-to-r from-black opacity-50 to-transparent",
"md:bg-gradient-to-t md:from-20% md:to-50% md:opacity-100" }
aria-hidden="true"
></div>
<img
class="absolute z-1 top-0 left-0 -translate-x-15% h-100% md:relative md:h-70% md:translate-x-0 md:rounded-xl"
src="/assets/img/2.png"
/>
</div>
</main>
<div
class="relative w-100% h-screen bg-gradient-to-t from-black to-transparent to-50% pointer-events-none"