Skip to content

Commit

Permalink
chore: update Prettier configuration and add Tailwind CSS plugin; ref…
Browse files Browse the repository at this point in the history
…actor CSS classes for consistency

- Updated .prettierrc to include Tailwind CSS plugin and functions.
- Added prettier-plugin-tailwindcss to package.json and pnpm-lock.yaml.
- Refactored CSS classes in main.css and various TSX files for improved consistency and readability.
- Adjusted spacing in several components to enhance layout and maintain uniformity.
  • Loading branch information
AmruthPillai committed Jan 12, 2025
1 parent 007243f commit 26e34b6
Show file tree
Hide file tree
Showing 20 changed files with 87 additions and 22 deletions.
4 changes: 3 additions & 1 deletion .prettierrc
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
{
"printWidth": 100,
"endOfLine": "auto"
"endOfLine": "auto",
"plugins": ["prettier-plugin-tailwindcss"],
"tailwindFunctions": ["cn", "cva"]
}
2 changes: 1 addition & 1 deletion apps/artboard/src/styles/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -21,5 +21,5 @@
}

.wysiwyg {
@apply prose max-w-none prose-foreground prose-headings:mt-0 prose-headings:mb-2 prose-p:mt-0 prose-p:mb-2 prose-ul:mt-0 prose-ul:mb-2 prose-li:mt-0 prose-li:mb-2 prose-ol:mt-0 prose-ol:mb-2 prose-img:mt-0 prose-img:mb-2 prose-hr:mt-0 prose-hr:mb-2 prose-p:leading-normal prose-li:leading-normal prose-a:break-all;
@apply prose-foreground prose max-w-none prose-headings:mb-2 prose-headings:mt-0 prose-p:mb-2 prose-p:mt-0 prose-p:leading-normal prose-a:break-all prose-ol:mb-2 prose-ol:mt-0 prose-ul:mb-2 prose-ul:mt-0 prose-li:mb-2 prose-li:mt-0 prose-li:leading-normal prose-img:mb-2 prose-img:mt-0 prose-hr:mb-2 prose-hr:mt-0;
}
2 changes: 1 addition & 1 deletion apps/client/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@
<!-- Styles -->
<link rel="stylesheet" href="/src/styles/main.css" />
</head>
<body class="text-sm antialiased bg-background text-foreground print:bg-white print:m-0">
<body class="bg-background text-sm text-foreground antialiased print:m-0 print:bg-white">
<div id="root"></div>

