Add Prettier configuration. Run Prettier

This commit is contained in:
Lennon Puldagrealy
2022-12-18 11:30:23 -08:00
parent ed47bcaa7a
commit f2be89fc73
22 changed files with 150 additions and 299 deletions
+2 -2
View File
@@ -4,6 +4,6 @@ const nextConfig = {
experimental: {
scrollRestoration: true,
},
}
};
module.exports = nextConfig
module.exports = nextConfig;
+1 -1
View File
@@ -3,4 +3,4 @@ module.exports = {
tailwindcss: {},
autoprefixer: {},
},
}
};
@@ -45,4 +45,4 @@
<circle cx="193.83" cy="172.37" r="19.89" style="fill: #fff;"/>
<circle cx="253.44" cy="172.37" r="19.89" style="fill: #fff;"/>
<circle cx="313.05" cy="172.37" r="19.89" style="fill: #fff;"/>
</svg>
</svg>

Before

Width:  |  Height:  |  Size: 3.5 KiB

After

Width:  |  Height:  |  Size: 3.5 KiB

@@ -10,4 +10,4 @@
<circle cx="73.75" cy="133.36" r="19.89" style="fill: #fff;"/>
<circle cx="133.36" cy="133.36" r="19.89" style="fill: #fff;"/>
<circle cx="192.96" cy="133.36" r="19.89" style="fill: #fff;"/>
</svg>
</svg>

Before

Width:  |  Height:  |  Size: 723 B

After

Width:  |  Height:  |  Size: 724 B

