A decentralized music tracking and discovery platform built on AT Protocol 🎵
listenbrainz spotify atproto lastfm musicbrainz scrobbling

work in progress

Changed files
+11 -7
apps
web
src
components
SongCover
InteractionBar
+11 -7
apps/web/src/components/SongCover/InteractionBar/InteractionBar.tsx
··· 1 1 import HeartOutline from "../../Icons/HeartOutline"; 2 + import HeartFilled from "../../Icons/Heart"; 2 3 3 4 function InteractionBar() { 4 - return ( 5 - <div className="absolute bottom-[-1px] left-0 h-[100px] w-full bg-[linear-gradient(rgba(22,24,35,0)_2.92%,rgba(22,24,35,0.5)_98.99%)] flex justify-start items-end p-[10px] rounded-b-[8px]"> 6 - <div className="h-[40px] w-full flex items-center"> 7 - <HeartOutline color="#fff" /> 8 - </div> 9 - </div> 10 - ); 5 + return ( 6 + <div className="absolute bottom-[-1px] left-0 h-[100px] w-full bg-[linear-gradient(rgba(22,24,35,0)_2.92%,rgba(22,24,35,0.5)_98.99%)] flex justify-start items-end p-[10px] rounded-b-[8px]"> 7 + <div className="h-[40px] w-full flex items-center"> 8 + <span className="cursor-pointer" onClick={(e) => e.preventDefault()}> 9 + {true && <HeartOutline color="#fff" />} 10 + {false && <HeartFilled color="#fff" />} 11 + </span> 12 + </div> 13 + </div> 14 + ); 11 15 } 12 16 13 17 export default InteractionBar;