@@ -71,34 +65,28 @@ export default function DialNav({ left, right }: DialNavProps) {
})}
- {left[0].href === '/docs' ? (
-
{right.map((link) => {
diff --git a/site/src/components/Footer.astro b/site/src/components/Footer.astro
index 098d91a3..885f243e 100644
--- a/site/src/components/Footer.astro
+++ b/site/src/components/Footer.astro
@@ -1,9 +1,9 @@
---
import { ArrowUpRight } from 'lucide-react';
+import Discord from '@/assets/logos/discord.svg?react';
+import GitHub from '@/assets/logos/github.svg?react';
+import LogoMonoVersion from '@/assets/logos/videojs-mono.svg?react';
import { DISCORD_INVITE_URL, GITHUB_REPO_URL, MUX_URL } from '@/consts';
-import Discord from './icons/discord.svg?react';
-import GitHub from './icons/github.svg?react';
-import LogoMonoVersion from './icons/logo-mono.svg?react';
import GetStartedLink from './NavBar/GetStartedLink';
import { ThemeToggle } from './ThemeToggle';
diff --git a/site/src/components/FooterDocs.astro b/site/src/components/FooterDocs.astro
index 61beb222..e7d65b26 100644
--- a/site/src/components/FooterDocs.astro
+++ b/site/src/components/FooterDocs.astro
@@ -1,9 +1,9 @@
---
import { ArrowUpRight } from 'lucide-react';
+import Discord from '@/assets/logos/discord.svg?react';
+import GitHub from '@/assets/logos/github.svg?react';
+import LogoMonoVersion from '@/assets/logos/videojs-mono.svg?react';
import { DISCORD_INVITE_URL, GITHUB_REPO_URL, MUX_URL } from '@/consts';
-import Discord from './icons/discord.svg?react';
-import GitHub from './icons/github.svg?react';
-import LogoMonoVersion from './icons/logo-mono.svg?react';
import GetStartedLink from './NavBar/GetStartedLink';
import { ThemeToggle } from './ThemeToggle';
diff --git a/site/src/components/NavBar/MobileNav.tsx b/site/src/components/NavBar/MobileNav.tsx
index 6ffe6007..ae9a0cf6 100644
--- a/site/src/components/NavBar/MobileNav.tsx
+++ b/site/src/components/NavBar/MobileNav.tsx
@@ -1,8 +1,8 @@
import { Dialog } from '@base-ui/react/dialog';
import clsx from 'clsx';
import { ArrowUpRight } from 'lucide-react';
+import Logo from '@/assets/logos/videojs.svg?react';
import { DISCORD_INVITE_URL, GITHUB_REPO_URL } from '@/consts';
-import Logo from '../icons/logo.svg?react';
import GetStartedLink from './GetStartedLink';
interface NavLink {
@@ -49,7 +49,16 @@ export default function MobileNav({ navLinks, currentPath, children }: MobileNav
{/* Header with close button */}
Navigation
-
+
+
+ Video.js video player
+
+ v10 beta
+
+
-
-
+
+
+ Video.js video player
+ v10 beta
{/* Desktop nav links */}
diff --git a/site/src/components/NavBar/NavBarDocs.astro b/site/src/components/NavBar/NavBarDocs.astro
index 3dcb391c..32e803e6 100644
--- a/site/src/components/NavBar/NavBarDocs.astro
+++ b/site/src/components/NavBar/NavBarDocs.astro
@@ -1,9 +1,9 @@
---
import clsx from 'clsx';
import { ArrowUpRight } from 'lucide-react';
-import Discord from '@/components/icons/discord.svg?react';
-import GitHub from '@/components/icons/github.svg?react';
-import LogoDocs from '@/components/icons/logo-docs.svg?react';
+import Discord from '@/assets/logos/discord.svg?react';
+import GitHub from '@/assets/logos/github.svg?react';
+import Logo from '@/assets/logos/videojs.svg?react';
import Search from '@/components/Search';
import { DISCORD_INVITE_URL, GITHUB_REPO_URL } from '@/consts';
import GetStartedLink from './GetStartedLink';
@@ -37,10 +37,18 @@ const { class: className } = Astro.props;
]}
style="height:var(--nav-h)"
>
-
-
-
-
+
+
+ Video.js video player
+
+ v10
+ beta
+
{/* Desktop nav links */}
diff --git a/site/src/components/Select.tsx b/site/src/components/Select.tsx
index bced7152..9a0b6476 100644
--- a/site/src/components/Select.tsx
+++ b/site/src/components/Select.tsx
@@ -1,7 +1,7 @@
import { Select as BaseSelect } from '@base-ui/react/select';
import clsx from 'clsx';
-import Check from '@/components/icons/check.svg?react';
-import DropdownArrow from '@/components/icons/dropdown-arrow.svg?react';
+import Check from '@/assets/icons/check.svg?react';
+import DropdownArrow from '@/assets/icons/dropdown-arrow.svg?react';
import { twMerge } from '@/utils/twMerge';
export interface SelectOption {
diff --git a/site/src/components/Tabs.tsx b/site/src/components/Tabs.tsx
index a4be72b7..e00fcd5d 100644
--- a/site/src/components/Tabs.tsx
+++ b/site/src/components/Tabs.tsx
@@ -18,12 +18,10 @@ import clsx from 'clsx';
import { Check } from 'lucide-react';
import { useEffect, useRef, useState } from 'react';
+import CopyIcon from '@/assets/icons/copy.svg?react';
import { twMerge } from '@/utils/twMerge';
-
import useIsHydrated from '@/utils/useIsHydrated';
-
import CopyButton from './CopyButton';
-import CopyIcon from './icons/copy-icon.svg?react';
export type TabsVariant = 'expanded' | 'compact';
diff --git a/site/src/components/ThemeToggle.tsx b/site/src/components/ThemeToggle.tsx
index c6a05301..65ef3604 100644
--- a/site/src/components/ThemeToggle.tsx
+++ b/site/src/components/ThemeToggle.tsx
@@ -1,8 +1,8 @@
import { useEffect, useState } from 'react';
+import Computer from '@/assets/icons/computer.svg?react';
+import Moon from '@/assets/icons/moon.svg?react';
+import Sun from '@/assets/icons/sun.svg?react';
import { THEME_KEY } from '@/consts';
-import Computer from './icons/computer.svg?react';
-import Moon from './icons/moon.svg?react';
-import Sun from './icons/sun.svg?react';
import ToggleGroup from './ToggleGroup';
type Preference = 'system' | 'light' | 'dark';
diff --git a/site/src/components/docs/SidebarItem.astro b/site/src/components/docs/SidebarItem.astro
index 40aefe87..8bec1f49 100644
--- a/site/src/components/docs/SidebarItem.astro
+++ b/site/src/components/docs/SidebarItem.astro
@@ -1,6 +1,6 @@
---
import GithubSlugger from 'github-slugger';
-import DropdownIcon from '@/components/icons/dropdown-arrow.svg?react';
+import DropdownIcon from '@/assets/icons/dropdown-arrow.svg?react';
import type { Guide, Section, SupportedFramework } from '@/types/docs';
import { isSection } from '@/types/docs';
diff --git a/site/src/components/home/Built/Marquee.astro b/site/src/components/home/Built/Marquee.astro
index 3b2f5d14..6534903c 100644
--- a/site/src/components/home/Built/Marquee.astro
+++ b/site/src/components/home/Built/Marquee.astro
@@ -1,5 +1,5 @@
---
-import TriangleArrow from '../../icons/triangle-arrow.svg?react';
+import TriangleArrow from '@/assets/icons/triangle-arrow.svg?react';
const REPEAT_COUNT = 4;
const items = Array.from({ length: REPEAT_COUNT });
diff --git a/site/src/components/home/Built/SocialProof.astro b/site/src/components/home/Built/SocialProof.astro
index 99d164e9..547d09c9 100644
--- a/site/src/components/home/Built/SocialProof.astro
+++ b/site/src/components/home/Built/SocialProof.astro
@@ -1,19 +1,17 @@
---
import clsx from 'clsx';
-import {
- AdobeLogo,
- AmazonLogo,
- AwgeLogo,
- CNNLogo,
- ConsumerReports,
- CourseraLogo,
- DropboxLogo,
- LinkedinLogo,
- SAPLogo,
- TheOnionLogo,
- UdemyLogo,
- ZoomLogo,
-} from '../../icons/SocialProofLogos';
+import AdobeLogo from '@/assets/logos/adobe.svg?react';
+import AmazonLogo from '@/assets/logos/amazon.svg?react';
+import AwgeLogo from '@/assets/logos/awge.svg?react';
+import CNNLogo from '@/assets/logos/cnn.svg?react';
+import ConsumerReports from '@/assets/logos/consumer-reports.svg?react';
+import CourseraLogo from '@/assets/logos/coursera.svg?react';
+import DropboxLogo from '@/assets/logos/dropbox.svg?react';
+import LinkedinLogo from '@/assets/logos/linkedin.svg?react';
+import SAPLogo from '@/assets/logos/sap.svg?react';
+import TheOnionLogo from '@/assets/logos/the-onion.svg?react';
+import UdemyLogo from '@/assets/logos/udemy.svg?react';
+import ZoomLogo from '@/assets/logos/zoom.svg?react';
import Marquee from './Marquee.astro';
const LOGOS = [
@@ -49,7 +47,7 @@ const LOGOS = [
index >= 10 ? "hidden md:flex" : "flex",
)}
>
-
+
))
}
diff --git a/site/src/components/home/GetStartedBanner.astro b/site/src/components/home/GetStartedBanner.astro
index 9e1fff9f..cb2d545f 100644
--- a/site/src/components/home/GetStartedBanner.astro
+++ b/site/src/components/home/GetStartedBanner.astro
@@ -1,6 +1,6 @@
---
import clsx from 'clsx';
-import ArrowIcon from '../icons/arrow.svg?react';
+import ArrowIcon from '@/assets/icons/arrow.svg?react';
import GetStartedLink from '../NavBar/GetStartedLink';
---
diff --git a/site/src/components/home/Header.astro b/site/src/components/home/Header.astro
index 65f52067..5f2215dc 100644
--- a/site/src/components/home/Header.astro
+++ b/site/src/components/home/Header.astro
@@ -1,8 +1,8 @@
---
+import MuxLogoSmall from '@/assets/logos/mux-small.svg?react';
import FrameworkControl from '@/components/home/FrameworkControl';
import HeroVideo from '@/components/home/HeroVideo';
import SkinControl from '@/components/home/SkinControl';
-import MuxLogoSmall from '@/components/icons/mux-logo-small.svg?react';
import { MUX_URL, VJS10_DEMO_VIDEO } from '@/consts';
const poster = `${VJS10_DEMO_VIDEO.poster}?time=0`;
@@ -18,8 +18,13 @@ const poster = `${VJS10_DEMO_VIDEO.poster}?time=0`;
/>
+ v10 beta
>;
diff --git a/site/src/components/icons/SocialProofLogos.tsx b/site/src/components/icons/SocialProofLogos.tsx
deleted file mode 100644
index 7b3fa0c6..00000000
--- a/site/src/components/icons/SocialProofLogos.tsx
+++ /dev/null
@@ -1,233 +0,0 @@
-interface IconProps extends React.SVGProps {
- width?: string;
-}
-
-export const AdobeLogo = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
-export const LinkedinLogo = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
-export const UdemyLogo = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
-export const AmazonLogo = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
-export const AwgeLogo = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
-export const ZoomLogo = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
-export const CourseraLogo = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
-export const CNNLogo = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
-export const ConsumerReports = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
-export const TheOnionLogo = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
-export const SAPLogo = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
-export const DropboxLogo = ({ width = '1', ...props }: IconProps) => {
- return (
-
- );
-};
diff --git a/site/src/components/icons/dial-outer.svg b/site/src/components/icons/dial-outer.svg
deleted file mode 100644
index 460aacc2..00000000
--- a/site/src/components/icons/dial-outer.svg
+++ /dev/null
@@ -1,7 +0,0 @@
-