A decentralized music tracking and discovery platform built on AT Protocol 馃幍
rocksky.app
spotify
atproto
lastfm
musicbrainz
scrobbling
listenbrainz
1import type { Profile } from "../../types/profile";
2
3export type HeaderProps = {
4 profile: Profile;
5};
6
7function Header(props: HeaderProps) {
8 return (
9 <>
10 <div className="flex flex-row mb-[20px]">
11 <div className="flex flex-1 items-center">
12 <div>
13 <div className="flex items-center">
14 <a
15 href={`https://rocksky.app/profile/${props.profile.handle}`}
16 target="_blank"
17 >
18 <img
19 className="max-h-[25px] max-w-[25px] rounded-full mr-[10px]"
20 src={props.profile.avatar}
21 />
22 </a>
23 <a
24 href={`https://rocksky.app/profile/${props.profile.handle}`}
25 target="_blank"
26 className="no-underline text-inherit"
27 >
28 <div className="text-[14px] mt-[-6px]">
29 @{props.profile.handle}
30 </div>
31 </a>
32 </div>
33 </div>
34 </div>
35
36 <div>
37 <a
38 href="https://rocksky.app"
39 className="text-inherit no-underline"
40 target="_blank"
41 >
42 <div className="flex flex-row items-start ">
43 <img
44 className="max-h-[18px] max-w-[18px] mr-[8px] "
45 src="/public/logo.png"
46 />
47 <span className="text-[15px]">Rocksky</span>
48 </div>
49 </a>
50 </div>
51 </div>
52 </>
53 );
54}
55
56export default Header;