-1
View File
@@ -1 +0,0 @@
+12 -1
View File
@@ -1 +1,12 @@
{}
{
"tabWidth": 2,
"printWidth": 120,
"overrides": [
{
"files": "*.css",
"options": {
"tabWidth": 4
}
}
]
}
+3 -13
View File
@@ -2,13 +2,7 @@ import Link from "next/link";
function BackgroundIllustration(props) {
return (
<svg
viewBox="0 0 1090 1090"
aria-hidden="true"
fill="none"
preserveAspectRatio="none"
{...props}
>
<svg viewBox="0 0 1090 1090" aria-hidden="true" fill="none" preserveAspectRatio="none" {...props}>
<circle cx={545} cy={545} r="544.5" />
<circle cx={545} cy={545} r="480.5" />
<circle cx={545} cy={545} r="416.5" />
@@ -30,12 +24,8 @@ export function AuthLayout({ title, subtitle, children }) {
height="1090"
className="absolute -top-7 left-1/2 -z-10 h-[788px] -translate-x-1/2 stroke-gray-300/30 [mask-image:linear-gradient(to_bottom,white_20%,transparent_75%)] sm:-top-9 sm:h-auto"
/>
<h1 className="text-center text-2xl font-medium tracking-tight text-gray-900">
{title}
</h1>
{subtitle && (
<p className="mt-3 text-center text-lg text-gray-600">{subtitle}</p>
)}
<h1 className="text-center text-2xl font-medium tracking-tight text-gray-900">{title}</h1>
{subtitle && <p className="mt-3 text-center text-lg text-gray-600">{subtitle}</p>}
</div>
<div className="-mx-4 mt-10 flex-auto bg-white py-10 px-4 shadow-2xl shadow-gray-900/10 sm:mx-0 sm:flex-none sm:rounded-2xl sm:p-24">
{children}
+7 -20
View File
@@ -3,23 +3,17 @@ import { Container } from "./Container";
export function CallToAction() {
return (
<section
id="join-us"
className="relative overflow-hidden bg-gray-900 py-20 sm:py-28"
>
<section id="join-us" className="relative overflow-hidden bg-gray-900 py-20 sm:py-28">
<div className="absolute top-1/2 left-20 -translate-y-1/2 sm:left-1/2 sm:-translate-x-1/2">
<CircleBackground color="#fff" className="animate-spin-slower" />
</div>
<Container className="relative">
<div className="mx-auto max-w-md sm:text-center">
<h2 className="text-3xl font-medium tracking-tight text-white sm:text-4xl">
Join Us
</h2>
<h2 className="text-3xl font-medium tracking-tight text-white sm:text-4xl">Join Us</h2>
<p className="mt-4 text-lg text-gray-300">
All open source projects begin with people like you. Open source is
the belief that if we collaborate we can together gift our
knoweledge and technology to the world for the benefit of humanity.
Are you in? Find us here:
All open source projects begin with people like you. Open source is the belief that if we collaborate we can
together gift our knoweledge and technology to the world for the benefit of humanity. Are you in? Find us
here:
</p>
<div className="mt-8 flex justify-center">
<a href="https://discord.gg/pXtnYk9c" target="_blank">
@@ -27,11 +21,7 @@ export function CallToAction() {
type="button"
className="mb-2 ml-6 flex items-center rounded-md border border-transparent bg-blue-600 px-6 py-3 text-base font-medium text-white shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2"
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 640 512"
className="w-6 h-6"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512" className="w-6 h-6">
<path
fill="currentColor"
d="M524.531,69.836a1.5,1.5,0,0,0-.764-.7A485.065,485.065,0,0,0,404.081,32.03a1.816,1.816,0,0,0-1.923.91,337.461,337.461,0,0,0-14.9,30.6,447.848,447.848,0,0,0-134.426,0,309.541,309.541,0,0,0-15.135-30.6,1.89,1.89,0,0,0-1.924-.91A483.689,483.689,0,0,0,116.085,69.137a1.712,1.712,0,0,0-.788.676C39.068,183.651,18.186,294.69,28.43,404.354a2.016,2.016,0,0,0,.765,1.375A487.666,487.666,0,0,0,176.02,479.918a1.9,1.9,0,0,0,2.063-.676A348.2,348.2,0,0,0,208.12,430.4a1.86,1.86,0,0,0-1.019-2.588,321.173,321.173,0,0,1-45.868-21.853,1.885,1.885,0,0,1-.185-3.126c3.082-2.309,6.166-4.711,9.109-7.137a1.819,1.819,0,0,1,1.9-.256c96.229,43.917,200.41,43.917,295.5,0a1.812,1.812,0,0,1,1.924.233c2.944,2.426,6.027,4.851,9.132,7.16a1.884,1.884,0,0,1-.162,3.126,301.407,301.407,0,0,1-45.89,21.83,1.875,1.875,0,0,0-1,2.611,391.055,391.055,0,0,0,30.014,48.815,1.864,1.864,0,0,0,2.063.7A486.048,486.048,0,0,0,610.7,405.729a1.882,1.882,0,0,0,.765-1.352C623.729,277.594,590.933,167.465,524.531,69.836ZM222.491,337.58c-28.972,0-52.844-26.587-52.844-59.239S193.056,219.1,222.491,219.1c29.665,0,53.306,26.82,52.843,59.239C275.334,310.993,251.924,337.58,222.491,337.58Zm195.38,0c-28.971,0-52.843-26.587-52.843-59.239S388.437,219.1,417.871,219.1c29.667,0,53.307,26.82,52.844,59.239C470.715,310.993,447.538,337.58,417.871,337.58Z"
@@ -41,10 +31,7 @@ export function CallToAction() {
</button>
</a>
<a
href="https://github.com/LAION-AI/Open-Assistant"
target="_blank"
>
<a href="https://github.com/LAION-AI/Open-Assistant" target="_blank">
<button
type="button"
className="mb-2 ml-6 flex items-center rounded-md border border-transparent bg-blue-600 px-6 py-3 text-base font-medium text-white shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2"
+4 -27
View File
@@ -1,31 +1,12 @@
import { useId } from "react";
export function CircleBackground({
color,
width = 558,
height = 558,
...props
}) {
export function CircleBackground({ color, width = 558, height = 558, ...props }) {
let id = useId();
return (
<svg
viewBox="0 0 558 558"
width={width}
height={height}
fill="none"
aria-hidden="true"
{...props}
>
<svg viewBox="0 0 558 558" width={width} height={height} fill="none" aria-hidden="true" {...props}>
<defs>
<linearGradient
id={id}
x1="79"
y1="16"
x2="105"
y2="237"
gradientUnits="userSpaceOnUse"
>
<linearGradient id={id} x1="79" y1="16" x2="105" y2="237" gradientUnits="userSpaceOnUse">
<stop stopColor={color} />
<stop offset="1" stopColor={color} stopOpacity="0" />
</linearGradient>
@@ -35,11 +16,7 @@ export function CircleBackground({
d="M1 279C1 125.465 125.465 1 279 1s278 124.465 278 278-124.465 278-278 278S1 432.535 1 279Z"
stroke={color}
/>
<path
d="M1 279C1 125.465 125.465 1 279 1"
stroke={`url(#${id})`}
strokeLinecap="round"
/>
<path d="M1 279C1 125.465 125.465 1 279 1" stroke={`url(#${id})`} strokeLinecap="round" />
</svg>
);
}
+1 -6
View File
@@ -1,10 +1,5 @@
import clsx from "clsx";
export function Container({ className, ...props }) {
return (
<div
className={clsx("mx-auto max-w-7xl px-4 sm:px-6 lg:px-8", className)}
{...props}
/>
);
return <div className={clsx("mx-auto max-w-7xl px-4 sm:px-6 lg:px-8", className)} {...props} />;
}
+3 -12
View File
@@ -28,17 +28,10 @@ const faqs = [
export function Faq() {
return (
<section
id="faq"
aria-labelledby="faqs-title"
className="border-t border-gray-200 py-20 sm:py-32"
>
<section id="faq" aria-labelledby="faqs-title" className="border-t border-gray-200 py-20 sm:py-32">
<Container className="">
<div className="mx-auto max-w-2xl lg:mx-0">
<h2
id="faqs-title"
className="text-3xl font-medium tracking-tight text-gray-900"
>
<h2 id="faqs-title" className="text-3xl font-medium tracking-tight text-gray-900">
Frequently Asked Questions
</h2>
{/* <p className="mt-2 text-lg text-gray-600">
@@ -61,9 +54,7 @@ export function Faq() {
<ul role="list" className="space-y-10">
{column.map((faq, faqIndex) => (
<li key={faqIndex}>
<h3 className="text-lg font-semibold leading-6 text-gray-900">
{faq.question}
</h3>
<h3 className="text-lg font-semibold leading-6 text-gray-900">{faq.question}</h3>
<p className="mt-4 text-sm text-gray-700">{faq.answer}</p>
</li>
))}
+1 -4
View File
@@ -5,10 +5,7 @@ const formClasses =
function Label({ id, children }) {
return (
<label
htmlFor={id}
className="mb-2 block text-sm font-semibold text-gray-900"
>
<label htmlFor={id} className="mb-2 block text-sm font-semibold text-gray-900">
{children}
</label>
);
+4 -22
View File
@@ -9,12 +9,7 @@ import { NavLinks } from "./NavLinks";
function MenuIcon(props) {
return (
<svg viewBox="0 0 24 24" fill="none" aria-hidden="true" {...props}>
<path
d="M5 6h14M5 18h14M5 12h14"
strokeWidth={2}
strokeLinecap="round"
strokeLinejoin="round"
/>
<path d="M5 6h14M5 18h14M5 12h14" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" />
</svg>
);
}
@@ -22,12 +17,7 @@ function MenuIcon(props) {
function ChevronUpIcon(props) {
return (
<svg viewBox="0 0 24 24" fill="none" aria-hidden="true" {...props}>
<path
d="M17 14l-5-5-5 5"
strokeWidth={2}
strokeLinecap="round"
strokeLinejoin="round"
/>
<path d="M17 14l-5-5-5 5" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" />
</svg>
);
}
@@ -73,13 +63,7 @@ export function Header() {
className="relative z-10 -m-2 inline-flex items-center rounded-lg stroke-gray-900 p-2 hover:bg-gray-200/50 hover:stroke-gray-600 active:stroke-gray-900 [&:not(:focus-visible)]:focus:outline-none"
aria-label="Toggle site navigation"
>
{({ open }) =>
open ? (
<ChevronUpIcon className="h-6 w-6" />
) : (
<MenuIcon className="h-6 w-6" />
)
}
{({ open }) => (open ? <ChevronUpIcon className="h-6 w-6" /> : <MenuIcon className="h-6 w-6" />)}
</Popover.Button>
<AnimatePresence initial={false}>
{open && (
@@ -105,9 +89,7 @@ export function Header() {
className="absolute inset-x-0 top-0 z-0 origin-top rounded-b-2xl bg-gray-50 px-6 pb-6 pt-32 shadow-2xl shadow-gray-900/20"
>
<div className="space-y-4">
<MobileNavLink href="#join-us">
Join Us
</MobileNavLink>
<MobileNavLink href="#join-us">Join Us</MobileNavLink>
<MobileNavLink href="#faqs">FAQs</MobileNavLink>
</div>
<div className="mt-8 flex flex-col gap-4">
+8 -35
View File
@@ -19,20 +19,9 @@ function BackgroundIllustration(props) {
stroke="#D4D4D4"
strokeOpacity="0.7"
/>
<path
d="M513 1025C230.23 1025 1 795.77 1 513"
stroke={`url(#${id}-gradient-1)`}
strokeLinecap="round"
/>
<path d="M513 1025C230.23 1025 1 795.77 1 513" stroke={`url(#${id}-gradient-1)`} strokeLinecap="round" />
<defs>
<linearGradient
id={`${id}-gradient-1`}
x1="1"
y1="513"
x2="1"
y2="1025"
gradientUnits="userSpaceOnUse"
>
<linearGradient id={`${id}-gradient-1`} x1="1" y1="513" x2="1" y2="1025" gradientUnits="userSpaceOnUse">
<stop stopColor="#06b6d4" />
<stop offset="1" stopColor="#06b6d4" stopOpacity="0" />
</linearGradient>
@@ -49,20 +38,9 @@ function BackgroundIllustration(props) {
stroke="#D4D4D4"
strokeOpacity="0.7"
/>
<path
d="M913 513c0 220.914-179.086 400-400 400"
stroke={`url(#${id}-gradient-2)`}
strokeLinecap="round"
/>
<path d="M913 513c0 220.914-179.086 400-400 400" stroke={`url(#${id}-gradient-2)`} strokeLinecap="round" />
<defs>
<linearGradient
id={`${id}-gradient-2`}
x1="913"
y1="513"
x2="913"
y2="913"
gradientUnits="userSpaceOnUse"
>
<linearGradient id={`${id}-gradient-2`} x1="913" y1="513" x2="913" y2="913" gradientUnits="userSpaceOnUse">
<stop stopColor="#06b6d4" />
<stop offset="1" stopColor="#06b6d4" stopOpacity="0" />
</linearGradient>
@@ -78,19 +56,14 @@ export function Hero() {
<Container className="">
<div className="lg:grid lg:grid-cols-12 lg:gap-x-8 lg:gap-y-20">
<div className="relative z-10 mx-auto max-w-2xl lg:col-span-7 lg:max-w-none lg:pt-6 xl:col-span-6">
<h1 className="text-5xl mb-6 font-bold tracking-tight text-gray-900">
Open Assistant
</h1>
<h1 className="text-5xl mb-6 font-bold tracking-tight text-gray-900">Open Assistant</h1>
<p className="mt-8 text-3xl inline bg-gradient-to-r from-indigo-600 via-sky-400 to-indigo-700 bg-clip-text font-display tracking-tight text-transparent">
<b>Conversational AI for everyone.</b>
</p>
<p className="mt-6 text-lg text-gray-600">We believe we can create a revolution.</p>
<p className="mt-6 text-lg text-gray-600">
We believe we can create a revolution.
</p>
<p className="mt-6 text-lg text-gray-600">
In the same way that Stable Diffusion helped the world make art
and images in new ways, we want to improve the world by providing
amazing conversational AI.
In the same way that Stable Diffusion helped the world make art and images in new ways, we want to improve
the world by providing amazing conversational AI.
</p>
</div>
+1 -4
View File
@@ -14,10 +14,7 @@ function MyApp({ Component, pageProps }) {
use();
}, []);
return (
<SessionContextProvider
supabaseClient={supabase}
initialSession={pageProps.initialSession}
>
<SessionContextProvider supabaseClient={supabase} initialSession={pageProps.initialSession}>
<Component {...pageProps} />
</SessionContextProvider>
);
+1 -5
View File
@@ -4,11 +4,7 @@ export default function Document() {
return (
<Html className="h-full bg-gray-50 antialiased" lang="en">
<Head>
<link
rel="shortcut icon"
type="image/png"
href="/images/logos/favicon.png"
/>
<link rel="shortcut icon" type="image/png" href="/images/logos/favicon.png" />
</Head>
<body className="flex h-full flex-col">
<Main />
+10 -33
View File
@@ -11,9 +11,7 @@ export default function OutputDetail(): JSX.Element {
<div className="rounded-lg shadow-lg h-full block bg-white">
<div className="p-6">
<h5 className="text-lg font-semibold mb-4">Instruction</h5>
<div className="bg-slate-800 p-6 rounded-xl text-white whitespace-pre-wrap">
{SAMPLE_PROMPT}
</div>
<div className="bg-slate-800 p-6 rounded-xl text-white whitespace-pre-wrap">{SAMPLE_PROMPT}</div>
</div>
</div>
@@ -21,18 +19,12 @@ export default function OutputDetail(): JSX.Element {
<div className="mt-6 lg:mt-0 rounded-lg shadow-lg h-full block bg-white">
<div className="p-6">
<h5 className="text-lg font-semibold mb-4">Output</h5>
<div className="bg-slate-800 p-6 rounded-xl text-white whitespace-pre-wrap">
{SAMPLE_OUTPUT}
</div>
<div className="bg-slate-800 p-6 rounded-xl text-white whitespace-pre-wrap">{SAMPLE_OUTPUT}</div>
</div>
{/* Form wrap*/}
<div className="p-6">
<h3 className="text-lg text-center font-medium leading-6 text-gray-900">
Rating
</h3>
<p className="text-center mt-1 text-sm text-gray-500">
(1 = worst, 7 = best)
</p>
<h3 className="text-lg text-center font-medium leading-6 text-gray-900">Rating</h3>
<p className="text-center mt-1 text-sm text-gray-500">(1 = worst, 7 = best)</p>
{/* Rating buttons */}
<div className="flex justify-center p-6">
@@ -85,12 +77,7 @@ export default function OutputDetail(): JSX.Element {
<div className="flex justify-center px-10">
<ul>
{ANNOTATION_FLAGS.map((option, i) => {
return (
<AnnotationCheckboxLi
option={option}
key={i}
></AnnotationCheckboxLi>
);
return <AnnotationCheckboxLi option={option} key={i}></AnnotationCheckboxLi>;
})}
</ul>
</div>
@@ -150,10 +137,7 @@ function AnnotationCheckboxLi(props: { option: annotationBool }): JSX.Element {
if (props.option.additionalExplanation) {
AdditionalExplanation = (
<a href="#" className="group flex items-center space-x-2.5 text-sm ">
<QuestionMarkCircleIcon
className="h-5 w-5 ml-3 text-gray-400 group-hover:text-gray-500"
aria-hidden="true"
/>
<QuestionMarkCircleIcon className="h-5 w-5 ml-3 text-gray-400 group-hover:text-gray-500" aria-hidden="true" />
</a>
);
}
@@ -167,13 +151,8 @@ function AnnotationCheckboxLi(props: { option: annotationBool }): JSX.Element {
value=""
id={props.option.attributeName}
/>
<label
className="flex ml-1 form-check-label hover:cursor-pointer"
htmlFor={props.option.attributeName}
>
<span className="text-gray-800 hover:text-blue-700">
{props.option.labelText}
</span>
<label className="flex ml-1 form-check-label hover:cursor-pointer" htmlFor={props.option.attributeName}>
<span className="text-gray-800 hover:text-blue-700">{props.option.labelText}</span>
{AdditionalExplanation}
</label>
</li>
@@ -210,8 +189,7 @@ const ANNOTATION_FLAGS: annotationBool[] = [
},
{
attributeName: "encourages_violence",
labelText:
"Encourages or fails to discourage violence/abuse/terrorism/self-harm",
labelText: "Encourages or fails to discourage violence/abuse/terrorism/self-harm",
},
{
attributeName: "denigrates_a_protected_class",
@@ -229,8 +207,7 @@ const ANNOTATION_FLAGS: annotationBool[] = [
},
];
const SAMPLE_PROMPT =
"Please make a list of aspects of a good pull request. Briefly describe each aspect.";
const SAMPLE_PROMPT = "Please make a list of aspects of a good pull request. Briefly describe each aspect.";
const SAMPLE_OUTPUT = `Here are some aspects of a good pull request, which you may use to help your pull requests be good contributions and get accepted:
+1 -8
View File
@@ -14,14 +14,7 @@ export default function Login() {
<AuthLayout title="" subtitle={<></>}>
<form>
<div className="space-y-6">
<TextField
label="Email address"
id="email"
name="email"
type="email"
autoComplete="email"
required
/>
<TextField label="Email address" id="email" name="email" type="email" autoComplete="email" required />
<TextField
label="Password"
id="password"
+7 -11
View File
@@ -39,17 +39,13 @@ export default function NewPage() {
// Every time we submit an answer to the latest task, let the backend handle
// all the interactions then add the resulting task to the queue. This ends
// when we hit the done task.
const { trigger, isMutating } = useSWRMutation(
"/api/update_task",
sendRequest,
{
onSuccess: async (data) => {
const newTask = await data.json();
// This is the more efficient way to update a react state array.
setTasks((oldTasks) => [...oldTasks, newTask]);
},
}
);
const { trigger, isMutating } = useSWRMutation("/api/update_task", sendRequest, {
onSuccess: async (data) => {
const newTask = await data.json();
// This is the more efficient way to update a react state array.
setTasks((oldTasks) => [...oldTasks, newTask]);
},
});
// Trigger a mutation that updates the current task. We should probably
// signal somewhere that this interaction is being processed.
+13 -13
View File
@@ -29,20 +29,20 @@ a {
}
} */
@font-face {
font-family: "Inter";
font-weight: 100 900;
font-display: block;
font-style: normal;
font-named-instance: "Regular";
src: url("/fonts/Inter-roman.var.woff2") format("woff2");
font-family: "Inter";
font-weight: 100 900;
font-display: block;
font-style: normal;
font-named-instance: "Regular";
src: url("/fonts/Inter-roman.var.woff2") format("woff2");
}
@font-face {
font-family: "Inter";
font-weight: 100 900;
font-display: block;
font-style: italic;
font-named-instance: "Italic";
src: url("/fonts/Inter-italic.var.woff2") format("woff2");
font-family: "Inter";
font-weight: 100 900;
font-display: block;
font-style: italic;
font-named-instance: "Italic";
src: url("/fonts/Inter-italic.var.woff2") format("woff2");
}
@tailwind base;
@@ -50,5 +50,5 @@ a {
@tailwind utilities;
#__next {
min-height: 100%;
min-height: 100%;
}
+66 -66
View File
@@ -1,77 +1,77 @@
const defaultTheme = require('tailwindcss/defaultTheme')
const defaultTheme = require("tailwindcss/defaultTheme");
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
'./src/**/*.{html,js,ts,jsx,tsx,svg}',
'./node_modules/tw-elements/dist/js/**/*.js'],
theme: {
fontSize: {
xs: ['0.75rem', { lineHeight: '1rem' }],
sm: ['0.875rem', { lineHeight: '1.5rem' }],
base: ['1rem', { lineHeight: '1.5rem' }],
lg: ['1.125rem', { lineHeight: '2rem' }],
xl: ['1.25rem', { lineHeight: '1.75rem' }],
'2xl': ['1.5rem', { lineHeight: '2rem' }],
'3xl': ['2rem', { lineHeight: '3rem' }],
'4xl': ['2.5rem', { lineHeight: '3rem' }],
'5xl': ['3rem', { lineHeight: '1' }],
'6xl': ['3.75rem', { lineHeight: '1' }],
'7xl': ['4.5rem', { lineHeight: '1' }],
'8xl': ['6rem', { lineHeight: '1' }],
'9xl': ['8rem', { lineHeight: '1' }],
"./src/**/*.{html,js,ts,jsx,tsx,svg}",
"./node_modules/tw-elements/dist/js/**/*.js",
],
theme: {
fontSize: {
xs: ["0.75rem", { lineHeight: "1rem" }],
sm: ["0.875rem", { lineHeight: "1.5rem" }],
base: ["1rem", { lineHeight: "1.5rem" }],
lg: ["1.125rem", { lineHeight: "2rem" }],
xl: ["1.25rem", { lineHeight: "1.75rem" }],
"2xl": ["1.5rem", { lineHeight: "2rem" }],
"3xl": ["2rem", { lineHeight: "3rem" }],
"4xl": ["2.5rem", { lineHeight: "3rem" }],
"5xl": ["3rem", { lineHeight: "1" }],
"6xl": ["3.75rem", { lineHeight: "1" }],
"7xl": ["4.5rem", { lineHeight: "1" }],
"8xl": ["6rem", { lineHeight: "1" }],
"9xl": ["8rem", { lineHeight: "1" }],
},
extend: {
screens: {
"lt-lg": { max: "1023px" },
"lt-md": { max: "767px" },
"gt-sm": { min: "641px" },
"gt-md": { min: "768px" },
},
extend: {
screens: {
'lt-lg': { max: '1023px' },
'lt-md': { max: '767px' },
'gt-sm': { min: '641px' },
'gt-md': { min: '768px' },
},
animation: {
'fade-in': 'fade-in 0.5s linear forwards',
marquee: 'marquee var(--marquee-duration) linear infinite',
'spin-slow': 'spin 4s linear infinite',
'spin-slower': 'spin 6s linear infinite',
'spin-reverse': 'spin-reverse 1s linear infinite',
'spin-reverse-slow': 'spin-reverse 4s linear infinite',
'spin-reverse-slower': 'spin-reverse 6s linear infinite',
},
borderRadius: {
'4xl': '2rem',
'5xl': '2.5rem',
},
colors: ({ colors }) => ({
gray: colors.neutral,
}),
fontFamily: {
sans: ['Inter', ...defaultTheme.fontFamily.sans],
},
keyframes: {
'fade-in': {
from: {
opacity: 0,
},
to: {
opacity: 1,
},
animation: {
"fade-in": "fade-in 0.5s linear forwards",
marquee: "marquee var(--marquee-duration) linear infinite",
"spin-slow": "spin 4s linear infinite",
"spin-slower": "spin 6s linear infinite",
"spin-reverse": "spin-reverse 1s linear infinite",
"spin-reverse-slow": "spin-reverse 4s linear infinite",
"spin-reverse-slower": "spin-reverse 6s linear infinite",
},
borderRadius: {
"4xl": "2rem",
"5xl": "2.5rem",
},
colors: ({ colors }) => ({
gray: colors.neutral,
}),
fontFamily: {
sans: ["Inter", ...defaultTheme.fontFamily.sans],
},
keyframes: {
"fade-in": {
from: {
opacity: 0,
},
marquee: {
'100%': {
transform: 'translateY(-50%)',
},
},
'spin-reverse': {
to: {
transform: 'rotate(-360deg)',
},
to: {
opacity: 1,
},
},
maxWidth: {
'2xl': '40rem',
marquee: {
"100%": {
transform: "translateY(-50%)",
},
},
"spin-reverse": {
to: {
transform: "rotate(-360deg)",
},
},
},
maxWidth: {
"2xl": "40rem",
},
},
plugins: [require('@tailwindcss/forms')],
}
},
plugins: [require("@tailwindcss/forms")],
};
+3 -13
View File
@@ -1,11 +1,7 @@
{
"compilerOptions": {
"target": "es5",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"strict": false,
@@ -19,12 +15,6 @@
"isolatedModules": true,
"jsx": "preserve"
},
"include": [
"next-env.d.ts",
"**/*.ts",
"**/*.tsx"
],
"exclude": [
"node_modules"
]
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
"exclude": ["node_modules"]
}