From c42028627d2ad4c5b184a0d02e25c8bcfb4b6c6d Mon Sep 17 00:00:00 2001
From: Justin Xue <67207128+jxmoose@users.noreply.github.com>
Date: Sat, 26 Oct 2024 12:00:36 -0700
Subject: [PATCH] fix: change font name (#17)
---
app/(auth)/auth-styles.ts | 16 ++++++++--------
app/layout.tsx | 4 ++--
app/onboarding/styles.ts | 4 ++--
styles/fonts.ts | 6 +++---
styles/text.ts | 4 ++--
5 files changed, 17 insertions(+), 17 deletions(-)
diff --git a/app/(auth)/auth-styles.ts b/app/(auth)/auth-styles.ts
index 4b497aa..8388fa6 100644
--- a/app/(auth)/auth-styles.ts
+++ b/app/(auth)/auth-styles.ts
@@ -1,10 +1,10 @@
import styled from 'styled-components';
import COLORS from '@/styles/colors';
-import { BespokeSans } from '@/styles/fonts';
+import { Sans } from '@/styles/fonts';
import { H3, P } from '@/styles/text';
export const Container = styled.div`
- font-family: ${BespokeSans.style.fontFamily}, sans-serif;
+ font-family: ${Sans.style.fontFamily}, sans-serif;
display: flex;
flex-direction: column;
align-items: center;
@@ -41,13 +41,13 @@ export const Form = styled.div`
`;
export const Label = styled(P)`
- font-family: ${BespokeSans.style.fontFamily};
+ font-family: ${Sans.style.fontFamily};
font-weight: 500;
margin-bottom: -0.2rem;
`;
export const Input = styled.input`
- font-family: ${BespokeSans.style.fontFamily};
+ font-family: ${Sans.style.fontFamily};
padding: 0.7rem;
border: 1px solid ${COLORS.gray4};
border-radius: 8px;
@@ -57,7 +57,7 @@ export const Input = styled.input`
`;
export const Button = styled.button`
- font-family: ${BespokeSans.style.fontFamily};
+ font-family: ${Sans.style.fontFamily};
background-color: ${COLORS.gray12};
color: white;
font-size: 1rem;
@@ -98,7 +98,7 @@ export const Separator = styled.div`
`;
export const Link = styled.a`
- font-family: ${BespokeSans.style.fontFamily};
+ font-family: ${Sans.style.fontFamily};
// TODO: CHANGE COLOR TO BLUE ONCE COLORS.TS IS UPDATED
color: #3978ff;
text-decoration: none;
@@ -114,14 +114,14 @@ export const SmallBuffer = styled.div`
// TODO: Temporarily added to verify that supabase login functionality actually works
export const LoginMessage = styled(P)<{ isError: boolean }>`
- font-family: ${BespokeSans.style.fontFamily};
+ font-family: ${Sans.style.fontFamily};
color: ${({ isError }) => (isError ? 'red' : 'green')};
text-align: center;
margin-top: 0.5rem;
`;
export const Footer = styled.div`
- font-family: ${BespokeSans.style.fontFamily};
+ font-family: ${Sans.style.fontFamily};
text-align: center;
margin-top: 1rem;
width: 100%;
diff --git a/app/layout.tsx b/app/layout.tsx
index 735d836..af25d98 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -1,6 +1,6 @@
import type { Metadata } from 'next';
import StyledComponentsRegistry from '@/lib/registry';
-import { BespokeSans } from '../styles/fonts';
+import { Sans } from '../styles/fonts';
import '../styles/global.css';
// site metadata - what shows up on embeds
@@ -16,7 +16,7 @@ export default function RootLayout({
}>) {
return (
-
+
{children}
diff --git a/app/onboarding/styles.ts b/app/onboarding/styles.ts
index e7ce020..8468a97 100644
--- a/app/onboarding/styles.ts
+++ b/app/onboarding/styles.ts
@@ -3,7 +3,7 @@
import NextImage from 'next/image';
import Link from 'next/link';
import styled from 'styled-components';
-import { BespokeSans } from '@/styles/fonts';
+import { Sans } from '@/styles/fonts';
import COLORS from '../../styles/colors';
export const Background = styled.main`
@@ -102,7 +102,7 @@ export const ContinueButton = styled.button`
`;
export const ContinueText = styled.text`
- ${BespokeSans.style}
+ ${Sans.style}
color: white;
font-size: 14px;
padding: 10px;
diff --git a/styles/fonts.ts b/styles/fonts.ts
index 48143bf..79e9c1c 100644
--- a/styles/fonts.ts
+++ b/styles/fonts.ts
@@ -1,6 +1,6 @@
import localFont from 'next/font/local';
-const BespokeSans = localFont({
+const Sans = localFont({
src: [
{
path: '../public/fonts/BespokeSans_Complete/Fonts/OTF/BespokeSans-Light.otf',
@@ -30,7 +30,7 @@ const BespokeSans = localFont({
],
});
-const BespokeSerif = localFont({
+const Serif = localFont({
src: [
{
path: '../public/fonts/BespokeSerif_Complete/Fonts/OTF/BespokeSerif-Light.otf',
@@ -85,4 +85,4 @@ const ClashGrotesk = localFont({
],
});
-export { BespokeSans, BespokeSerif, ClashGrotesk };
+export { Sans, Serif, ClashGrotesk };
diff --git a/styles/text.ts b/styles/text.ts
index 5be3e7d..a353fa9 100644
--- a/styles/text.ts
+++ b/styles/text.ts
@@ -1,7 +1,7 @@
'use client';
import styled, { css } from 'styled-components';
-import { BespokeSans } from './fonts';
+import { Sans } from './fonts';
interface TextProps {
$color?: string;
@@ -10,7 +10,7 @@ interface TextProps {
}
const TextStyles = css`
- ${BespokeSans.style}
+ ${Sans.style}
font-weight: ${({ $fontWeight }) => $fontWeight || '700'};
color: ${({ $color }) => $color || 'black'};
text-align: ${({ $align }) => $align};