From 9d44f96477a160e17c128cf07526ad0548041b94 Mon Sep 17 00:00:00 2001 From: Korbs Date: Thu, 25 Jul 2024 03:05:13 -0400 Subject: [PATCH] update --- src/components/VideoItem.astro | 4 +- src/components/global/Header.astro | 46 -------------------- src/components/global/Sidebar.astro | 65 +++++++++++++++++++++++++---- src/components/search/Stream.astro | 8 +++- src/layouts/Default.astro | 2 - src/layouts/Markdown.astro | 1 - src/pages/discover.astro | 3 +- src/pages/live.astro | 2 +- src/pages/watch.astro | 2 +- src/styles/index.scss | 54 +++++------------------- src/styles/video.scss | 2 +- 11 files changed, 81 insertions(+), 108 deletions(-) delete mode 100644 src/components/global/Header.astro diff --git a/src/components/VideoItem.astro b/src/components/VideoItem.astro index 06db5c2..67d1f6e 100644 --- a/src/components/VideoItem.astro +++ b/src/components/VideoItem.astro @@ -32,7 +32,7 @@ const ViewsFormat = ViewsConversion.format(Views)
- +

{LengthFormat}

@@ -54,6 +54,8 @@ const ViewsFormat = ViewsConversion.format(Views) border-radius: 6px; aspect-ratio: 16/9; object-fit: cover; + opacity: 0; + transition: 0.3s opacity; } p#vi-length { margin: -41px 0px 0px 0px; diff --git a/src/components/global/Header.astro b/src/components/global/Header.astro deleted file mode 100644 index 9ef6dfa..0000000 --- a/src/components/global/Header.astro +++ /dev/null @@ -1,46 +0,0 @@ ---- -// Components -import Search from '@components/Search.astro' - -// Icons -import { -Message, - Youtube -} from '@iconoir/vue' - -// i18n -import { t, changeLanguage } from "i18next" -import { LanguageSelector } from "astro-i18next/components" -import Dropdown from '@components/Dropdown.astro' ---- - -
-
- - -
-
- - English - Japanese - - {t("HEADER.FEEDBACK")} -
-
- - \ No newline at end of file diff --git a/src/components/global/Sidebar.astro b/src/components/global/Sidebar.astro index 59a2aee..c30c013 100644 --- a/src/components/global/Sidebar.astro +++ b/src/components/global/Sidebar.astro @@ -11,35 +11,40 @@ import { // Icons import { - HomeSimple, GraphUp, Movie, MusicDoubleNote, Gamepad, AppleImac2021Side, EmojiTalkingHappy, - PizzaSlice, - Treadmill, PeaceHand, - InfoCircle, HelpCircle, Server, CurveArray, -Rocket, -PlanetAlt + PlanetAlt, +InputSearch, +ProfileCircle, +SettingsProfiles, +Settings } from '@iconoir/vue' // i18n import i18next, { t } from "i18next" +import SettingsLayout from '@layouts/Settings.astro' ---
- - - +
+ +
+ + +
+
{t("SIDEBAR.HOME")} + {t("HEADER.SEARCH")}
{SIDEBAR_CATEGORIES ?

{t("SIDEBAR.CATEGORY")}

@@ -103,12 +108,54 @@ import i18next, { t } from "i18next" font-size: 16px; padding-left: 24px; } + form { + margin-bottom: 12px; + input { + background: transparent; + border: 2px transparent solid; + padding: 10px 24px; + border-radius: 6px; + color: white; + transition: 0.3s background, 0.3s border; + &:hover { + background: rgb(255 255 255 / 05%); + border: 2px rgba(255, 255, 255, 0.05) solid; + transition: 0.3s background, 0.3s border; + } + &:focus { + outline: none; + background: rgb(255 255 255 / 07%); + border: 2px rgba(255, 255, 255, 0.07) solid; + transition: 0.3s background, 0.3s border; + } + svg { + width: 18px; + } + } + } .sidebar-top { .sidebar-top-start { display: flex; align-items: center; gap: 24px; padding: 32px 24px; + justify-content: space-between; + div { + display: flex; + gap: 6px; + a { + background: transparent; + border-radius: 6px; + padding: 5px 6px 3px 6px; + aspect-ratio: 1; + svg { + aspect-ratio: 1; + } + &:hover { + background: #2d2d2d; + } + } + } img { height: 24px; } diff --git a/src/components/search/Stream.astro b/src/components/search/Stream.astro index 6fe6264..b6fdd8e 100644 --- a/src/components/search/Stream.astro +++ b/src/components/search/Stream.astro @@ -12,10 +12,10 @@ const {
- Stream Thumbnail + Stream Thumbnail
- {Creator + {Creator

{Title}

{Creator}

@@ -44,6 +44,8 @@ const { width: 100%; object-fit: cover; border-radius: 12px; + opacity: 0; + transition: 0.3s opacity; } } .search-stream-meta { @@ -63,6 +65,8 @@ const { width: 42px; height: 42px; border-radius: 3rem; + opacity: 0; + transition: 0.3s opacity; } } } diff --git a/src/layouts/Default.astro b/src/layouts/Default.astro index e1abba1..18cbf9a 100644 --- a/src/layouts/Default.astro +++ b/src/layouts/Default.astro @@ -4,7 +4,6 @@ const { Title, Description } = Astro.props // Components import Head from '@components/global/Head.astro' -import Header from '@components/global/Header.astro' import MobileNav from '@components/global/MobileNav.astro' import Sidebar from '@components/global/Sidebar.astro' import Footer from '@components/global/Footer.astro' @@ -18,7 +17,6 @@ import '@styles/mobile.scss'
-