Skip to content

Adicionar plugin para identificação de erros do tailwindcss #260

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.

Sign up for GitHub

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

Open
wants to merge 1 commit into
base: develop
Choose a base branch
from
Open

Adicionar plugin para identificação de erros do tailwindcss #260

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
1 change: 1 addition & 0 deletions .eslintrc.cjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ module.exports = {
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'plugin:react-hooks/recommended',
"plugin:tailwindcss/recommended"
],
ignorePatterns: ['dist', '.eslintrc.cjs'],
parser: '@typescript-eslint/parser',
Expand Down
16 changes: 16 additions & 0 deletions package-lock.json
View file
Open in desktop

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

9 changes: 6 additions & 3 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,8 @@
"dev": "vite",
"build": "tsc && vite build",
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"lint:debug": "eslint ./src --ext .ts,.tsx --debug",
"lint:fix": "eslint ./src --ext .ts,.tsx --fix",
"preview": "vite preview"
},
"dependencies": {
Expand All @@ -25,32 +27,33 @@
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.1",
"date-fns": "^3.6.0",
"eslint-plugin-tailwindcss": "^3.15.2",
"formik": "^2.4.6",
"lucide-react": "^0.378.0",
"qs": "^6.12.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-hook-form": "^7.51.4",
"react-input-mask": "^2.0.4",
"react-router-dom": "^6.23.0",
"react-select": "^5.8.0",
"react": "^18.2.0",
"tailwind-merge": "^2.3.0",
"tailwindcss-animate": "^1.0.7",
"yup": "^1.4.0"
},
"devDependencies": {
"@types/node": "^20.12.8",
"@types/qs": "^6.9.15",
"@types/react": "^18.2.66",
"@types/react-dom": "^18.2.22",
"@types/react-input-mask": "^3.0.5",
"@types/react": "^18.2.66",
"@typescript-eslint/eslint-plugin": "^7.2.0",
"@typescript-eslint/parser": "^7.2.0",
"@vitejs/plugin-react": "^4.2.1",
"autoprefixer": "^10.4.19",
"eslint": "^8.57.0",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.4.6",
"eslint": "^8.57.0",
"postcss": "^8.4.38",
"tailwindcss": "^3.4.3",
"typescript": "^5.2.2",
Expand Down
2 changes: 1 addition & 1 deletion src/components/Alert/Alert.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ const Alert = (props: IAlert) => {
const { description, startAdornment } = props;

return (
<Card className="p-3 flex gap-3 border-zinc-200 border-[1px] rounded-md select-none w-full items-center text-justify">
<Card className="flex w-full select-none items-center gap-3 rounded-md border border-zinc-200 p-3 text-justify">
<div>{startAdornment}</div>
<span className="text-sm text-zinc-600">{description}</span>
</Card>
Expand Down
22 changes: 11 additions & 11 deletions src/components/BurgerMenu/BurgerMenu.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,13 +35,13 @@ const BurgerMenu = () => {
return (
<Sheet>
<SheetTrigger>
<Menu color="white" className="ml-2 mr-2" />
<Menu color="white" className="mx-2" />
</SheetTrigger>
<SheetContent side="left" className="pt-[96px] flex flex-col">
<SheetContent side="left" className="flex flex-col pt-[96px]">
<div className="flex flex-col gap-4">
{session && (
<Fragment>
<div className="inline-flex items-center text-semibold">
<div className="text-semibold inline-flex items-center">
Olá, {session.name}
</div>
<Separator />
Expand All @@ -50,35 +50,35 @@ const BurgerMenu = () => {
<BurguerMenuItem
label="Sobre nós"
link="/sobre-nos"
icon={<Info className="w-5 h-5" />}
icon={<Info className="size-5" />}
/>
<BurguerMenuItem
label="Cadastrar abrigo"
link="https://forms.gle/2S7L2gR529Dc8P3T9"
icon={<CirclePlus className="w-5 h-5" />}
icon={<CirclePlus className="size-5" />}
openExternal={true}
/>
<BurguerMenuItem
label="Canal de Denúncias"
link="https://contatoseguro.com.br/sos_rs"
icon={<ShieldAlert className="w-5 h-5" />}
icon={<ShieldAlert className="size-5" />}
openExternal={true}
/>
<BurguerMenuItem
label="Como Ajudar"
link="https://www.instagram.com/reel/C613CfGuh4b"
icon={<CircleHelp className="w-5 h-5" />}
icon={<CircleHelp className="size-5" />}
openExternal={true}
/>
<BurguerMenuItem
label="Política de Privacidade"
link="/politica-de-privacidade"
icon={<Info className="w-5 h-5" />}
icon={<Info className="size-5" />}
/>
<BurguerMenuItem
label="Apoiadores"
link="/apoiadores"
icon={<HeartHandshake className="w-5 h-5" />}
icon={<HeartHandshake className="size-5" />}
/>
<Separator />
{partners.length > 0 && (
Expand All @@ -89,7 +89,7 @@ const BurgerMenu = () => {
key={idx}
label={partner.name}
link={partner.link}
icon={<LinkIcon className="w-4 h-4" />}
icon={<LinkIcon className="size-4" />}
/>
))}
</Fragment>
Expand All @@ -98,7 +98,7 @@ const BurgerMenu = () => {
{session && (
<div className="mt-auto">
<span
className="inline-flex items-center hover:font-semibold cursor-pointer"
className="inline-flex cursor-pointer items-center hover:font-semibold"
onClick={logout}
>
<DoorOpen className="mr-2" /> Sair
Expand Down
2 changes: 1 addition & 1 deletion src/components/BurgerMenu/components/BurguerMenuItem/BurguerMenuItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ const BurguerMenuItem = React.forwardRef<
>
{icon}
{label}
{openExternal && <ExternalLink className="w-3 h-3" />}
{openExternal && <ExternalLink className="size-3" />}
</a>
);
});
Expand Down
4 changes: 2 additions & 2 deletions src/components/CardAboutShelter/CardAboutShelter.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,8 @@ const CardAboutShelter = (props: ICardAboutShelter) => {
const formatAddress = checkAndFormatAddress(shelter, false);

return (
<Card className="flex flex-col gap-2 p-4 bg-[#E8F0F8] text-sm">
<div className="text-[#646870] font-medium">Sobre o abrigo</div>
<Card className="flex flex-col gap-2 bg-[#E8F0F8] p-4 text-sm">
<div className="font-medium text-[#646870]">Sobre o abrigo</div>
<div className="flex flex-col flex-wrap gap-3">
<InfoRow icon={<Home />} label={formatAddress} />
{Boolean(shelter.city) && (
Expand Down
4 changes: 2 additions & 2 deletions src/components/CardAboutShelter/components/InfoRow/InfoRow.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ const InfoRow = React.forwardRef<HTMLDivElement, IInfoRowProps>(
) : isLink ? (
<a
href={value}
className="text-blue-500 break-all cursor-pointer hover:underline"
className="cursor-pointer break-all text-blue-500 hover:underline"
>
{value}
</a>
Expand Down Expand Up @@ -47,7 +47,7 @@ const InfoRow = React.forwardRef<HTMLDivElement, IInfoRowProps>(
{ValueComp}
{clipboardButton && value && (
<div
className="text-blue-600 mx-2 hover:cursor-pointer active:text-blue-800"
className="mx-2 text-blue-600 hover:cursor-pointer active:text-blue-800"
onClick={() => navigator.clipboard.writeText(value)}
>
copiar
Expand Down
2 changes: 1 addition & 1 deletion src/components/Chip/Chip.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { cva } from 'class-variance-authority';
const Chip = React.forwardRef<HTMLDivElement, IChipProps>((props, ref) => {
const { label, className, variant = 'info', ...rest } = props;

const variants = cva('px-4 py-1.5 font-medium text-sm md:text-md rounded-2xl', {
const variants = cva('md:text-md rounded-2xl px-4 py-1.5 text-sm font-medium', {
variants: {
variant: {
warn: 'bg-light-yellow',
Expand Down
4 changes: 2 additions & 2 deletions src/components/DialogSelector/DialogSelector.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ const DialogSelector = (props: IDialogSelectorProps) => {
<label htmlFor="quantity" className="text-muted-foreground">
Quantidade
</label>
<div className="flex gap-2 items-center justify-center py-2">
<div className="flex items-center justify-center gap-2 py-2">
<Input
type="number"
name="quantity"
Expand All @@ -62,7 +62,7 @@ const DialogSelector = (props: IDialogSelectorProps) => {
/>
</div>
</div>
<div className="px-2 max-h-[50vh] overflow-y-auto">
<div className="max-h-[50vh] overflow-y-auto px-2">
<RadioGroup
value={selectedItem}
onValueChange={(v) => setSelectedItem(v)}
Expand Down
8 changes: 4 additions & 4 deletions src/components/Footer/Footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,17 +27,17 @@ const Footer = React.forwardRef<
aqui
</a>
</p>
<span className="text-white hidden md:block">•</span>
<span className="text-white flex flex-nowrap gap-2 items-center">
<span className="hidden text-white md:block">•</span>
<span className="flex flex-nowrap items-center gap-2 text-white">
Projeto Open Source disponível em{' '}
<a
className="underline hover:text-gray-300 flex"
className="flex underline hover:text-gray-300"
href="https://github.com/SOS-RS"
target="_blank"
>
Github
</a>
<Heart className="h-3 w-3 stroke-white fill-white" />
<Heart className="size-3 fill-white stroke-white" />
</span>
</div>
);
Expand Down
2 changes: 1 addition & 1 deletion src/components/Header/Header.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ const Header = React.forwardRef<HTMLDivElement, IHeader>((props, ref) => {
)}
{...rest}
>
<div className="flex gap-1 items-center">
<div className="flex items-center gap-1">
{startAdornment}
<Link className="font-medium text-white" to="/">
{title}
Expand Down
6 changes: 3 additions & 3 deletions src/components/LoadingScreen/LoadingScreen.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,11 @@ const LoadingScreen = (props: ILoadingScreen) => {
const { variant = 'full', className, ...rest } = props;

const variants = cva(
'bg-zinc-800 opacity-60 w-full flex items-center justify-center min-h-screen z-50',
'z-50 flex min-h-screen w-full items-center justify-center bg-zinc-800 opacity-60',
{
variants: {
variant: {
full: 'absolute top-0 right-0 bottom-0 left-0',
full: 'absolute inset-0',
content: 'w-full',
},
},
Expand All @@ -23,7 +23,7 @@ const LoadingScreen = (props: ILoadingScreen) => {

return (
<div {...rest} className={variants({ className, variant })}>
<Loader className="animate-spin h-15 w-15 stroke-white" />
<Loader className="h-15 w-15 animate-spin stroke-white" />
</div>
);
};
Expand Down
20 changes: 10 additions & 10 deletions src/components/LoadingSkeleton/LoadingSkeleton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,34 +5,34 @@ type LoadingSkeletonProps = {
const LoadingSkeleton = ({ amountItems }: LoadingSkeletonProps) => {
return (
<div className="w-full">
<ul className="grid grid-cols-1 gap-5 mt-4">
<ul className="mt-4 grid grid-cols-1 gap-5">
{Array.from({length: amountItems,}).map((_, index) => (
<li key={index} className="p-4 w-full border-2 border-border rounded-md space-y-3">
<div className="flex justify-between items-center space-x-2">
<div className="animate-pulse h-10 bg-[#ccc] rounded-md w-full max-w-sm" />
<div className="animate-pulse h-10 bg-[#ccc] rounded-md w-10" />
<li key={index} className="w-full space-y-3 rounded-md border-2 border-border p-4">
<div className="flex items-center justify-between space-x-2">
<div className="h-10 w-full max-w-sm animate-pulse rounded-md bg-[#ccc]" />
<div className="size-10 animate-pulse rounded-md bg-[#ccc]" />
</div>

<div className="animate-pulse h-10 bg-[#ccc] rounded-md w-full max-w-xs" />
<div className="h-10 w-full max-w-xs animate-pulse rounded-md bg-[#ccc]" />

<div className="border-b border-[#ccc] opacity-25"/>

<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 md:grid-cols-4 gap-4 mt-5">
<div className="mt-5 grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-4 lg:grid-cols-3">
{Array.from({length: 7}).map((_, index) => (
<div
key={index}
className="animate-pulse h-8 bg-[#ccc] rounded-full w-full"
className="h-8 w-full animate-pulse rounded-full bg-[#ccc]"
/>
))}
</div>

<div className="border-b border-[#ccc] opacity-25"/>

<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 md:grid-cols-4 gap-4 mt-5">
<div className="mt-5 grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-4 lg:grid-cols-3">
{Array.from({length: 7}).map((_, index) => (
<div
key={index}
className="animate-pulse h-8 bg-[#ccc] rounded-full w-full"
className="h-8 w-full animate-pulse rounded-full bg-[#ccc]"
/>
))}
</div>
Expand Down
6 changes: 3 additions & 3 deletions src/components/NoFoundSearch/NoFoundSearch.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,14 @@ import { SearchX } from 'lucide-react';

const NoFoundSearch = () => {
return (
<div className="flex flex-col justify-center items-center text-center p-8 gap-2">
<div className="flex flex-col items-center justify-center gap-2 p-8 text-center">
<SearchX size={64} className="text-[#677183]" />

<h1 className="text-[#2f2f2f] font-semibold text-[18px]">
<h1 className="text-[18px] font-semibold text-[#2f2f2f]">
A sua busca não encontrou nenhum resultado{' '}
</h1>

<h1 className="font-medium text-[#677183] text-[14px]">
<h1 className="text-[14px] font-medium text-[#677183]">
Verifique os termos buscados e tente novamente
</h1>
</div>
Expand Down
2 changes: 1 addition & 1 deletion src/components/SearchInput/SearchInput.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ const SearchInput = React.forwardRef<HTMLDivElement, ISearchInputProps>(
<Input
value={value}
placeholder={placeholder}
className="h-12 text-md font-medium text-zinc-600 pl-10 pr-4"
className="text-md h-12 pl-10 pr-4 font-medium text-zinc-600"
onChange={onChange}
/>
<div className="absolute inset-y-0 left-0 flex items-center pl-3">
Expand Down
2 changes: 1 addition & 1 deletion src/components/VerifiedBadge/VerifiedBadge.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import WithTooltip from '@/components/ui/with-tooltip.tsx';
const VerifiedBadge = () => {
return (
<WithTooltip content="Abrigo verificado">
<BadgeCheck className="h-5 w-5 stroke-white" fill="#1D61C8" />
<BadgeCheck className="size-5 stroke-white" fill="#1D61C8" />
</WithTooltip>
)
}
Expand Down
2 changes: 1 addition & 1 deletion src/components/ui/accordion.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ const AccordionTrigger = React.forwardRef<
{...props}
>
{children}
<ChevronDown className="h-4 w-4 shrink-0 transition-transform duration-200" />
<ChevronDown className="size-4 shrink-0 transition-transform duration-200" />
</AccordionPrimitive.Trigger>
</AccordionPrimitive.Header>
))
Expand Down
4 changes: 2 additions & 2 deletions src/components/ui/button.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ const buttonVariants = cva(
default: 'h-10 px-4 py-2',
sm: 'h-9 rounded-md px-3',
lg: 'h-11 rounded-md px-8',
icon: 'h-10 w-10',
icon: 'size-10',
},
},
defaultVariants: {
Expand Down Expand Up @@ -63,7 +63,7 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
disabled={loading || disabled}
{...props}
>
{loading ? <Loader className="w-4 h-4 animate-spin" /> : children}
{loading ? <Loader className="size-4 animate-spin" /> : children}
</Comp>
);
}
Expand Down
Loading