Add Prettier configuration. Run Prettier

2026-08-02 12:20:35 +08:00 · 2022-12-18 11:30:23 -08:00
parent ed47bcaa7a
commit f2be89fc73
22 changed files with 150 additions and 299 deletions
@@ -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}
@@ -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"
@@ -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,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} />;
 }
@@ -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>
                ))}
@@ -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>
  );
@@ -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">
@@ -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>