<!-- Scripts -->
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ export const BasicsSection = () => {
<header className="flex items-center justify-between">
<div className="flex items-center gap-x-4">
{getSectionIcon("basics")}
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Basics`}</h2>
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Basics`}</h2>
</div>
</header>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ export const SectionBase = <T extends SectionItem>({ id, title, description }: P
<div className="flex items-center gap-x-4">
{getSectionIcon(id)}

<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{section.name}</h2>
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{section.name}</h2>
</div>

<div className="flex items-center gap-x-2">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -149,7 +149,7 @@ export const SectionDialog = <T extends SectionItem>({
<Form {...form}>
<ScrollArea>
<form
className=" max-h-[60vh] space-y-6 lg:max-h-fit"
className="max-h-[60vh] space-y-6 lg:max-h-fit"
onSubmit={form.handleSubmit(onSubmit)}
>
<DialogHeader>
Expand All @@ -165,7 +165,7 @@ export const SectionDialog = <T extends SectionItem>({
</h2>
</div>
</DialogTitle>

<VisuallyHidden>
<DialogDescription />
</VisuallyHidden>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@ export const SectionOptions = ({ id }: Props) => {
<List weight="bold" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="mr-4 w-48 ">
<DropdownMenuContent className="mr-4 w-48">
{hasItems && (
<>
<DropdownMenuItem onClick={onCreate}>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -114,7 +114,7 @@ export const InformationSection = () => {
<header className="flex items-center justify-between">
<div className="flex items-center gap-x-4">
{getSectionIcon("information")}
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Information`}</h2>
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Information`}</h2>
</div>
</header>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -204,7 +204,7 @@ export const LayoutSection = () => {
<header className="flex items-center justify-between">
<div className="flex items-center gap-x-4">
{getSectionIcon("layout")}
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Layout`}</h2>
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Layout`}</h2>
</div>

<Tooltip content={t`Reset Layout`}>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export const NotesSection = () => {
<header className="flex items-center justify-between">
<div className="flex items-center gap-x-4">
{getSectionIcon("notes")}
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Notes`}</h2>
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Notes`}</h2>
</div>
</header>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ export const PageSection = () => {
<header className="flex items-center justify-between">
<div className="flex items-center gap-x-4">
{getSectionIcon("page")}
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Page`}</h2>
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Page`}</h2>
</div>
</header>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ export const SharingSection = () => {
<header className="flex items-center justify-between">
<div className="flex items-center gap-x-4">
{getSectionIcon("sharing")}
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Sharing`}</h2>
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Sharing`}</h2>
</div>
</header>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ export const StatisticsSection = () => {
<header className="flex items-center justify-between">
<div className="flex items-center gap-x-4">
{getSectionIcon("statistics")}
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Statistics`}</h2>
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Statistics`}</h2>
</div>
</header>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ export const TemplateSection = () => {
<header className="flex items-center justify-between">
<div className="flex items-center gap-x-4">
{getSectionIcon("template")}
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Template`}</h2>
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Template`}</h2>
</div>
</header>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ export const ThemeSection = () => {
<header className="flex items-center justify-between">
<div className="flex items-center gap-x-4">
{getSectionIcon("theme")}
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Theme`}</h2>
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Theme`}</h2>
</div>
</header>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -62,11 +62,11 @@ export const TypographySection = () => {
<header className="flex items-center justify-between">
<div className="flex items-center gap-x-4">
{getSectionIcon("typography")}
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Typography`}</h2>
<h2 className="line-clamp-1 text-2xl font-bold lg:text-3xl">{t`Typography`}</h2>
</div>
</header>

<main className="grid gap-y-8">
<main className="grid gap-y-6">
<div className="grid grid-cols-2 gap-4">
{fontSuggestions.map((font) => (
<Button
Expand Down Expand Up @@ -167,7 +167,7 @@ export const TypographySection = () => {
<div className="space-y-1.5">
<Label>{t`Options`}</Label>

<div className="flex items-center gap-x-4 py-2">
<div className="flex items-center gap-x-4 py-1">
<Switch
id="metadata.typography.hideIcons"
checked={typography.hideIcons}
Expand All @@ -178,7 +178,7 @@ export const TypographySection = () => {
<Label htmlFor="metadata.typography.hideIcons">{t`Hide Icons`}</Label>
</div>

<div className="flex items-center gap-x-4 py-2">
<div className="flex items-center gap-x-4 py-1">
<Switch
id="metadata.typography.underlineLinks"
checked={typography.underlineLinks}
Expand Down
2 changes: 1 addition & 1 deletion apps/client/src/pages/home/sections/support/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ export const SupportSection = () => (
</a>
<a href="https://paypal.me/amruthde" rel="noreferrer noopener nofollow" target="_blank">
{/* eslint-disable-next-line lingui/no-unlocalized-strings */}
<img src="/support-logos/paypal.svg" className=" max-h-[28px]" alt="PayPal" />
<img src="/support-logos/paypal.svg" className="max-h-[28px]" alt="PayPal" />
</a>
</div>

Expand Down
2 changes: 1 addition & 1 deletion apps/client/src/pages/home/sections/templates/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ export const TemplatesSection = () => (
alt={template}
loading="lazy"
src={`/templates/jpg/${template}.jpg`}
className=" aspect-[1/1.4142] h-[400px] rounded object-cover lg:h-[600px]"
className="aspect-[1/1.4142] h-[400px] rounded object-cover lg:h-[600px]"
/>
</motion.a>
))}
Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -108,6 +108,7 @@
"postcss-import": "^16.1.0",
"postcss-nested": "^6.2.0",
"prettier": "^3.3.3",
"prettier-plugin-tailwindcss": "^0.6.9",
"tailwindcss": "^3.4.10",
"tailwindcss-animate": "^1.0.7",
"ts-jest": "^29.2.5",
Expand Down
62 changes: 62 additions & 0 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit 26e34b6

Please sign in to comment.