Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor: add inter-tight, grotesk fonts #90

Merged
merged 1 commit into from
Aug 13, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/app/layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import './globals.css';
import type { Metadata } from 'next';
import { Inter } from 'next/font/google';

import { lato, roboto } from '@/shared/core/fonts';
import { grotesk, interTight } from '@/shared/core/fonts';
import { InitPathSyncer } from '@/shared/components/init-path-syncer';
import { NavLayout } from '@/shared/components/nav-space-layout';
import { PageScrollDisabler } from '@/shared/components/page-scroll-disabler';
Expand All @@ -25,7 +25,7 @@ interface RootLayoutProps {
const RootLayout: React.FC<RootLayoutProps> = ({ children }) => (
<html
lang="en"
className={`bg-[#0D0D0D] ${lato.variable} ${roboto.variable}`}
className={`bg-[#0D0D0D] ${interTight.variable} ${grotesk.variable}`}
>
<body className={inter.className}>
<NextUIProvider>
Expand Down
4 changes: 2 additions & 2 deletions src/orgs/components/org-card/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -41,8 +41,8 @@ export const OrgCard = (props: Props) => {
>
<LogoTitle src={src}>
<div className="flex flex-col">
<h3 className="font-lato text-lg font-bold">{name}</h3>
<h4 className="font-lato text-sm text-white/60">{location}</h4>
<h3 className="text-lg font-bold">{name}</h3>
<h4 className="text-sm text-white/60">{location}</h4>
</div>
</LogoTitle>

Expand Down
2 changes: 1 addition & 1 deletion src/shared/components/chains-info-tag.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ const CHAIN_COUNTS = {
const AvatarGroupCount = ({ count }: { count: number }) => (
<Tooltip content={`${count} other ${getPluralText('chain', count)}`}>
<div className="z-10 ml-[-10px] flex size-[30px] items-center justify-center rounded-full bg-[#E5ECF6]">
<Text className="font-lato text-sm text-black" text={`+${count}`} />
<Text className="text-sm text-black" text={`+${count}`} />
</div>
</Tooltip>
);
Expand Down
9 changes: 3 additions & 6 deletions src/shared/components/details-panel/tab.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,9 @@ export const DetailsPanelTab = ({ href, isActive, text }: TabProps) => {
const wrapperClassName =
'flex h-10 shrink-0 items-center justify-center rounded-lg border border-white/10 px-4 py-2 sm:h-12 md:h-8';

const contentClassName = cn(
`rounded-lg border border-transparent font-lato text-sm`,
{
'border-0': isActive, // Prevent active border layout shift
},
);
const contentClassName = cn(`rounded-lg border border-transparent text-sm`, {
'border-0': isActive, // Prevent active border layout shift
});

return (
<Button
Expand Down
2 changes: 1 addition & 1 deletion src/shared/components/heading.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ interface Props {
}

const DEFAULT_TAG = 'h2';
const BASE_CLASS_NAME = 'font-lato text-xl font-bold';
const BASE_CLASS_NAME = 'text-xl font-bold';

export const Heading = (props: Props) => {
const { text, className, htmlTag = DEFAULT_TAG } = props;
Expand Down
2 changes: 1 addition & 1 deletion src/shared/components/logo-title.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ interface Props {
}

const CONTAINER_CLASSNAME = 'flex items-center gap-3';
const NAME_CLASSNAME = 'font-lato font-bold';
const NAME_CLASSNAME = 'font-bold';

export const LogoTitle = (props: Props) => {
const { src, name, children } = props;
Expand Down
2 changes: 1 addition & 1 deletion src/shared/components/text.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ interface Props {

export const Text = (props: Props) => {
const { text, className, htmlTag = 'span' } = props;
const textClassName = cn('font-roboto text-sm text-white/70', className);
const textClassName = cn('text-sm text-white/70', className);

return createElement(htmlTag, { className: textClassName }, text);
};
10 changes: 5 additions & 5 deletions src/shared/core/fonts.ts
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
import { Lato, Roboto } from 'next/font/google';
import { Inter_Tight, Space_Grotesk } from 'next/font/google';

export const roboto = Roboto({
export const interTight = Inter_Tight({
weight: ['400', '700'],
subsets: ['latin'],
variable: '--font-roboto',
variable: '--font-inter-tight',
});

export const lato = Lato({
export const grotesk = Space_Grotesk({
weight: ['400', '700'],
subsets: ['latin'],
variable: '--font-lato',
variable: '--font-space-grotesk',
});
4 changes: 2 additions & 2 deletions tailwind.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -51,8 +51,8 @@ const config: Config = {
skill12: '#EC88E1',
},
fontFamily: {
roboto: ['var(--font-roboto)'],
lato: ['var(--font-lato)'],
['inter-tight']: ['var(--font-inter-tight)'],
grotesk: ['var(--font-space-grotesk)'],
},
keyframes: {
spin: {
Expand Down
Loading