Add component for sidebar

This commit is contained in:
Korbs 2024-08-09 00:57:45 -04:00
parent 3bf8214e6e
commit a34ab29876

View file

@ -0,0 +1,44 @@
---
// Properties
const {
ChannelId
} = Astro.props
// Configuration
import { DEFAULT_MEDIA_DATA_PROXY, DEFAULT_IMAGE_PROXY} from '@utils/GetConfig'
// Fetch
const channel = await fetch(DEFAULT_MEDIA_DATA_PROXY + "/api/v1/channels/" + ChannelId).then((response) => response.json());
---
<a class="sidebar-channel" href={'/channel/' + channel.authorId}>
<img src={DEFAULT_IMAGE_PROXY + '/' + channel.authorThumbnails[5].url}/>
<p>{channel.author}</p>
</a>
<style lang="scss">
.sidebar-channel {
color: white;
text-decoration: none;
margin-bottom: 6px;
border-radius: 6px;
padding: 4px 24px;
background: transparent;
border: 2px transparent solid;
display: flex;
align-items: center;
gap: 14px;
font-size: 14px;
&:hover {
background: rgba(255, 255, 255, 0.05);
border: 2px rgba(255, 255, 255, 0.05) solid;
}
img {
width: 32px;
height: 32px;
object-fit: cover;
border-radius: 3rem;
font-weight: bold;
}
}
</style>