MinPluto/poke-on-astro-experiment
Archived
1
0
Fork 0
Code Issues Pull requests Activity

Use stream component

Browse source
This commit is contained in:
Korbs 2024-06-28 00:18:00 -04:00
parent fcb165e73e
commit b2ed5701f6
No known key found for this signature in database
1 changed files with 12 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
src/pages/search.astro
View file

@ -5,6 +5,7 @@ import Base from '@layouts/Default.astro'
// Components // Components
import Video from '@components/common/VideoItem.astro' import Video from '@components/common/VideoItem.astro'
import Creator from '@components/search/Creator.astro' import Creator from '@components/search/Creator.astro'
import Stream from '@components/search/Stream.astro'
// Environment Variables // Environment Variables
const DEFAULT_INVIDIOUS_INSTANCE = import.meta.env.DEFAULT_INVIDIOUS_INSTANCE const DEFAULT_INVIDIOUS_INSTANCE = import.meta.env.DEFAULT_INVIDIOUS_INSTANCE
@ -64,16 +65,14 @@ const TwitchData = await TwitchResponse.json()
<p>Twitch Live streams with the tag "{Query}"</p> <p>Twitch Live streams with the tag "{Query}"</p>
<div class="twitch-channels"> <div class="twitch-channels">
{TwitchData.data.relatedChannels.map((channel) => {TwitchData.data.relatedChannels.map((channel) =>
<a href={'/channel/twitch/' + channel.username} class="channel-stream" data-astro-reload> <Stream
<img class="stream-preview" src={channel.stream.preview}/> Title={channel.stream.title}
<div class="channel-info"> Creator={channel.username}
<img src={channel.pfp}/> Avatar={channel.pfp}
<div> Link={'/channel/twitch/' + channel.username}
<h2>{channel.username}</h2> Thumbnail={channel.stream.preview}
<p>{channel.about}</p> View={channel.stream.viewers}
</div> />
</div>
</a>
)} )}
</div> </div>
<p>YouTube Videos</p> <p>YouTube Videos</p>
@ -92,6 +91,9 @@ const TwitchData = await TwitchResponse.json()
</Base> </Base>
<style> <style>
body {
max-width: 2000px;
}
.video-grid { .video-grid {
display: grid; display: grid;