Merge pull request #688 from and-voila/srizvi/issue687

style: misc. style updates #687
and-voila · Jan 28, 2024 · a6eca95 · a6eca95
2 parents 088ba27 + 33d2d18
commit a6eca95
Show file tree

Hide file tree

Showing 17 changed files with 45 additions and 33 deletions.
diff --git a/apps/ai/src/app/(routes)/studio/(admin)/admin/page.tsx b/apps/ai/src/app/(routes)/studio/(admin)/admin/page.tsx
@@ -87,7 +87,7 @@ export default async function AdminPage() {
                 >
                   {item.linkText}
                   <Icons.arrowRight
-                    className="h-5 w-5 justify-end text-primary"
+                    className="h-5 w-5 justify-end text-alternate"
                     aria-hidden="true"
                   />
                 </button>
@@ -106,7 +106,7 @@ export default async function AdminPage() {
                 >
                   {item.linkText}
                   <Icons.arrowRight
-                    className="h-5 w-5 justify-end text-primary"
+                    className="h-5 w-5 justify-end text-alternate"
                     aria-hidden="true"
                   />
                 </Link>

diff --git a/apps/ai/src/app/(routes)/studio/(personal)/my/support/page.tsx b/apps/ai/src/app/(routes)/studio/(personal)/my/support/page.tsx
@@ -94,7 +94,7 @@ export default async function SupportPage() {
                 {item.linkText}
                 {''}
                 <Icons.arrowRight
-                  className="h-5 w-5 justify-end text-primary"
+                  className="h-5 w-5 justify-end text-alternate"
                   aria-hidden="true"
                 />
               </Link>

diff --git a/apps/ai/src/app/(routes)/studio/(teams)/[team_slug]/workspace/(home)/page.tsx b/apps/ai/src/app/(routes)/studio/(teams)/[team_slug]/workspace/(home)/page.tsx
@@ -121,7 +121,7 @@ const TeamWorkspaceIndex: NextPage<Props> = async (props) => {
                 >
                   {item.linkText}
                   <Icons.arrowRight
-                    className="h-5 w-5 justify-end text-primary"
+                    className="h-5 w-5 justify-end text-alternate"
                     aria-hidden="true"
                   />
                 </button>
@@ -140,7 +140,7 @@ const TeamWorkspaceIndex: NextPage<Props> = async (props) => {
                 >
                   {item.linkText}
                   <Icons.arrowRight
-                    className="h-5 w-5 justify-end text-primary"
+                    className="h-5 w-5 justify-end text-alternate"
                     aria-hidden="true"
                   />
                 </Link>

diff --git a/apps/ai/src/app/(routes)/studio/(teams)/[team_slug]/workspace/(home)/support/page.tsx b/apps/ai/src/app/(routes)/studio/(teams)/[team_slug]/workspace/(home)/support/page.tsx
@@ -98,7 +98,7 @@ export default async function SupportPage() {
                 {item.linkText}
                 {''}
                 <Icons.arrowRight
-                  className="h-5 w-5 justify-end text-primary"
+                  className="h-5 w-5 justify-end text-alternate"
                   aria-hidden="true"
                 />
               </Link>

diff --git a/...i/src/app/(routes)/studio/(teams)/[team_slug]/workspace/publish/(site)/site/[id]/page.tsx b/...i/src/app/(routes)/studio/(teams)/[team_slug]/workspace/publish/(site)/site/[id]/page.tsx
@@ -55,11 +55,11 @@ export default async function SiteManage({
           }
           target="_blank"
           rel="noreferrer"
-          className="mr-2 mt-4 inline-flex w-full items-center truncate rounded-md text-xs text-foreground underline underline-offset-4 transition-colors hover:opacity-70 md:mt-0 md:w-auto md:py-0"
+          className="mr-2 mt-4 inline-flex w-full items-center truncate rounded-md text-xs text-alternate underline underline-offset-4 transition-colors hover:text-alternate/80 md:mt-0 md:w-auto md:py-0"
         >
           {url}
           {''}
-          <Icons.arrowSquareOut className="ml-1 h-4 w-4 text-primary" />
+          <Icons.arrowSquareOut className="ml-1 h-4 w-4 text-alternate" />
         </a>
         <OverviewSitesCTA teamSlug={params.team_slug} />
         <NewCollabPostButton />

diff --git a/apps/ai/src/components/forms/billing-info.tsx b/apps/ai/src/components/forms/billing-info.tsx
@@ -35,7 +35,7 @@ export function BillingInfo({
         <CardDescription>
           Your workspace for <span className="font-semibold">{teamName}</span>{' '}
           is on the{' '}
-          <span className="text-primary">
+          <span className="text-alternate">
             <strong>{subscriptionPlan.title}</strong>
           </span>{' '}
           plan.
@@ -62,7 +62,7 @@ export function BillingInfo({
             {subscriptionPlan.isCanceled
               ? 'Your plan will be canceled on '
               : 'Your plan renews on '}
-            <span className="font-bold text-primary">
+            <span className="font-bold text-alternate">
               {subscriptionPlan.stripeCurrentPeriodEnd
                 ? formatDate(subscriptionPlan.stripeCurrentPeriodEnd)
                 : 'N/A'}

diff --git a/apps/ai/src/components/forms/display-name-form.tsx b/apps/ai/src/components/forms/display-name-form.tsx
@@ -107,7 +107,7 @@ export function DisplayNameForm({ user }: DisplayNameFormProps) {
             />
             <p className="my-2 text-sm text-muted-foreground">
               Your display name will appear as:{' '}
-              <span className="font-medium text-primary">
+              <span className="font-medium text-alternate">
                 @{transformedDisplayName}
               </span>
             </p>

diff --git a/apps/ai/src/components/forms/new-team-form.tsx b/apps/ai/src/components/forms/new-team-form.tsx
@@ -87,7 +87,7 @@ export const NewTeamForm: React.FC = () => {
         <FormDescription className="my-2 text-sm text-muted-foreground">
           Your team workspace will be{' '}
           <span className="font-medium">labs.andvoila.gg</span>
-          <span className="font-medium text-primary">
+          <span className="font-medium text-alternate">
             {slugPreview ? `/${slugPreview}` : '/...'}
           </span>
         </FormDescription>

diff --git a/apps/ai/src/components/layout/main-nav-menu.tsx b/apps/ai/src/components/layout/main-nav-menu.tsx
@@ -156,6 +156,18 @@ export const MainNavigationMenu: React.FC<MainNavigationMenuProps> = ({
                   </a>
                 </NavigationMenuLink>
               </li>
+              <ListItem
+                href={`${APP_BP}/${activeSlug}/workspace/publish`}
+                title="Create a site"
+              >
+                Create your own site with custom domain in under 3 mins.
+              </ListItem>
+              <ListItem
+                href={`${APP_BP}/${activeSlug}/workspace/publish`}
+                title="Create content"
+              >
+                Draft content with an AI-assisted editor that has your back.
+              </ListItem>
             </ul>
           </NavigationMenuContent>
         </NavigationMenuItem>

diff --git a/apps/ai/src/components/marketing/pricing-card.tsx b/apps/ai/src/components/marketing/pricing-card.tsx
@@ -59,7 +59,7 @@ const PricingCard = ({
               className="flex items-start text-muted-foreground"
               key={feature}
             >
-              <Icons.check className="mr-3 h-5 w-5 shrink-0 text-primary/70" />
+              <Icons.check className="mr-3 h-5 w-5 shrink-0 text-alternate/70" />
               <p>{feature}</p>
             </li>
           ))}

diff --git a/apps/ai/src/components/publish/form/index.tsx b/apps/ai/src/components/publish/form/index.tsx
@@ -107,17 +107,17 @@ export default function Form({
             <input
               {...inputAttrs}
               required
-              className="z-10 flex-1 rounded-l-md border bg-background text-sm text-foreground placeholder-muted-foreground focus:border-ring focus:outline-none focus:ring-ring"
+              className="z-10 h-9 flex-1 rounded-l-md border bg-background px-3 py-1 text-sm text-foreground placeholder-muted-foreground focus:border-ring focus:outline-none focus:ring-ring"
             />
-            <div className="flex items-center rounded-r-lg border border-l-0 bg-primary/20 px-3 text-sm">
+            <div className="flex items-center rounded-r-lg border border-l-0 px-3 text-sm text-alternate">
               {env.NEXT_PUBLIC_ROOT_DOMAIN}
             </div>
           </div>
         ) : inputAttrs.name === 'customDomain' ? (
           <div className="relative flex w-full max-w-md">
             <input
               {...inputAttrs}
-              className="z-10 flex-1 rounded-md border bg-background text-sm text-foreground placeholder-muted-foreground focus:border-ring focus:outline-none focus:ring-ring"
+              className="z-10 h-9 flex-1 rounded-md border bg-background px-3 py-1 text-sm text-foreground placeholder-muted-foreground focus:border-ring focus:outline-none focus:ring-ring"
             />
             {inputAttrs.defaultValue && (
               <div className="absolute right-3 z-10 flex h-full items-center">
@@ -130,13 +130,13 @@ export default function Form({
             {...inputAttrs}
             rows={3}
             required
-            className="w-full max-w-xl rounded-md border bg-background text-sm text-foreground placeholder-muted-foreground focus:border-ring focus:outline-none focus:ring-ring"
+            className="h-20 w-full max-w-xl rounded-md border bg-background px-3 py-2 text-sm text-foreground placeholder-muted-foreground focus:border-ring focus:outline-none focus:ring-ring"
           />
         ) : (
           <input
             {...inputAttrs}
             required
-            className="w-full max-w-md rounded-md border bg-background text-sm text-foreground placeholder-muted-foreground focus:border-ring focus:outline-none focus:ring-ring"
+            className="h-9 w-full max-w-md rounded-md border bg-background px-3 py-1 text-sm text-foreground placeholder-muted-foreground focus:border-ring focus:outline-none focus:ring-ring"
           />
         )}
       </div>

diff --git a/apps/ai/src/components/publish/form/new/new-collab-post-form.tsx b/apps/ai/src/components/publish/form/new/new-collab-post-form.tsx
@@ -98,7 +98,7 @@ export const NewCollabPostForm: React.FC<NewCollabPostFormProps> = ({
         </FormControl>
         <FormDescription className="my-2 text-xs text-muted-foreground">
           <span className="font-medium">your-subdomain.andvoila.gg</span>
-          <span className="font-medium text-primary">
+          <span className="font-medium text-alternate">
             {slugPreview ? `/${slugPreview}` : '/...'}
           </span>
         </FormDescription>

diff --git a/apps/ai/src/components/publish/modal/create-site.tsx b/apps/ai/src/components/publish/modal/create-site.tsx
@@ -143,7 +143,7 @@ export default function CreateSiteModal({ teamSlug }: CreateSiteModalProps) {
               required
               className="w-full rounded-md border border-input bg-background px-4 py-2 text-sm text-foreground placeholder:text-muted-foreground/70 focus:border-ring focus:outline-none focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50"
             />
-            <div className="flex items-center rounded-r-lg border border-l-0 bg-primary/20 px-3 text-sm">
+            <div className="flex items-center rounded-r-lg border border-l-0 px-3 text-sm text-alternate">
               .{env.NEXT_PUBLIC_ROOT_DOMAIN}
             </div>
           </div>

diff --git a/apps/ai/src/components/publish/post-card.tsx b/apps/ai/src/components/publish/post-card.tsx
@@ -31,7 +31,7 @@ export default function PostCard({ data, teamSlug }: PostCardProps) {
             alt={data.title ?? 'Card thumbnail'}
             width={500}
             height={400}
-            className="h-44 object-cover grayscale group-hover:grayscale-0"
+            className="h-44 object-cover transition-colors group-hover:grayscale"
             src={data.image ?? '/post-placeholder.jpg'}
             placeholder="blur"
             blurDataURL={data.imageBlurhash ?? placeholderBlurhash}
@@ -46,12 +46,12 @@ export default function PostCard({ data, teamSlug }: PostCardProps) {
                   height={48}
                   src={data.site?.logo ?? '/default-site-logo.jpg'}
                   alt=""
-                  className="h-5 w-5 flex-none rounded-full bg-background/10"
+                  className="h-5 w-5 flex-none rounded-full bg-background/10 transition-colors group-hover:grayscale"
                   placeholder="blur"
                   blurDataURL={data.imageBlurhash ?? placeholderBlurhash}
                 />
               </div>
-              <h3 className="text-sm font-semibold leading-6 text-primary">
+              <h3 className="text-sm font-semibold leading-6 text-primary transition-colors group-hover:text-muted-foreground">
                 <span className="absolute inset-0" />
                 {data.site?.name}
               </h3>
@@ -72,17 +72,17 @@ export default function PostCard({ data, teamSlug }: PostCardProps) {
             }
             target="_blank"
             rel="noreferrer"
-            className="truncate rounded-md py-2 text-xs text-muted-foreground underline underline-offset-4 transition-colors group-hover:text-foreground"
+            className="truncate rounded-md py-2 text-sm text-alternate underline underline-offset-4 transition-colors group-hover:text-alternate/80"
           >
-            <span className="flex flex-row items-center gap-1 text-primary">
+            <span className="flex flex-row items-center gap-1">
               Visit post
               {''}
-              <Icons.arrowSquareOut className="ml-1 h-3 w-3 text-muted-foreground transition-colors group-hover:text-foreground" />
+              <Icons.arrowSquareOut className="ml-1 h-4 w-4 text-alternate" />
             </span>
           </a>
         </div>
       ) : (
-        <span className="absolute bottom-4 mx-4 rounded-sm border border-muted-foreground bg-foreground px-1  text-sm font-medium text-primary-foreground shadow-md">
+        <span className="absolute bottom-4 mx-4 rounded-sm border border-alternate px-1 text-sm font-medium text-alternate">
           Draft
         </span>
       )}

diff --git a/apps/ai/src/components/publish/site-card.tsx b/apps/ai/src/components/publish/site-card.tsx
@@ -29,7 +29,7 @@ export default function SiteCard({ data, teamSlug }: SiteCardProps) {
           alt={data.name ?? 'Card thumbnail'}
           width={500}
           height={400}
-          className="absolute inset-0 -z-10 h-full w-full object-cover grayscale group-hover:grayscale-0"
+          className="absolute inset-0 -z-10 h-full w-full object-cover transition-colors group-hover:grayscale"
           placeholder="blur"
           blurDataURL={data.imageBlurhash ?? placeholderBlurhash}
         />
@@ -44,12 +44,12 @@ export default function SiteCard({ data, teamSlug }: SiteCardProps) {
                 height={48}
                 src={data.logo ?? '/default-site-logo.jpg'}
                 alt=""
-                className="h-6 w-6 flex-none rounded-full bg-background/10 grayscale group-hover:grayscale-0"
+                className="h-6 w-6 flex-none rounded-full bg-background/10 group-hover:grayscale"
                 placeholder="blur"
                 blurDataURL={data.imageBlurhash ?? placeholderBlurhash}
               />
             </div>
-            <h3 className="text-lg font-semibold leading-6 text-foreground">
+            <h3 className="text-lg font-semibold leading-6 text-primary transition-colors group-hover:text-foreground">
               <span className="absolute inset-0" />
               {data.name}
             </h3>
@@ -70,7 +70,7 @@ export default function SiteCard({ data, teamSlug }: SiteCardProps) {
           <span className="flex flex-row items-center gap-1">
             {url}
             {''}
-            <Icons.arrowSquareOut className="ml-1 h-3 w-3 text-muted-foreground transition-colors group-hover:text-foreground" />
+            <Icons.arrowSquareOut className="ml-1 h-3 w-3 text-alternate" />
           </span>
         </a>
       </div>

diff --git a/apps/ai/src/components/teams/team-card.tsx b/apps/ai/src/components/teams/team-card.tsx
@@ -69,7 +69,7 @@ export const TeamCard: React.FC<TeamCardProps> = (props) => {
               <div className="flex items-center">
                 <Icons.circleFilled className="mr-1 h-3 w-3 text-alternate" />
                 labs.andvoila.gg/
-                <span className="text-primary">{team.slug}</span>
+                <span className="text-alternate">{team.slug}</span>
               </div>
             </div>
           </CardContent>

diff --git a/apps/ai/src/config/subscriptions.ts b/apps/ai/src/config/subscriptions.ts
@@ -52,7 +52,7 @@ export const pricingData: SubscriptionPlan[] = [
       'AI-enhanced SEO tools',
       'Unlimited access to Discord channels',
       'Attend all expert AMAs',
-      'Personalized AMAs with expert moderators',
+      'Book personal AMAs',
       '24/7 live support',
       '100% Delight Guarantee',
     ],