Add component for sidebar
This commit is contained in:
parent
3bf8214e6e
commit
a34ab29876
1 changed files with 44 additions and 0 deletions
44
source/src/components/CreatorInSidebar.astro
Executable file
44
source/src/components/CreatorInSidebar.astro
Executable 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>
|
Reference in a new issue