diff --git a/demo/app/globals.css b/demo/app/globals.css index 875c01e..c6f2edf 100644 --- a/demo/app/globals.css +++ b/demo/app/globals.css @@ -2,32 +2,29 @@ @tailwind components; @tailwind utilities; +/** + * General stuff + */ :root { - --foreground-rgb: 0, 0, 0; - --background-start-rgb: 214, 219, 220; - --background-end-rgb: 255, 255, 255; + background: #0b0b0c; + font-size: 16px; + color-scheme: dark; } -@media (prefers-color-scheme: dark) { +@media only screen and (min-width: 2000px) { :root { - --foreground-rgb: 255, 255, 255; - --background-start-rgb: 0, 0, 0; - --background-end-rgb: 0, 0, 0; + font-size: 22px; } } -body { - color: rgb(var(--foreground-rgb)); - background: linear-gradient( - to bottom, - transparent, - rgb(var(--background-end-rgb)) - ) - rgb(var(--background-start-rgb)); -} - @layer utilities { .text-balance { text-wrap: balance; } + + .gradient-shadow { + box-shadow: + -1rem 0px 2rem 0px #13ef9335, + 1rem 0px 2rem 0px #149afb35; + } } diff --git a/demo/app/layout.tsx b/demo/app/layout.tsx index ababb1a..b1df9ce 100644 --- a/demo/app/layout.tsx +++ b/demo/app/layout.tsx @@ -17,8 +17,8 @@ export default function RootLayout({ children: React.ReactNode; }>) { return ( - - + + {children} diff --git a/demo/app/page.tsx b/demo/app/page.tsx index 8f841b2..3985795 100644 --- a/demo/app/page.tsx +++ b/demo/app/page.tsx @@ -1,11 +1,12 @@ "use client"; +import Image from "next/image"; import { useNowPlaying } from "react-nowplaying"; export default function Home() { const { play } = useNowPlaying(); - const playAudio = () => { + const playBlobAudio = () => { fetch("test.mp3") .then((response) => response.blob()) .then((blob) => { @@ -14,11 +15,53 @@ export default function Home() { .catch((error) => console.error("Error fetching the audio:", error)); }; + const playUrlAudio = () => { + play("/test.mp3", "audio/mp3"); + }; + return ( -
- -
+ <> +
+ {/* height 4rem */} +
+
+
+ + Deepgram Logo + +
+
+
+ + {/* height 100% minus 4rem */} +
+ + + + + + +
+
+ ); } diff --git a/demo/package-lock.json b/demo/package-lock.json index c674e73..782d277 100644 --- a/demo/package-lock.json +++ b/demo/package-lock.json @@ -7,12 +7,11 @@ "": { "name": "demo", "version": "0.1.0", - "hasInstallScript": true, "dependencies": { "next": "14.1.3", "react": "^18", "react-dom": "^18", - "react-nowplaying": "^1.0.1" + "react-nowplaying": "^1" }, "devDependencies": { "@types/node": "^20", @@ -27,8 +26,7 @@ } }, "..": { - "version": "1.0.1", - "extraneous": true, + "version": "1.1.0", "license": "MIT", "devDependencies": { "@commitlint/cli": "^19.1.0", @@ -42,14 +40,14 @@ "pretty-quick": "^4.0.0", "react": "^18.2.0", "regenerator-runtime": "^0.14.1", - "ts-node": "^10.9.2", - "tsc-watch": "^6.0.4" + "tsup": "^8.0.2", + "typescript": "^5.3.3" }, "engines": { "node": ">=18.19.1" }, "peerDependencies": { - "react": "^18" + "react": "^16.8.0 || ^17 || ^18" } }, "node_modules/@aashutoshrathi/word-wrap": { @@ -3864,15 +3862,8 @@ "dev": true }, "node_modules/react-nowplaying": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/react-nowplaying/-/react-nowplaying-1.0.1.tgz", - "integrity": "sha512-OOhzy6edNKcTWHD0xwvTkEoClQq7bXeV6RspM6HEum886xPzkY2epxYwyjfIUJO4sjCT0XtPBf5z8bd4Aus+5A==", - "engines": { - "node": ">=20.11.1" - }, - "peerDependencies": { - "react": "^18" - } + "resolved": "..", + "link": true }, "node_modules/read-cache": { "version": "1.0.0", diff --git a/demo/package.json b/demo/package.json index fbfa83b..2e76c48 100644 --- a/demo/package.json +++ b/demo/package.json @@ -12,7 +12,7 @@ "next": "14.1.3", "react": "^18", "react-dom": "^18", - "react-nowplaying": "^1.0.1" + "react-nowplaying": "^1" }, "devDependencies": { "@types/node": "^20", diff --git a/demo/public/deepgram.svg b/demo/public/deepgram.svg new file mode 100644 index 0000000..9848c28 --- /dev/null +++ b/demo/public/deepgram.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 9252d3c..579a5f7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "react-nowplaying", - "version": "1.0.1", + "version": "1.1.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "react-nowplaying", - "version": "1.0.1", + "version": "1.1.0", "license": "MIT", "devDependencies": { "@commitlint/cli": "^19.1.0",