landing page added
This commit is contained in:
n4ze3m
parent
92cb203503
commit
5d8c2c8df2
@ -30,6 +30,7 @@
|
|||||||
"next": "^13.2.4",
|
"next": "^13.2.4",
|
||||||
"react": "18.2.0",
|
"react": "18.2.0",
|
||||||
"react-dom": "18.2.0",
|
"react-dom": "18.2.0",
|
||||||
|
"react-youtube": "^10.1.0",
|
||||||
"superjson": "1.12.2",
|
"superjson": "1.12.2",
|
||||||
"zod": "^3.21.4"
|
"zod": "^3.21.4"
|
||||||
},
|
},
|
||||||
|
|||||||
35
pnpm-lock.yaml
generated
35
pnpm-lock.yaml
generated
@ -61,6 +61,9 @@ dependencies:
|
|||||||
react-dom:
|
react-dom:
|
||||||
specifier: 18.2.0
|
specifier: 18.2.0
|
||||||
version: 18.2.0(react@18.2.0)
|
version: 18.2.0(react@18.2.0)
|
||||||
|
react-youtube:
|
||||||
|
specifier: ^10.1.0
|
||||||
|
version: 10.1.0(react@18.2.0)
|
||||||
superjson:
|
superjson:
|
||||||
specifier: 1.12.2
|
specifier: 1.12.2
|
||||||
version: 1.12.2
|
version: 1.12.2
|
||||||
@ -2368,6 +2371,10 @@ packages:
|
|||||||
/lines-and-columns@1.2.4:
|
/lines-and-columns@1.2.4:
|
||||||
resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
|
resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
|
||||||
|
|
||||||
|
/load-script@1.0.0:
|
||||||
|
resolution: {integrity: sha512-kPEjMFtZvwL9TaZo0uZ2ml+Ye9HUMmPwbYRJ324qF9tqMejwykJ5ggTyvzmrbBeapCAbk98BSbTeovHEEP1uCA==}
|
||||||
|
dev: false
|
||||||
|
|
||||||
/locate-path@6.0.0:
|
/locate-path@6.0.0:
|
||||||
resolution: {integrity: sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==}
|
resolution: {integrity: sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==}
|
||||||
engines: {node: '>=10'}
|
engines: {node: '>=10'}
|
||||||
@ -2958,6 +2965,20 @@ packages:
|
|||||||
react: 18.2.0
|
react: 18.2.0
|
||||||
dev: false
|
dev: false
|
||||||
|
|
||||||
|
/react-youtube@10.1.0(react@18.2.0):
|
||||||
|
resolution: {integrity: sha512-ZfGtcVpk0SSZtWCSTYOQKhfx5/1cfyEW1JN/mugGNfAxT3rmVJeMbGpA9+e78yG21ls5nc/5uZJETE3cm3knBg==}
|
||||||
|
engines: {node: '>= 14.x'}
|
||||||
|
peerDependencies:
|
||||||
|
react: '>=0.14.1'
|
||||||
|
dependencies:
|
||||||
|
fast-deep-equal: 3.1.3
|
||||||
|
prop-types: 15.8.1
|
||||||
|
react: 18.2.0
|
||||||
|
youtube-player: 5.5.2
|
||||||
|
transitivePeerDependencies:
|
||||||
|
- supports-color
|
||||||
|
dev: false
|
||||||
|
|
||||||
/react@18.2.0:
|
/react@18.2.0:
|
||||||
resolution: {integrity: sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==}
|
resolution: {integrity: sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==}
|
||||||
engines: {node: '>=0.10.0'}
|
engines: {node: '>=0.10.0'}
|
||||||
@ -3079,6 +3100,10 @@ packages:
|
|||||||
object-inspect: 1.12.3
|
object-inspect: 1.12.3
|
||||||
dev: true
|
dev: true
|
||||||
|
|
||||||
|
/sister@3.0.2:
|
||||||
|
resolution: {integrity: sha512-p19rtTs+NksBRKW9qn0UhZ8/TUI9BPw9lmtHny+Y3TinWlOa9jWh9xB0AtPSdmOy49NJJJSSe0Ey4C7h0TrcYA==}
|
||||||
|
dev: false
|
||||||
|
|
||||||
/slash@3.0.0:
|
/slash@3.0.0:
|
||||||
resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==}
|
resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==}
|
||||||
engines: {node: '>=8'}
|
engines: {node: '>=8'}
|
||||||
@ -3496,6 +3521,16 @@ packages:
|
|||||||
engines: {node: '>=10'}
|
engines: {node: '>=10'}
|
||||||
dev: true
|
dev: true
|
||||||
|
|
||||||
|
/youtube-player@5.5.2:
|
||||||
|
resolution: {integrity: sha512-ZGtsemSpXnDky2AUYWgxjaopgB+shFHgXVpiJFeNB5nWEugpW1KWYDaHKuLqh2b67r24GtP6HoSW5swvf0fFIQ==}
|
||||||
|
dependencies:
|
||||||
|
debug: 2.6.9
|
||||||
|
load-script: 1.0.0
|
||||||
|
sister: 3.0.2
|
||||||
|
transitivePeerDependencies:
|
||||||
|
- supports-color
|
||||||
|
dev: false
|
||||||
|
|
||||||
/zod@3.21.4:
|
/zod@3.21.4:
|
||||||
resolution: {integrity: sha512-m46AKbrzKVzOzs/DZgVnG5H55N1sv1M8qZU3A8RIKbs3mrACDNeIOeilDymVb2HdmP8uwshOCF4uJ8uM9rCqJw==}
|
resolution: {integrity: sha512-m46AKbrzKVzOzs/DZgVnG5H55N1sv1M8qZU3A8RIKbs3mrACDNeIOeilDymVb2HdmP8uwshOCF4uJ8uM9rCqJw==}
|
||||||
dev: false
|
dev: false
|
||||||
|
|||||||
@ -64,8 +64,8 @@ async def chat_app_handler(body: ChatAppBody, jwt: str):
|
|||||||
|
|
||||||
messages = [
|
messages = [
|
||||||
SystemMessagePromptTemplate.from_template("""You are PageAssist bot. Use the following pieces of context from this webpage to answer the question from the user.
|
SystemMessagePromptTemplate.from_template("""You are PageAssist bot. Use the following pieces of context from this webpage to answer the question from the user.
|
||||||
If you don't know the answer, just say you don't know. DO NOT try to make up an answer.
|
|
||||||
If user want recommendation, help from the context, or any other information, please provide it.
|
If user want recommendation, help from the context, or any other information, please provide it.
|
||||||
|
If you don't know the answer, just say you don't know. DO NOT try to make up an answer.
|
||||||
If the question is not related to the context, politely respond that you are tuned to only answer questions that are related to the context. Helpful answer in markdown:
|
If the question is not related to the context, politely respond that you are tuned to only answer questions that are related to the context. Helpful answer in markdown:
|
||||||
-----------------
|
-----------------
|
||||||
{context}
|
{context}
|
||||||
@ -133,8 +133,8 @@ async def chat_extension_handler(body: ChatBody):
|
|||||||
|
|
||||||
messages = [
|
messages = [
|
||||||
SystemMessagePromptTemplate.from_template("""You are PageAssist bot. Use the following pieces of context from this webpage to answer the question from the user.
|
SystemMessagePromptTemplate.from_template("""You are PageAssist bot. Use the following pieces of context from this webpage to answer the question from the user.
|
||||||
If you don't know the answer, just say you don't know. DO NOT try to make up an answer.
|
|
||||||
If user want recommendation, help from the context, or any other information, please provide it.
|
If user want recommendation, help from the context, or any other information, please provide it.
|
||||||
|
If you don't know the answer, just say you don't know. DO NOT try to make up an answer.
|
||||||
If the question is not related to the context, politely respond that you are tuned to only answer questions that are related to the context. Helpful answer in markdown:
|
If the question is not related to the context, politely respond that you are tuned to only answer questions that are related to the context. Helpful answer in markdown:
|
||||||
-----------------
|
-----------------
|
||||||
{context}
|
{context}
|
||||||
|
|||||||
204
src/components/Landing/Hero.tsx
Normal file
204
src/components/Landing/Hero.tsx
Normal file
@ -0,0 +1,204 @@
|
|||||||
|
import { Fragment } from "react";
|
||||||
|
import { Popover, Transition } from "@headlessui/react";
|
||||||
|
import { Bars3Icon, XMarkIcon } from "@heroicons/react/24/outline";
|
||||||
|
import Link from "next/link";
|
||||||
|
import { useUser } from "@supabase/auth-helpers-react";
|
||||||
|
import YouTube from "react-youtube";
|
||||||
|
|
||||||
|
export default function Hero() {
|
||||||
|
const user = useUser();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<div className="relative overflow-hidden">
|
||||||
|
<div className="relative pb-16 pt-6 sm:pb-24">
|
||||||
|
<Popover>
|
||||||
|
<div className="mx-auto max-w-7xl px-4 sm:px-6">
|
||||||
|
<nav
|
||||||
|
className="relative flex items-center justify-between sm:h-10 md:justify-center"
|
||||||
|
aria-label="Global"
|
||||||
|
>
|
||||||
|
<div className="flex flex-1 items-center md:absolute md:inset-y-0 md:left-0">
|
||||||
|
<div className="flex w-full items-center justify-between md:w-auto">
|
||||||
|
<Link href="/">
|
||||||
|
<span className="sr-only">Feedback Board</span>
|
||||||
|
<img
|
||||||
|
className="h-8 w-auto sm:h-10"
|
||||||
|
src="/logo.png"
|
||||||
|
alt="Feedback Board"
|
||||||
|
/>
|
||||||
|
</Link>
|
||||||
|
<div className="-mr-2 flex items-center md:hidden">
|
||||||
|
<Popover.Button className="inline-flex items-center justify-center rounded-md bg-gray-50 p-2 text-gray-400 hover:bg-gray-100 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-sky-500">
|
||||||
|
<span className="sr-only">Open main menu</span>
|
||||||
|
<Bars3Icon className="h-6 w-6" aria-hidden="true" />
|
||||||
|
</Popover.Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="hidden md:absolute md:inset-y-0 md:right-0 md:flex md:items-center md:justify-end">
|
||||||
|
<span className="inline-flex rounded-md shadow">
|
||||||
|
{user ? (
|
||||||
|
<Link
|
||||||
|
href="/dashboard"
|
||||||
|
className="inline-flex items-center rounded-md border border-transparent bg-indigo-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
||||||
|
>
|
||||||
|
Dashboard
|
||||||
|
</Link>
|
||||||
|
) : (
|
||||||
|
<Link
|
||||||
|
href="/auth"
|
||||||
|
className="inline-flex items-center rounded-md border border-transparent bg-indigo-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
||||||
|
>
|
||||||
|
Login
|
||||||
|
</Link>
|
||||||
|
)}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Transition
|
||||||
|
as={Fragment}
|
||||||
|
enter="duration-150 ease-out"
|
||||||
|
enterFrom="opacity-0 scale-95"
|
||||||
|
enterTo="opacity-100 scale-100"
|
||||||
|
leave="duration-100 ease-in"
|
||||||
|
leaveFrom="opacity-100 scale-100"
|
||||||
|
leaveTo="opacity-0 scale-95"
|
||||||
|
>
|
||||||
|
<Popover.Panel
|
||||||
|
focus
|
||||||
|
className="absolute inset-x-0 top-0 z-10 origin-top-right transform p-2 transition md:hidden"
|
||||||
|
>
|
||||||
|
<div className="overflow-hidden rounded-lg bg-white shadow-md ring-1 ring-black ring-opacity-5">
|
||||||
|
<div className="flex items-center justify-between px-5 pt-4">
|
||||||
|
<div>
|
||||||
|
<img
|
||||||
|
className="h-8 w-auto"
|
||||||
|
src="/logo.png"
|
||||||
|
alt="PageAssist"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="-mr-2">
|
||||||
|
<Popover.Button className="inline-flex items-center justify-center rounded-md bg-white p-2 text-gray-400 hover:bg-gray-100 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-sky-500">
|
||||||
|
<span className="sr-only">Close main menu</span>
|
||||||
|
<XMarkIcon className="h-6 w-6" aria-hidden="true" />
|
||||||
|
</Popover.Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{user ? (
|
||||||
|
<Link
|
||||||
|
href="/dashboard"
|
||||||
|
className="m-3 inline-flex items-center rounded-md border border-transparent bg-indigo-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
||||||
|
>
|
||||||
|
Account
|
||||||
|
</Link>
|
||||||
|
) : (
|
||||||
|
<Link
|
||||||
|
href="/auth"
|
||||||
|
className="m-3 inline-flex items-center rounded-md border border-transparent bg-indigo-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
||||||
|
>
|
||||||
|
Login
|
||||||
|
</Link>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</Popover.Panel>
|
||||||
|
</Transition>
|
||||||
|
</Popover>
|
||||||
|
<div className="py-24 sm:py-32 lg:pb-40">
|
||||||
|
<div className="mx-auto max-w-7xl px-6 lg:px-8">
|
||||||
|
<div className="mx-auto max-w-2xl text-center">
|
||||||
|
<h1 className="text-2xl font-bold tracking-tight text-gray-900 sm:text-5xl">
|
||||||
|
Chat with Any Webpage using PageAssist
|
||||||
|
</h1>
|
||||||
|
<p className="mt-6 text-lg leading-8 text-gray-600">
|
||||||
|
Revolutionize your browsing experience with PageAssist, an
|
||||||
|
open source Chrome extension that allows you to easily chat
|
||||||
|
with any webpage using the power of ChatGPT API.
|
||||||
|
</p>
|
||||||
|
<div className="mt-10 flex items-center justify-center gap-x-6">
|
||||||
|
<a
|
||||||
|
href="https://chrome.google.com/webstore/detail/page-assist/ehkjdalbpmmaddcfdilplgknkgepeakd?hl=en&authuser=2"
|
||||||
|
className="inline-flex items-center rounded-md border border-transparent bg-indigo-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="-ml-0.5 mr-2 h-4 w-4"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
strokeWidth="2"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
>
|
||||||
|
<circle cx="12" cy="12" r="10"></circle>
|
||||||
|
<circle cx="12" cy="12" r="4"></circle>
|
||||||
|
<path d="M21.17 8L12 8"></path>
|
||||||
|
<path d="M3.95 6.06L8.54 14"></path>
|
||||||
|
<path d="M10.88 21.94L15.46 14"></path>
|
||||||
|
</svg>
|
||||||
|
Install Now
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="https://github.com/n4ze3m/page-assist"
|
||||||
|
className="inline-flex items-center text-base font-semibold leading-7 text-gray-900 "
|
||||||
|
>
|
||||||
|
Star on GitHub
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="ml-2 h-4 w-4"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
strokeWidth="2"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
>
|
||||||
|
<path d="M15 22v-4a4.8 4.8 0 00-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 004 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4M9 18c-4.51 2-5-2-7-2"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<iframe
|
||||||
|
className="yt-video relative mx-auto mt-12 w-full max-w-4xl rounded-3xl border border-gray-300 shadow-2xl dark:border-gray-700 lg:mt-20"
|
||||||
|
src="https://www.youtube.com/embed/dQw4w9WgXcQ"
|
||||||
|
title="YouTube video player"
|
||||||
|
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||||
|
allowFullScreen
|
||||||
|
frameBorder={0}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className="absolute inset-x-0 top-[calc(100%-13rem)] -z-10 transform-gpu overflow-hidden blur-3xl sm:top-[calc(100%-30rem)]">
|
||||||
|
<svg
|
||||||
|
className="relative left-[calc(50%+3rem)] h-[21.1875rem] max-w-none -translate-x-1/2 sm:left-[calc(50%+36rem)] sm:h-[42.375rem]"
|
||||||
|
viewBox="0 0 1155 678"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
fill="url(#b9e4a85f-ccd5-4151-8e84-ab55c66e5aa1)"
|
||||||
|
fillOpacity=".3"
|
||||||
|
d="M317.219 518.975L203.852 678 0 438.341l317.219 80.634 204.172-286.402c1.307 132.337 45.083 346.658 209.733 145.248C936.936 126.058 882.053-94.234 1031.02 41.331c119.18 108.451 130.68 295.337 121.53 375.223L855 299l21.173 362.054-558.954-142.079z"
|
||||||
|
/>
|
||||||
|
<defs>
|
||||||
|
<linearGradient
|
||||||
|
id="b9e4a85f-ccd5-4151-8e84-ab55c66e5aa1"
|
||||||
|
x1="1155.49"
|
||||||
|
x2="-78.208"
|
||||||
|
y1=".177"
|
||||||
|
y2="474.645"
|
||||||
|
gradientUnits="userSpaceOnUse"
|
||||||
|
>
|
||||||
|
<stop stopColor="#9089FC" />
|
||||||
|
<stop offset={1} stopColor="#FF80B5" />
|
||||||
|
</linearGradient>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,53 +1,45 @@
|
|||||||
import { type NextPage } from "next";
|
import { type NextPage } from "next";
|
||||||
import Head from "next/head";
|
import Head from "next/head";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
|
import Hero from "~/components/Landing/Hero";
|
||||||
import { api } from "~/utils/api";
|
|
||||||
|
|
||||||
const Home: NextPage = () => {
|
const Home: NextPage = () => {
|
||||||
const hello = api.example.hello.useQuery({ text: "from tRPC" });
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Head>
|
<Head>
|
||||||
<title>Create T3 App</title>
|
<title>PageAssist</title>
|
||||||
<meta name="description" content="Generated by create-t3-app" />
|
<link rel="icon" href="/logo.png" />
|
||||||
<link rel="icon" href="/favicon.ico" />
|
|
||||||
</Head>
|
</Head>
|
||||||
<main className="flex min-h-screen flex-col items-center justify-center bg-gradient-to-b from-[#2e026d] to-[#15162c]">
|
<div className="isolate bg-white">
|
||||||
<div className="container flex flex-col items-center justify-center gap-12 px-4 py-16 ">
|
<div className="absolute inset-x-0 top-[-10rem] -z-10 transform-gpu overflow-hidden blur-3xl sm:top-[-20rem]">
|
||||||
<h1 className="text-5xl font-extrabold tracking-tight text-white sm:text-[5rem]">
|
<svg
|
||||||
Create <span className="text-[hsl(280,100%,70%)]">T3</span> App
|
className="relative left-[calc(50%-11rem)] -z-10 h-[21.1875rem] max-w-none -translate-x-1/2 rotate-[30deg] sm:left-[calc(50%-30rem)] sm:h-[42.375rem]"
|
||||||
</h1>
|
viewBox="0 0 1155 678"
|
||||||
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 md:gap-8">
|
|
||||||
<Link
|
|
||||||
className="flex max-w-xs flex-col gap-4 rounded-xl bg-white/10 p-4 text-white hover:bg-white/20"
|
|
||||||
href="https://create.t3.gg/en/usage/first-steps"
|
|
||||||
target="_blank"
|
|
||||||
>
|
>
|
||||||
<h3 className="text-2xl font-bold">First Steps →</h3>
|
<path
|
||||||
<div className="text-lg">
|
fill="url(#9b2541ea-d39d-499b-bd42-aeea3e93f5ff)"
|
||||||
Just the basics - Everything you need to know to set up your
|
fillOpacity=".3"
|
||||||
database and authentication.
|
d="M317.219 518.975L203.852 678 0 438.341l317.219 80.634 204.172-286.402c1.307 132.337 45.083 346.658 209.733 145.248C936.936 126.058 882.053-94.234 1031.02 41.331c119.18 108.451 130.68 295.337 121.53 375.223L855 299l21.173 362.054-558.954-142.079z"
|
||||||
</div>
|
/>
|
||||||
</Link>
|
<defs>
|
||||||
<Link
|
<linearGradient
|
||||||
className="flex max-w-xs flex-col gap-4 rounded-xl bg-white/10 p-4 text-white hover:bg-white/20"
|
id="9b2541ea-d39d-499b-bd42-aeea3e93f5ff"
|
||||||
href="https://create.t3.gg/en/introduction"
|
x1="1155.49"
|
||||||
target="_blank"
|
x2="-78.208"
|
||||||
|
y1=".177"
|
||||||
|
y2="474.645"
|
||||||
|
gradientUnits="userSpaceOnUse"
|
||||||
>
|
>
|
||||||
<h3 className="text-2xl font-bold">Documentation →</h3>
|
<stop stopColor="#9089FC" />
|
||||||
<div className="text-lg">
|
<stop offset={1} stopColor="#023e8a" />
|
||||||
Learn more about Create T3 App, the libraries it uses, and how
|
</linearGradient>
|
||||||
to deploy it.
|
</defs>
|
||||||
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
</Link>
|
<Hero />
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<p className="text-2xl text-white">
|
|
||||||
{hello.data ? hello.data.greeting : "Loading tRPC query..."}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -1,3 +1,20 @@
|
|||||||
@tailwind base;
|
@tailwind base;
|
||||||
@tailwind components;
|
@tailwind components;
|
||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
|
||||||
|
|
||||||
|
.yt-video {
|
||||||
|
height: 500px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 768px) {
|
||||||
|
.yt-video {
|
||||||
|
height: 300px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 480px) {
|
||||||
|
.yt-video {
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user