update
This commit is contained in:
Korbs
parent
8226128d8a
commit
adc1a70b34
9 changed files with 50 additions and 73 deletions
1
index.ts
1
index.ts
|
|
@ -3,6 +3,7 @@ export { default as Comment } from "./src/Comment.astro"
|
|||
export { default as Dialog } from "./src/Dialog.astro"
|
||||
export { default as MobileNavigation } from "./src/MobileNavigation.astro"
|
||||
export { default as Search } from "./src/search/Field.astro"
|
||||
export { default as SearchField} from "./src/search/Field.astro"
|
||||
export { default as Sidebar } from "./src/Sidebar.astro"
|
||||
export { default as SidebarCreator } from "./src/SidebarCreator.astro"
|
||||
export { default as VideoItem } from "./src/VideoItem.astro"
|
||||
|
|
@ -1,12 +1,11 @@
|
|||
{
|
||||
"name": "@minpluto/polestar",
|
||||
"author": "SudoVanilla <korbs@sudovanilla.org>",
|
||||
"author": "SudoVanilla",
|
||||
"type": "module",
|
||||
"version": "0.0.55",
|
||||
"version": "0.0.60",
|
||||
"license": "AGPL-3.0-only",
|
||||
"bugs": {
|
||||
"url": "https://ark.sudovanilla.org/MinPluto/Polestar/issues",
|
||||
"email": "support@minpluto.org"
|
||||
},
|
||||
"funding": [
|
||||
{
|
||||
|
|
|
|||
|
|
@ -88,6 +88,28 @@ const {
|
|||
</div>
|
||||
|
||||
<style lang="scss" is:inline>
|
||||
@media only screen and (max-width: 800px) {
|
||||
.fl-dialog {
|
||||
bottom: 0px !important;
|
||||
top: inherit !important;
|
||||
transform: inherit !important;
|
||||
left: 0px !important;
|
||||
padding: 24px 0px !important;
|
||||
border-radius: 24px 24px 0px 0px !important;
|
||||
background: #171717 !important;
|
||||
h2 {
|
||||
font-size: 32px !important;
|
||||
}
|
||||
p {
|
||||
font-size: 24px !important;
|
||||
}
|
||||
a, button {
|
||||
font-size: 24px !important;
|
||||
border-radius: 3rem !important;
|
||||
padding: 16px 32px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.fl-dialog-backdrop {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
|
|
|
|||
|
|
@ -1,59 +1,30 @@
|
|||
---
|
||||
import { HomeSimple, Safari, List, Settings } from "@iconoir/vue";
|
||||
---
|
||||
|
||||
<div class="mobile-navigation">
|
||||
<a href="#"><HomeSimple /> Home</a>
|
||||
<a href="#"><Safari /> Discover</a>
|
||||
<a href="#"><List /> Subscription</a>
|
||||
<a href="#"><Settings /> Settings</a>
|
||||
<slot name="items"/>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
<style lang="scss" is:global>
|
||||
.mobile-navigation {
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
background: rgb(24,24,24);
|
||||
padding: 24px 0px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
color: white;
|
||||
backdrop-filter: blur(24px) brightness(0.2) contrast(0.8);
|
||||
padding: 0px;
|
||||
z-index: 5;
|
||||
display: grid;
|
||||
grid-template-columns: auto auto auto auto;
|
||||
justify-items: stretch;
|
||||
align-items: baseline;
|
||||
justify-content: space-evenly;
|
||||
z-index: 10;
|
||||
height: 100%;
|
||||
max-height: 80px;
|
||||
a {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
padding: 12px 4px 12px 16px;
|
||||
border-radius: 3rem;
|
||||
font-size: 0px;
|
||||
transition: 0.3s background, 0.3s padding, 0.3s font-size;
|
||||
&:hover {
|
||||
color: black;
|
||||
background: white;
|
||||
padding: 12px 16px;
|
||||
font-size: 32px;
|
||||
transition: 0.3s background, 0.3s padding, 0.3s font-size;
|
||||
svg {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
background: rgb(24,24,24);
|
||||
border-radius: 3rem;
|
||||
padding: 12px;
|
||||
transition: 0.3s width, 0.3s height, 0.4s padding, 0.5 background;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
svg {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
transition: 0.3s width, 0.3s height, 0.4s padding, 0.5 background;
|
||||
}
|
||||
padding: 24px 0px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -136,7 +136,6 @@ import { Image } from "astro:assets";
|
|||
}
|
||||
&:hover {
|
||||
background: #3c3c3c;
|
||||
border: 1px #5c5c5c solid;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -162,7 +161,6 @@ import { Image } from "astro:assets";
|
|||
}
|
||||
&:hover {
|
||||
background: #3c3c3c;
|
||||
border: 1px #5c5c5c solid;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,7 +9,6 @@ const {
|
|||
|
||||
// Components
|
||||
import { Image } from "astro:assets";
|
||||
|
||||
---
|
||||
|
||||
<a href={Link} class="fl-sidebar-creator">
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ import { Image } from 'astro:assets';
|
|||
|
||||
<a href={"/watch?v=" + VideoId} class="fl-vi">
|
||||
<div class="fl-vi-thumbnail">
|
||||
<Image src={Thumbnail} alt={'Thumbnail'} inferSize={true} loading="lazy" format="webp"/>
|
||||
<Image src={Thumbnail} alt={'Thumbnail'} inferSize={true} loading="eagerly" format="webp"/>
|
||||
<!-- <p>{Platform}</p> -->
|
||||
<p>{Length}</p>
|
||||
</div>
|
||||
|
|
@ -61,7 +61,7 @@ import { Image } from 'astro:assets';
|
|||
border-radius: 3rem;
|
||||
}
|
||||
strong {
|
||||
max-width: 340px;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: wrap;
|
||||
text-overflow: ellipsis;
|
||||
|
|
|
|||
|
|
@ -37,7 +37,6 @@ import { Search } from "@iconoir/vue";
|
|||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
max-width: 360px;
|
||||
input {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
|
|
|
|||
|
|
@ -16,25 +16,6 @@ import Category from '../../../src/Category.astro'
|
|||
import SearchField from '../../../src/search/Field.astro'
|
||||
import MobileNavigation from '../../../src/MobileNavigation.astro'
|
||||
|
||||
// Data
|
||||
/// Fetch Categories for YouTube
|
||||
const TrendingFetch = 'https://yt.sudovanilla.org' + '/api/v1/trending'
|
||||
const TrendingResponse = await fetch(TrendingFetch)
|
||||
const TrendingData = await TrendingResponse.json()
|
||||
|
||||
const MoviesFetch = 'https://yt.sudovanilla.org' + '/api/v1/trending?type=movies'
|
||||
const MoviesResponse = await fetch(MoviesFetch)
|
||||
const MoviesData = await MoviesResponse.json()
|
||||
|
||||
const MusicFetch = 'https://yt.sudovanilla.org' + '/api/v1/trending?type=music'
|
||||
const MusicResponse = await fetch(MusicFetch)
|
||||
const MusicData = await MusicResponse.json()
|
||||
|
||||
|
||||
const GamingFetch = 'https://yt.sudovanilla.org' + '/api/v1/trending?type=gaming'
|
||||
const GamingResponse = await fetch(GamingFetch)
|
||||
const GamingData = await GamingResponse.json()
|
||||
|
||||
// Icons
|
||||
import {
|
||||
InputSearch,
|
||||
|
|
@ -73,11 +54,18 @@ import {
|
|||
</slot>
|
||||
</Dialog>
|
||||
|
||||
<MobileNavigation/>
|
||||
<MobileNavigation>
|
||||
<slot slot="items">
|
||||
<a href="#"><PlanetAlt/> Home</a>
|
||||
<a href="#"><MediaVideoList/> Feed</a>
|
||||
<a href="#" onclick="OpenExampleDialog()"><OpenInBrowser/> Open Dialog</a>
|
||||
<a href="#"><Settings/> Settings</a>
|
||||
</slot>
|
||||
</MobileNavigation>
|
||||
|
||||
<Sidebar
|
||||
ShowHeader
|
||||
LogoPath="https://ark.sudovanilla.org/avatars/984c733421da0eca64a9ec4f55305f739d748f0f50e5a91890a3372c544aa119?size=200"
|
||||
LogoPath="https://md.sudovanilla.org/images/minpluto-2024.png"
|
||||
ShowVersion
|
||||
FooterLinks
|
||||
Version={version}
|
||||
|
|
@ -124,7 +112,7 @@ import {
|
|||
</Sidebar>
|
||||
|
||||
<div class="content">
|
||||
<div style="margin: auto;width: 360px;padding: 64px;">
|
||||
<div style="margin: auto;padding: 64px;">
|
||||
<SearchField Design="Pill"/>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue