1<!DOCTYPE html><html lang="en"> <head><meta charset="UTF-8"><meta name="description" content="ä¸è詩社網ç«"><meta name="viewport" content="width=device-width"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v3.6.5"><title>Home | ä¸è詩社</title><meta property="og:image" content=""><meta name="twitter:image" content=""><meta name="astro-view-transitions-enabled" content="true"><meta name="astro-view-transitions-fallback" content="none"><!-- Other head elements --><link href="https://font.emtech.cc/css/LXGWZhenKai" rel="stylesheet"><link href="https://font.emtech.cc/css/ChironSungHKIt" rel="stylesheet"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" crossorigin="anonymous" referrerpolicy="no-referrer"><link rel="stylesheet" href="/_astro/arts.77693c2f.css" /> 2<style>.recent[data-astro-cid-ghu2dq4w]{width:50%}.recent[data-astro-cid-ghu2dq4w] h2[data-astro-cid-ghu2dq4w]{font-family:ChironSungHKIt,"Noto Serif TC";color:#f0f8ff;background-color:#411598;padding:.5rem 0 1rem 1rem;position:relative;top:1rem;z-index:10;text-align:left;left:.5rem;font-weight:700} 3@keyframes astroFadeInOut{0%{opacity:1}to{opacity:0}}@keyframes astroFadeIn{0%{opacity:0}}@keyframes astroFadeOut{to{opacity:0}}@keyframes astroSlideFromRight{0%{transform:translate(100%)}}@keyframes astroSlideFromLeft{0%{transform:translate(-100%)}}@keyframes astroSlideToRight{to{transform:translate(100%)}}@keyframes astroSlideToLeft{to{transform:translate(-100%)}}@media (prefers-reduced-motion){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}[data-astro-transition-scope]{animation:none!important}} 4.club-name[data-astro-cid-vugpofcr]{letter-spacing:69%;font-family:LXGWZhenKai,"Noto Serif TC";font-weight:200}.panel-row[data-astro-cid-vugpofcr]{display:flex;min-height:360px}.panel[data-astro-cid-vugpofcr]{position:relative;overflow:hidden;isolation:isolate;flex:1}.panel[data-astro-cid-vugpofcr]:not(:first-child){margin-left:-6vw}.panel[data-astro-cid-vugpofcr] img[data-astro-cid-vugpofcr]{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;filter:saturate(.95)}.panel[data-astro-cid-vugpofcr]:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.5));z-index:1}.panel-label[data-astro-cid-vugpofcr]{position:absolute;bottom:12%;font-size:clamp(1.4rem,2vw,2.8rem);font-weight:700;z-index:2;text-shadow:0 4px 14px rgba(0,0,0,.65)}.panel-label[data-astro-cid-vugpofcr].left{left:12%}.panel-label[data-astro-cid-vugpofcr].center{left:50%;transform:translate(-50%)}.panel-label[data-astro-cid-vugpofcr].right{right:12%;text-align:right}.panel-0[data-astro-cid-vugpofcr]{clip-path:polygon(0 0,98% 0,80% 100%,0 100%)}.panel-1[data-astro-cid-vugpofcr]{clip-path:polygon(18% 0,100% 0,82% 100%,0 100%)}.panel-2[data-astro-cid-vugpofcr]{clip-path:polygon(22% 0,100% 0,100% 100%,6% 100%)}@media (max-width: 1024px){.panel-row[data-astro-cid-vugpofcr]{display:grid;grid-template-columns:1fr;min-height:540px}.panel[data-astro-cid-vugpofcr]{clip-path:none!important;min-height:180px;margin-left:0}.panel-label[data-astro-cid-vugpofcr]{left:10%;transform:none}} 5</style>
5<script type="module" src="/_astro/hoisted.fd9121c2.js"></script>
5<style>[data-astro-transition-scope="astro-nhjkrpzs-1"] { view-transition-name: page_header; }@layer astro { ::view-transition-old(page_header) { 6 animation-duration: 180ms; 7 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 8 animation-fill-mode: both; 9 animation-name: astroFadeOut; }::view-transition-new(page_header) { 10 animation-duration: 180ms; 11 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 12 animation-fill-mode: both; 13 animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(page_header) { 14 animation-duration: 180ms; 15 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 16 animation-fill-mode: both; 17 animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(page_header) { 18 animation-duration: 180ms; 19 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 20 animation-fill-mode: both; 21 animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-nhjkrpzs-1"], 22 [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-nhjkrpzs-1"] { 23 animation-duration: 180ms; 24 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 25 animation-fill-mode: both; 26 animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-nhjkrpzs-1"], 27 [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-nhjkrpzs-1"] { 28 animation-duration: 180ms; 29 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 30 animation-fill-mode: both; 31 animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-nhjkrpzs-1"], 32 [data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-nhjkrpzs-1"] { 33 animation-duration: 180ms; 34 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 35 animation-fill-mode: both; 36 animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-nhjkrpzs-1"], 37 [data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="astro-nhjkrpzs-1"] { 38 animation-duration: 180ms; 39 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 40 animation-fill-mode: both; 41 animation-name: astroFadeIn; }</style><style>[data-astro-transition-scope="astro-h7nwt3kp-2"] { view-transition-name: playlist_3_image; }@layer astro { ::view-transition-old(playlist_3_image) { 42 animation-duration: 180ms; 43 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 44 animation-fill-mode: both; 45 animation-name: astroFadeOut; }::view-transition-new(playlist_3_image) { 46 animation-duration: 180ms; 47 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 48 animation-fill-mode: both; 49 animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(playlist_3_image) { 50 animation-duration: 180ms; 51 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 52 animation-fill-mode: both; 53 animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(playlist_3_image) { 54 animation-duration: 180ms; 55 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 56 animation-fill-mode: both; 57 animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-h7nwt3kp-2"], 58 [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-h7nwt3kp-2"] { 59 animation-duration: 180ms; 60 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 61 animation-fill-mode: both; 62 animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-h7nwt3kp-2"], 63 [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-h7nwt3kp-2"] { 64 animation-duration: 180ms; 65 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 66 animation-fill-mode: both; 67 animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-h7nwt3kp-2"], 68 [data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-h7nwt3kp-2"] { 69 animation-duration: 180ms; 70 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 71 animation-fill-mode: both; 72 animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-h7nwt3kp-2"], 73 [data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="astro-h7nwt3kp-2"] { 74 animation-duration: 180ms; 75 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 76 animation-fill-mode: both; 77 animation-name: astroFadeIn; }</style><style>[data-astro-transition-scope="astro-mfp6ouip-3"] { view-transition-name: playlist_3_title; }@layer astro { ::view-transition-old(playlist_3_title) { 78 animation-duration: 180ms; 79 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 80 animation-fill-mode: both; 81 animation-name: astroFadeOut; }::view-transition-new(playlist_3_title) { 82 animation-duration: 180ms; 83 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 84 animation-fill-mode: both; 85 animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(playlist_3_title) { 86 animation-duration: 180ms; 87 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 88 animation-fill-mode: both; 89 animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(playlist_3_title) { 90 animation-duration: 180ms; 91 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 92 animation-fill-mode: both; 93 animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-mfp6ouip-3"], 94 [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-mfp6ouip-3"] { 95 animation-duration: 180ms; 96 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 97 animation-fill-mode: both; 98 animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-mfp6ouip-3"], 99 [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-mfp6ouip-3"] { 100 animation-duration: 180ms; 101 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 102 animation-fill-mode: both; 103 animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-mfp6ouip-3"], 104 [data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-mfp6ouip-3"] { 105 animation-duration: 180ms; 106 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 107 animation-fill-mode: both; 108 animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-mfp6ouip-3"], 109 [data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="astro-mfp6ouip-3"] { 110 animation-duration: 180ms; 111 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 112 animation-fill-mode: both; 113 animation-name: astroFadeIn; }</style><style>[data-astro-transition-scope="astro-rv64uwof-4"] { view-transition-name: playlist_3_box; }@layer astro { ::view-transition-old(playlist_3_box) { 114 animation-duration: 180ms; 115 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 116 animation-fill-mode: both; 117 animation-name: astroFadeOut; }::view-transition-new(playlist_3_box) { 118 animation-duration: 180ms; 119 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 120 animation-fill-mode: both; 121 animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(playlist_3_box) { 122 animation-duration: 180ms; 123 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 124 animation-fill-mode: both; 125 animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(playlist_3_box) { 126 animation-duration: 180ms; 127 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 128 animation-fill-mode: both; 129 animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-rv64uwof-4"], 130 [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-rv64uwof-4"] { 131 animation-duration: 180ms; 132 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 133 animation-fill-mode: both; 134 animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-rv64uwof-4"], 135 [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-rv64uwof-4"] { 136 animation-duration: 180ms; 137 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 138 animation-fill-mode: both; 139 animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-rv64uwof-4"], 140 [data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-rv64uwof-4"] { 141 animation-duration: 180ms; 142 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 143 animation-fill-mode: both; 144 animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-rv64uwof-4"], 145 [data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="astro-rv64uwof-4"] { 146 animation-duration: 180ms; 147 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 148 animation-fill-mode: both; 149 animation-name: astroFadeIn; }</style><style>[data-astro-transition-scope="astro-h7nwt3kp-5"] { view-transition-name: playlist_2_image; }@layer astro { ::view-transition-old(playlist_2_image) { 150 animation-duration: 180ms; 151 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 152 animation-fill-mode: both; 153 animation-name: astroFadeOut; }::view-transition-new(playlist_2_image) { 154 animation-duration: 180ms; 155 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 156 animation-fill-mode: both; 157 animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(playlist_2_image) { 158 animation-duration: 180ms; 159 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 160 animation-fill-mode: both; 161 animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(playlist_2_image) { 162 animation-duration: 180ms; 163 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 164 animation-fill-mode: both; 165 animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-h7nwt3kp-5"], 166 [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-h7nwt3kp-5"] { 167 animation-duration: 180ms; 168 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 169 animation-fill-mode: both; 170 animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-h7nwt3kp-5"], 171 [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-h7nwt3kp-5"] { 172 animation-duration: 180ms; 173 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 174 animation-fill-mode: both; 175 animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-h7nwt3kp-5"], 176 [data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-h7nwt3kp-5"] { 177 animation-duration: 180ms; 178 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 179 animation-fill-mode: both; 180 animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-h7nwt3kp-5"], 181 [data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="astro-h7nwt3kp-5"] { 182 animation-duration: 180ms; 183 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 184 animation-fill-mode: both; 185 animation-name: astroFadeIn; }</style><style>[data-astro-transition-scope="astro-mfp6ouip-6"] { view-transition-name: playlist_2_title; }@layer astro { ::view-transition-old(playlist_2_title) { 186 animation-duration: 180ms; 187 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 188 animation-fill-mode: both; 189 animation-name: astroFadeOut; }::view-transition-new(playlist_2_title) { 190 animation-duration: 180ms; 191 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 192 animation-fill-mode: both; 193 animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(playlist_2_title) { 194 animation-duration: 180ms; 195 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 196 animation-fill-mode: both; 197 animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(playlist_2_title) { 198 animation-duration: 180ms; 199 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 200 animation-fill-mode: both; 201 animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-mfp6ouip-6"], 202 [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-mfp6ouip-6"] { 203 animation-duration: 180ms; 204 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 205 animation-fill-mode: both; 206 animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-mfp6ouip-6"], 207 [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-mfp6ouip-6"] { 208 animation-duration: 180ms; 209 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 210 animation-fill-mode: both; 211 animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-mfp6ouip-6"], 212 [data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-mfp6ouip-6"] { 213 animation-duration: 180ms; 214 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 215 animation-fill-mode: both; 216 animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-mfp6ouip-6"], 217 [data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="astro-mfp6ouip-6"] { 218 animation-duration: 180ms; 219 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 220 animation-fill-mode: both; 221 animation-name: astroFadeIn; }</style><style>[data-astro-transition-scope="astro-rv64uwof-7"] { view-transition-name: playlist_2_box; }@layer astro { ::view-transition-old(playlist_2_box) { 222 animation-duration: 180ms; 223 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 224 animation-fill-mode: both; 225 animation-name: astroFadeOut; }::view-transition-new(playlist_2_box) { 226 animation-duration: 180ms; 227 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 228 animation-fill-mode: both; 229 animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(playlist_2_box) { 230 animation-duration: 180ms; 231 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 232 animation-fill-mode: both; 233 animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(playlist_2_box) { 234 animation-duration: 180ms; 235 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 236 animation-fill-mode: both; 237 animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-rv64uwof-7"], 238 [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-rv64uwof-7"] { 239 animation-duration: 180ms; 240 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 241 animation-fill-mode: both; 242 animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-rv64uwof-7"], 243 [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-rv64uwof-7"] { 244 animation-duration: 180ms; 245 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 246 animation-fill-mode: both; 247 animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-rv64uwof-7"], 248 [data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-rv64uwof-7"] { 249 animation-duration: 180ms; 250 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 251 animation-fill-mode: both; 252 animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-rv64uwof-7"], 253 [data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="as
253tro-rv64uwof-7"] { 254 animation-duration: 180ms; 255 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 256 animation-fill-mode: both; 257 animation-name: astroFadeIn; }</style><style>[data-astro-transition-scope="astro-h7nwt3kp-8"] { view-transition-name: playlist_1_image; }@layer astro { ::view-transition-old(playlist_1_image) { 258 animation-duration: 180ms; 259 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 260 animation-fill-mode: both; 261 animation-name: astroFadeOut; }::view-transition-new(playlist_1_image) { 262 animation-duration: 180ms; 263 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 264 animation-fill-mode: both; 265 animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(playlist_1_image) { 266 animation-duration: 180ms; 267 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 268 animation-fill-mode: both; 269 animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(playlist_1_image) { 270 animation-duration: 180ms; 271 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 272 animation-fill-mode: both; 273 animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-h7nwt3kp-8"], 274 [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-h7nwt3kp-8"] { 275 animation-duration: 180ms; 276 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 277 animation-fill-mode: both; 278 animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-h7nwt3kp-8"], 279 [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-h7nwt3kp-8"] { 280 animation-duration: 180ms; 281 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 282 animation-fill-mode: both; 283 animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-h7nwt3kp-8"], 284 [data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-h7nwt3kp-8"] { 285 animation-duration: 180ms; 286 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 287 animation-fill-mode: both; 288 animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-h7nwt3kp-8"], 289 [data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="astro-h7nwt3kp-8"] { 290 animation-duration: 180ms; 291 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 292 animation-fill-mode: both; 293 animation-name: astroFadeIn; }</style><style>[data-astro-transition-scope="astro-mfp6ouip-9"] { view-transition-name: playlist_1_title; }@layer astro { ::view-transition-old(playlist_1_title) { 294 animation-duration: 180ms; 295 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 296 animation-fill-mode: both; 297 animation-name: astroFadeOut; }::view-transition-new(playlist_1_title) { 298 animation-duration: 180ms; 299 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 300 animation-fill-mode: both; 301 animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(playlist_1_title) { 302 animation-duration: 180ms; 303 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 304 animation-fill-mode: both; 305 animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(playlist_1_title) { 306 animation-duration: 180ms; 307 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 308 animation-fill-mode: both; 309 animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-mfp6ouip-9"], 310 [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-mfp6ouip-9"] { 311 animation-duration: 180ms; 312 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 313 animation-fill-mode: both; 314 animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-mfp6ouip-9"], 315 [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-mfp6ouip-9"] { 316 animation-duration: 180ms; 317 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 318 animation-fill-mode: both; 319 animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-mfp6ouip-9"], 320 [data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-mfp6ouip-9"] { 321 animation-duration: 180ms; 322 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 323 animation-fill-mode: both; 324 animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-mfp6ouip-9"], 325 [data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="astro-mfp6ouip-9"] { 326 animation-duration: 180ms; 327 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 328 animation-fill-mode: both; 329 animation-name: astroFadeIn; }</style><style>[data-astro-transition-scope="astro-rv64uwof-10"] { view-transition-name: playlist_1_box; }@layer astro { ::view-transition-old(playlist_1_box) { 330 animation-duration: 180ms; 331 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 332 animation-fill-mode: both; 333 animation-name: astroFadeOut; }::view-transition-new(playlist_1_box) { 334 animation-duration: 180ms; 335 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 336 animation-fill-mode: both; 337 animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(playlist_1_box) { 338 animation-duration: 180ms; 339 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 340 animation-fill-mode: both; 341 animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(playlist_1_box) { 342 animation-duration: 180ms; 343 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 344 animation-fill-mode: both; 345 animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-rv64uwof-10"], 346 [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-rv64uwof-10"] { 347 animation-duration: 180ms; 348 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 349 animation-fill-mode: both; 350 animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-rv64uwof-10"], 351 [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-rv64uwof-10"] { 352 animation-duration: 180ms; 353 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 354 animation-fill-mode: both; 355 animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-rv64uwof-10"], 356 [data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-rv64uwof-10"] { 357 animation-duration: 180ms; 358 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 359 animation-fill-mode: both; 360 animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-rv64uwof-10"], 361 [data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="astro-rv64uwof-10"] { 362 animation-duration: 180ms; 363 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 364 animation-fill-mode: both; 365 animation-name: astroFadeIn; }</style><style>[data-astro-transition-scope="astro-3hi3desh-11"] { view-transition-name: page_footer; }@layer astro { ::view-transition-old(page_footer) { 366 animation-duration: 180ms; 367 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 368 animation-fill-mode: both; 369 animation-name: astroFadeOut; }::view-transition-new(page_footer) { 370 animation-duration: 180ms; 371 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 372 animation-fill-mode: both; 373 animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(page_footer) { 374 animation-duration: 180ms; 375 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 376 animation-fill-mode: both; 377 animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(page_footer) { 378 animation-duration: 180ms; 379 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 380 animation-fill-mode: both; 381 animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-3hi3desh-11"], 382 [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-3hi3desh-11"] { 383 animation-duration: 180ms; 384 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 385 animation-fill-mode: both; 386 animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-3hi3desh-11"], 387 [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-3hi3desh-11"] { 388 animation-duration: 180ms; 389 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 390 animation-fill-mode: both; 391 animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-3hi3desh-11"], 392 [data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-3hi3desh-11"] { 393 animation-duration: 180ms; 394 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 395 animation-fill-mode: both; 396 animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-3hi3desh-11"], 397 [data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="astro-3hi3desh-11"] { 398 animation-duration: 180ms; 399 animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1); 400 animation-fill-mode: both; 401 animation-name: astroFadeIn; }</style></head> <body class="dark"> <div class="relative h-screen gap-2 flex items-stretch"> <div class=" bg-zinc-900 flex-1 mx-auto overflow-y-auto"> <div id="playlist-container" class="relative transition-all duration-1000 bg-context" style="min-height:300px;--context-color:#000000;
401" data-astro-cid-vugpofcr> <div class=" relative z-10 py-6 px-6 flex justify-between" data-astro-transition-persist="page header" data-astro-transition-scope="astro-nhjkrpzs-1"> <a href="/" aria-label="go back to home page" class="text-2xl font-bold text-white"> 402ä¸è詩社 403</a> <nav> <ul class="flex space-x-8 mt-1"> <li><a href="/" class="hover:text-customYellow">Home</a></li> <li><a href="/club-class" class="hover:text-customYellow">社課</a></li> <li><a href="/blog" class="hover:text-customYellow">èè©©é½</a></li> </ul> </nav> <div class="mt-1"> <a target="_blank" aria-label="github repository" href="https://github.com/99points/astrojs-event-template" class="text-gray-200 hover:text-white"> <svg viewBox="0 0 24 24" class="h-7 w-7" astro-icon="mdi:github"><path fill="currentColor" d="M12 2A10 10 0 0 0 2 12c0 4.42 2.87 8.17 6.84 9.5.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34-.46-1.16-1.11-1.47-1.11-1.47-.91-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.87 1.52 2.34 1.07 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.92 0-1.11.38-2 1.03-2.71-.1-.25-.45-1.29.1-2.64 0 0 .84-.27 2.75 1.02.79-.22 1.65-.33 2.5-.33.85 0 1.71.11 2.5.33 1.91-1.29 2.75-1.02 2.75-1.02.55 1.35.2 2.39.1 2.64.65.71 1.03 1.6 1.03 2.71 0 3.82-2.34 4.66-4.57 4.91.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2z"/></svg> </a> </div> </div> <section class="text-center py-24 bg-black relative" data-astro-cid-vugpofcr> <div class="absolute inset-0 w-full z-10 bg-black opacity-30" data-astro-cid-vugpofcr></div> <img src="/banner.jpg" alt="Background Image" class="absolute inset-0 w-full h-full object-cover opacity-40" data-astro-cid-vugpofcr> <div class="relative z-10 max-w-4xl mx-auto" data-astro-cid-vugpofcr> <h1 class="text-5xl md:text-6xl lg:text-7xl font-bold text-customYellow club-name" data-astro-cid-vugpofcr>ä¸è詩社</h1> <!-- <div class="mx-auto"> 404 <p class="mt-4 text-sm md:text-base lg:text-lg text-gray-300 max-w-3xl mx-auto">åæ¡å¯«è©©<br>åæ¡ä½ <br>åæ¡ä»</p> 405 </div> --> <p class="mt-4 w-fit mx-auto text-left text-sm md:text-base lg:text-lg text-gray-300" data-astro-cid-vugpofcr> 406åæ¡å¯«è©©<br data-astro-cid-vugpofcr> 407åæ¡ä½ <br data-astro-cid-vugpofcr> 408åæ¡ä» 409</p> <div class="mt-8 flex justify-center space-x-4" data-astro-cid-vugpofcr> <a href="#Event-Calendar" class="bg-customYellow text-black py-2 px-6 hover:bg-customYellowHover" data-astro-cid-vugpofcr>EVENTS CALENDAR</a> </div> </div> </section></div> <section class="relative bg-black text-white overflow-hidden" data-astro-cid-vugpofcr> <div class="panel-row max-w-6xl mx-auto" data-astro-cid-vugpofcr> <figure class="panel panel-0" data-astro-cid-vugpofcr> <img src="/club-class.png" alt="社課" loading="lazy" data-astro-cid-vugpofcr> <figcaption class="panel-label left" data-astro-cid-vugpofcr>社課</figcaption> </figure><figure class="panel panel-1" data-astro-cid-vugpofcr> <img src="/row-bar2.png" alt="æ¨¡æ¬æå¸ç" loading="lazy" data-astro-cid-vugpofcr> <figcaption class="panel-label center" data-astro-cid-vugpofcr>æ¨¡æ¬æå¸ç</figcaption> </figure><figure class="panel panel-2" data-astro-cid-vugpofcr> <img src="/row-bar3.jpeg" alt="社é" loading="lazy" data-astro-cid-vugpofcr> <figcaption class="panel-label right" data-astro-cid-vugpofcr>社é</figcaption> </figure> </div> </section> <!-- Yello slider banner --><section class="relative z-10"> <div class="bg-customYellow text-black py-4 overflow-hidden relative"> <div class="whitespace-nowrap animate-marquee"> <span class="inline-block font-bold text-lg sm:text-xl md:text-2xl lg:text-3xl"> <span class="mx-2">â¦</span> æ¡è¿åå è§å½±è¨è«æãéçªä¸è¿½éââé¾è¶ç欲æ±ï¼ææ ç幻夢ãï¼å¨4/29(ä¸)ï¼5/20ï¼ä¸ï¼å¨ä¸è大å¸åæ¸é¤¨ã<a href="https://www.lib.nchu.edu.tw/news_detail.php?Key=434" target="_blank">å ±åé£çµã黿ã</a>æå°ä¸è大å¸åæ¸é¤¨ç¶²ç«æ¥è©¢ 410<span class="mx-2">â¦</span> æèªçºç¾©å¤§å©éºµå°±æè©²æ 42 èæ··æ³¥å 411<span class="mx-2">â¦</span> å çºéåèºçµ²éçé·åº¦ 412<span class="mx-2">â¦</span> å¾å®¹æç´æ¥å½±é¿å°æææ©çæç© 413</span> </div> </div> </section> <div class="container mx-auto px-4 " data-astro-cid-ghu2dq4w> <div class="recent" data-astro-cid-ghu2dq4w> <h2 class="text-4xl recent" data-astro-cid-ghu2dq4w>è¿ææ´»å</h2> </div> <div class="grid grid-cols-1 md:grid-cols-2 gap-6" data-astro-cid-ghu2dq4w> <div class="bg-gray-900 text-white rounded-lg overflow-hidden shadow-md flex" data-astro-cid-ghu2dq4w> <div class="relative w-1/3" data-astro-cid-ghu2dq4w>
413 <img src="/ev-2026/cut-up.webp" alt="æ¼å¤å¤æ¼è²¼è©©" class="w-full h-full object-cover" data-astro-cid-ghu2dq4w data-astro-transition-scope="astro-h7nwt3kp-2"> </div> <div class="p-4 w-2/3" data-astro-cid-ghu2dq4w> <h3 class="text-xl font-semibold mb-2" data-astro-cid-ghu2dq4w data-astro-transition-scope="astro-mfp6ouip-3">æ¼å¤å¤æ¼è²¼è©©</h3> <p class="text-sm text-gray-400 mb-4" data-astro-cid-ghu2dq4w>æ¼è²¼è©©è®æ¯å人é½è½æçºè©©äºº æ¡è¿å¤§å®¶åå 鿬¡ãç¤¾èª²ï¼ææ¢æçèªå¥åé輯æé並éçµ è®æåç¢çæ°çå ±æ¯ðª</p> <div class="text-sm text-gray-500 mb-4" data-astro-cid-ghu2dq4w>3/24, 2026 19:00 - 21:30</div> <div class="text-sm text-gray-500 mb-4" data-astro-cid-ghu2dq4w>å°é»ï¼ä¸èå¤§å¸ é²å¹³æ¨æè°å®¤ æè°å®¤B</div> <div class="text-sm text-gray-500 mb-4" data-astro-cid-ghu2dq4w>主è¬ï¼å®ç¶¿, æ¿ç</div> <a href="/event/3" class="bg-customYellow text-gray-900 font-bold py-2 px-4 rounded hover:bg-customYellowHover" data-astro-cid-ghu2dq4w data-astro-transition-scope="astro-rv64uwof-4"> 414詳細è³è¨ 415</a> </div> </div><div class="bg-gray-900 text-white rounded-lg overflow-hidden shadow-md flex" data-astro-cid-ghu2dq4w> <div class="relative w-1/3" data-astro-cid-ghu2dq4w> <img src="/event2.jpg" alt="å°è¯ : å°ä¸å夿 è¯å¤èæ°è²" class="w-full h-full object-cover" data-astro-cid-ghu2dq4w data-astro-transition-scope="astro-h7nwt3kp-5"> </div> <div class="p-4 w-2/3" data-astro-cid-ghu2dq4w> <h3 class="text-xl font-semibold mb-2" data-astro-cid-ghu2dq4w data-astro-transition-scope="astro-mfp6ouip-6">å°è¯ : å°ä¸å夿 è¯å¤èæ°è²</h3> <p class="text-sm text-gray-400 mb-4" data-astro-cid-ghu2dq4w>å°è¯æ¯ä¸è¯æåçéè¦çµæé¨åï¼å®ä¸å å æ¯ä¸ç¨®æå¸å½¢å¼ï¼æ´æ¯æºæ §åæè¯çé«ç¾ãæ¬æ¬¡æ´»åå°å¸¶é å¤§å®¶æ·±å ¥æ¢ç´¢å°è¯ç奧ç§</p> <div class="text-sm text-gray-500 mb-4" data-astro-cid-ghu2dq4w>3/19, 2026 19:00 - 22:00 PM</div> <div class="text-sm text-gray-500 mb-4" data-astro-cid-ghu2dq4w>å°é»ï¼ä¸èå¤§å¸ é²å¹³æ¨æè°å®¤ æè°å®¤B</div> <div class="text-sm text-gray-500 mb-4" data-astro-cid-ghu2dq4w>主è¬ï¼ææå°</div> <a href="/event/2" class="bg-customYellow text-gray-900 font-bold py-2 px-4 rounded hover:bg-customYellowHover" data-astro-cid-ghu2dq4w data-astro-transition-scope="astro-rv64uwof-7"> 416詳細è³è¨ 417</a> </div> </div><div class="bg-gray-900 text-white rounded-lg overflow-hidden shadow-md flex" data-astro-cid-ghu2dq4w> <div class="relative w-1/3" data-astro-cid-ghu2dq4w> <img src="/event1.jpg" alt="è©©ã»æ" class="w-full h-full object-cover" data-astro-cid-ghu2dq4w data-astro-transition-scope="astro-h7nwt3kp-8"> </div> <div class="p-4 w-2/3" data-astro-cid-ghu2dq4w> <h3 class="text-xl font-semibold mb-2" data-astro-cid-ghu2dq4w data-astro-transition-scope="astro-mfp6ouip-9">è©©ã»æ</h3> <p class="text-sm text-gray-400 mb-4" data-astro-cid-ghu2dq4w>帶é 大家ä¸èµ·æ¢ç´¢è©©æçé åï¼å¾å¤å ¸å°ç¾ä»£ï¼å¾æ±æ¹å°è¥¿æ¹ï¼è©©æçä¸çç¡é廣éãç¡è«ä½ æ¯è©©ææå¥½è 鿝åå¸è ï¼é½æ¡è¿å å ¥æåçè©©æä¹æ ï¼ä¸èµ·æåæåçåéåç¾éºã</p> <div class="text-sm text-gray-500 mb-4" data-astro-cid-ghu2dq4w>3/12, 2026 19:00 - 22:00 PM</div> <div class="text-sm text-gray-500 mb-4" data-astro-cid-ghu2dq4w>å°é»ï¼ä¸èå¤§å¸ é²å¹³æ¨æè°å®¤ æè°å®¤B</div> <div class="text-sm text-gray-500 mb-4" data-astro-cid-ghu2dq4w>主è¬ï¼èè</div> <a href="/event/1" class="bg-customYellow text-gray-900 font-bold py-2 px-4 rounded hover:bg-customYellowHover" data-astro-cid-ghu2dq4w data-astro-transition-scope="astro-rv64uwof-10"> 418詳細è³è¨ 419</a> </div> </div> </div> </div> <div class="container max-w-screen-lg mx-auto px-4 " data-astro-cid-vugpofcr> <div class="grid grid-cols-1 md:grid-cols-2 gap-6" data-astro-cid-vugpofcr> <h2 class="text-4xl my-8 md:text-5xl lg:text-7xl font-bold text-white text-center" id="Event-Calendar" data-astro-cid-vugpofcr>Event Calendar</h2> <span data-astro-cid-vugpofcr></span> </div> <section class="max-w-screen-lg mx-auto p-4 bg-gray-900 text-white"> <div class="flex justify-between items-center mb-4"> <h2 class="text-2xl font-bold">Events</h2> <div class="flex space-x-2" id="months-buttons"> <!-- Month buttons will be dynamically inserted here --> </div> <div class="flex space-x-2"> <button id="previous-month" class="p-2 bg-gray-700 rounded">â¹</button> <button id="next-month" class="p-2 bg-gray-700 rounded">âº</button> </div> </div> <div id="events-list" class="grid grid-cols-2 gap-4"> <!-- Events will be dynamically inserted here --> </div> </section> </div> <section class="relative p-4 text-white text-center py-14 " data-astro-cid-vugpof
419cr> <div class="relative z-10 p-20 bg-customGray rounded " data-astro-cid-vugpofcr> <h2 class="text-5xl font-bold" data-astro-cid-vugpofcr>å å ¥æå</h2> <p class="mt-4 max-w-2xl mx-auto" data-astro-cid-vugpofcr>å¦ï¼ä½ 乿³è¦å å ¥ç·å¨ç¤¾é·ä¿±æ¨é¨åï¼</p> <button class="mt-12 px-8 py-4 bg-customYellow text-black hover:bg-customYellowHover" data-astro-cid-vugpofcr>å¡«å¯«å ¥ç¤¾è¡¨å®</button> <img src="/fufu.png" alt="Background" class="absolute bottom-0 right-9 w-1/4 h-auto object-cover z-0" data-astro-cid-vugpofcr> </div> </section> <div class=" relative z-10 py-4 " data-astro-transition-persist="page footer" data-astro-transition-scope="astro-3hi3desh-11"> <footer class=" text-white py-8"> <div class=" px-4 md:px-8"> <div class="flex flex-col md:flex-row justify-between items-center md:items-start mb-8"> <div class="mb-6 md:mb-0"> <h2 class="text-3xl font-bold ">ä¸è詩社</h2> <div class="flex space-x-4 mt-4"> <a href="https://www.instagram.com/nchupoetry/" class="text-yellow-500"><i class="fab fa-instagram"></i></a> <a href="https://www.facebook.com/nchuclassicalpoetry" class="text-yellow-500"><i class="fab fa-facebook"></i></a> </div> </div> <div class="grid grid-cols-1 md:grid-cols-3 gap-8 md:gap-16"> <div> <h3 class="font-bold mb-2">Events</h3> <ul> <li><a href="#" class="hover:underline">Music</a></li> <li><a href="#" class="hover:underline">Exhibition</a></li> <li><a href="#" class="hover:underline">Culture</a></li> <li><a href="#" class="hover:underline">Art</a></li> </ul> </div> <div> <h3 class="font-bold mb-2">Company</h3> <ul> <li><a href="#" class="hover:underline">About us</a></li> <li><a href="#" class="hover:underline">Contact</a></li> <li><a href="#" class="hover:underline">Gallery</a></li> </ul> </div> <div> <h3 class="font-bold mb-2">More</h3> <ul> <li><a href="#" class="hover:underline">Blog</a></li> <li><a href="#" class="hover:underline">Privacy</a></li> <li><a href="#" class="hover:underline">Term</a></li> <li><a href="#" class="hover:underline">Security</a></li> </ul> </div> </div> </div> </div> </footer> <p class="text-center text-sm text-gray-700"> 420Made with <span class="text-red-500">♥</span> by <a href="https://iach.cc" target="_blank">Each Chen</a> </p> </div> </div> </div> <div id="not-support" class="fixed hidden bg-red-700 bottom-0 inset-x-0 rounded-t-md text-center py-2 lg:py-4 z-50 font-semibold"> 421It seems your browser does not support view transitions yet :( try it 422 using chrome or edge. 423</div>
423<script defer> 424 function setContainerColor(dataColor) { 425 const playlistContainer = document.getElementById("playlist-container"); 426 const currentColor = playlistContainer?.getAttribute("data-color"); 427 if (dataColor && dataColor !== currentColor) { 428 playlistContainer?.style.setProperty("--context-color", dataColor); 429 playlistContainer?.setAttribute("data-color", dataColor); 430 } 431 } 432 433 window.coloradTimeout = null; 434 for (const playlist of document.querySelectorAll(".playlist-item")) { 435 playlist.addEventListener("mouseover", () => 436 onMouseOverColorad(playlist) 437 ); 438 playlist.addEventListener("mouseout", onMouseOutColorad); 439 playlist.addEventListener("focus", () => onMouseFocusColorad(playlist)); 440 playlist.addEventListener("blur", onMouseOutColorad); 441 } 442 443 function onMouseFocusColorad(el) { 444 if (el) { 445 const dataColor = el.getAttribute("data-color"); 446 if (!dataColor) return; 447 setContainerColor(dataColor); 448 } 449 } 450 function onMouseOverColorad(el) { 451 if (el) { 452 const dataColor = el.getAttribute("data-color"); 453 if (!dataColor) return; 454 window.coloradTimeout = setTimeout( 455 () => setContainerColor(dataColor), 456 200 457 ); 458 } 459 } 460 function onMouseOutColorad() { 461 if (window.coloradTimeout) { 462 clearTimeout(window.coloradTimeout); 463 window.coloradTimeout = null; 464 } 465 } 466 </script>
466 </body> </html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.