atproto explorer

add custom headers

handle.invalid b185d7e3 4b888b68

verified
+15 -23
public/headers/bridge.jpg

This is a binary file and will not be displayed.

public/headers/bunny.jpg

This is a binary file and will not be displayed.

public/headers/city.webp

This is a binary file and will not be displayed.

public/headers/puppy.jpg

This is a binary file and will not be displayed.

public/headers/water.webp

This is a binary file and will not be displayed.

+1 -19
src/components/navbar.tsx
··· 8 8 export const [cid, setCID] = createSignal<string>(); 9 9 export const [isLabeler, setIsLabeler] = createSignal(false); 10 10 11 - const swapIcons: Record<string, string> = { 12 - "did:plc:vwzwgnygau7ed7b7wt5ux7y2": "lucide--microchip", 13 - "did:plc:oisofpd7lj26yvgiivf3lxsi": "lucide--bone", 14 - "did:plc:uu5axsmbm2or2dngy4gwchec": "lucide--train-track", 15 - "did:plc:7x6rtuenkuvxq3zsvffp2ide": "lucide--rabbit", 16 - "did:plc:ia76kvnndjutgedggx2ibrem": "lucide--rabbit", 17 - "did:plc:hvakvedv6byxhufjl23mfmsd": "lucide--rat", 18 - "did:plc:ezhjhbzqt32bqprrn6qjlkri": "lucide--film", 19 - "did:plc:6v6jqsy7swpzuu53rmzaybjy": "lucide--fish", 20 - "did:plc:hx53snho72xoj7zqt5uice4u": "lucide--rose", 21 - "did:plc:wzsilnxf24ehtmmc3gssy5bu": "lucide--music-2", 22 - "did:plc:bnqkww7bjxaacajzvu5gswdf": "lucide--gem", 23 - "did:plc:hdhoaan3xa3jiuq4fg4mefid": "lucide--sparkles", 24 - }; 25 - 26 11 const NavBar = (props: { params: Params }) => { 27 12 const location = useLocation(); 28 13 const [handle, setHandle] = createSignal(props.params.repo); ··· 113 98 }} 114 99 > 115 100 <span 116 - class={ 117 - `iconify shrink-0 text-base transition-transform duration-400 ${showHandle() ? "rotate-y-180" : ""} ` + 118 - (swapIcons[props.params.repo] ?? "lucide--arrow-left-right") 119 - } 101 + class={`iconify shrink-0 text-base transition-transform duration-400 ${showHandle() ? "rotate-y-180" : ""} lucide--arrow-left-right`} 120 102 ></span> 121 103 </button> 122 104 </Tooltip>
+14 -4
src/layout.tsx
··· 19 19 text?: string; 20 20 }>({ show: false }); 21 21 22 + const headers: Record<string, string> = { 23 + "did:plc:ia76kvnndjutgedggx2ibrem": "bunny.jpg", 24 + "did:plc:oisofpd7lj26yvgiivf3lxsi": "puppy.jpg", 25 + "did:plc:vwzwgnygau7ed7b7wt5ux7y2": "water.webp", 26 + "did:plc:uu5axsmbm2or2dngy4gwchec": "city.webp", 27 + "did:plc:hx53snho72xoj7zqt5uice4u": "bridge.jpg", 28 + }; 29 + 22 30 const Layout = (props: RouteSectionProps<unknown>) => { 23 31 const location = useLocation(); 24 32 const navigate = useNavigate(); ··· 56 64 </Show> 57 65 </MetaProvider> 58 66 <header 59 - classList={{ 60 - "dark:shadow-dark-800 dark:bg-dark-300 mb-4 flex w-full items-center justify-between rounded-lg border-[0.5px] border-neutral-300 bg-neutral-50 p-2 shadow-xs dark:border-neutral-700": true, 61 - "bg-[linear-gradient(to_left,transparent_0%,#fafafa_80%),linear-gradient(to_bottom,#5BCEFA90_0%,#5BCEFA90_20%,#F5A9B890_20%,#F5A9B890_40%,#FFFFFF90_40%,#FFFFFF90_60%,#F5A9B890_60%,#F5A9B890_80%,#5BCEFA90_80%,#5BCEFA90_100%)] dark:bg-[linear-gradient(to_left,transparent_0%,#2d2d2d_80%),linear-gradient(to_bottom,#5BCEFA90_0%,#5BCEFA90_20%,#F5A9B890_20%,#F5A9B890_40%,#FFFFFF90_40%,#FFFFFF90_60%,#F5A9B890_60%,#F5A9B890_80%,#5BCEFA90_80%,#5BCEFA90_100%)]": 62 - localStorage.getItem("hrt") === "true", 67 + class={`dark:shadow-dark-800 dark:bg-dark-300 mb-4 flex w-full items-center justify-between rounded-lg border-[0.5px] border-neutral-300 bg-neutral-50 bg-cover bg-center bg-no-repeat p-2 shadow-xs [--header-bg:#fafafa] dark:border-neutral-700 dark:[--header-bg:#2d2d2d] ${localStorage.getItem("hrt") === "true" ? "bg-[linear-gradient(to_left,transparent_0%,var(--header-bg)_80%),linear-gradient(to_bottom,#5BCEFA90_0%,#5BCEFA90_20%,#F5A9B890_20%,#F5A9B890_40%,#FFFFFF90_40%,#FFFFFF90_60%,#F5A9B890_60%,#F5A9B890_80%,#5BCEFA90_80%,#5BCEFA90_100%)]" : ""}`} 68 + style={{ 69 + "background-image": 70 + props.params.repo in headers ? 71 + `linear-gradient(to left, transparent 0%, var(--header-bg) 80%), url(/headers/${headers[props.params.repo]})` 72 + : undefined, 63 73 }} 64 74 > 65 75 <A