alter links

This commit is contained in:
jasinco 2024-11-02 16:05:18 +08:00
parent b835f86fdf
commit 739dafc2c1
5 changed files with 56 additions and 19 deletions

View File

@ -12,4 +12,5 @@ body{
font-family: "LXGW WenKai TC", cursive;
font-weight: 400;
font-style: normal;
overflow-x: hidden;
}

View File

@ -1,6 +1,20 @@
<script lang="ts">
import "../app.css"
let { children } = $props();
let template1 = ["grid-cols-4 h-16", "col-span-3 text-4xl grid-cols-4", ""]
let template2 = ["grid-cols-1 grid-rows-4 h-1/4", "place-items-center row-span-3 text-6xl text-center", ""]
let template = $state(template1)
</script>
<div class="grid w-full {template[0]} sticky top-0">
<div class="grid {template[1]}">
<a class="m-auto" href="/">中工匿名</a>
</div>
<div class="grid grid-cols-3 grid-rows-1 text-center {template[2]}">
<a class="my-auto" href="/tos">服務條款</a>
<a class="my-auto" href="/links">鏈接</a>
<a class="my-auto" href="/fav">每月精選</a>
</div>
</div>
{@render children()}

View File

@ -1,26 +1,43 @@
<script lang="ts">
let sctop = $state(0)
let template1 = ["grid-cols-4 h-16", "col-span-3 text-3xl", ""]
let template2 = ["grid-cols-1 grid-rows-4 h-1/4", "row-span-3 text-6xl text-center", ""]
let template = $state(template2)
let body_state = $state(false);
$inspect(body_state)
const overlay = () => {
body_state = !body_state;
if(body_state){
document.body.classList.add("overflow-y-hidden");
}else{
document.body.classList.remove("overflow-y-hidden");
}
};
</script>
<svelte:window bind:scrollY={sctop}/>
<div class="grid w-full {template[0]}">
<div class="grid place-items-center {template[1]}">
<h1>中工匿名</h1>
<div style="width:100dvw;" class="h-dvh grid">
<p class="justify-self-center m-auto">空空如也...</p>
</div>
<div class="grid grid-cols-3 grid-rows-1 text-center {template[2]}">
<p class="my-auto">服務條款</p>
<p class="my-auto">鏈接</p>
<p class="my-auto">每月精選</p>
<button id="add" onclick={overlay}>
+
</button>
<div id="overlay" class:overlay_enable={body_state} class:hidden={!body_state}>
<div>
<button onclick={overlay}>close</button>
</div>
</div>
<div style="width:100dvw;" class="h-3/4">
</div>
<style>
#add{
position: fixed;
bottom:calc(15dvh);
right:calc(10dvw);
}
#overlay{
position: fixed;
width:100%;
height: 100%;
top:0;
left:0;
z-index: 10;
cursor:pointer;
}
.overlay_enable{
backdrop-filter: blur(3px);
}
</style>

View File

View File

@ -0,0 +1,5 @@
<div class="flex justify-center">
<p class="w-1/2 break-keep text-2xl">
“中工匿名”不記錄個人網路位置, 名字。可選用匿名,或佚名作為發表時署名。如訊息侵害他人權利,違反大眾道德觀,皆不保證留存。
</p>
</div>