theoludwig/.profile
1
1
Fork 0
mirror of https://github.com/theoludwig/theoludwig.git synced 2025-05-29 22:37:44 +02:00
Code Issues Releases Activity

chore: usage of eslint-plugin-tailwindcss

Browse Source
This commit is contained in:
Théo LUDWIG
2024-01-28 03:21:11 +01:00
parent b8ceefb2f6
commit f5020cad19
30 changed files with 320 additions and 352 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/Footer/FooterText.tsx
View File

@ -9,7 +9,7 @@ export const FooterText = (): JSX.Element => {
<p>
<Link
href="/"
className="text-yellow hover:underline dark:text-yellow-dark font-semibold"
className="font-semibold text-yellow hover:underline dark:text-yellow-dark"
>
Théo LUDWIG
</Link>{" "}

2
components/Footer/FooterVersion.tsx
View File

@ -16,7 +16,7 @@ export const FooterVersion = (props: FooterVersionProps): JSX.Element => {
Version{" "}
<a
data-cy="version-link"
className="text-yellow hover:underline dark:text-yellow-dark font-semibold"
className="font-semibold text-yellow hover:underline dark:text-yellow-dark"
href={versionLink}
target="_blank"
rel="noopener noreferrer"

2
components/Header/Locales/index.tsx
View File

@ -82,7 +82,7 @@ export const Locales = (props: LocalesProps): JSX.Element => {
return (
<li
key={locale}
className="flex h-12 w-full items-center justify-center hover:bg-[#4f545c] hover:bg-opacity-20"
className="flex h-12 w-full items-center justify-center hover:bg-[#4f545c]/20"
onClick={async () => {
return await handleLocale(locale)
}}

12
components/Header/SwitchTheme.tsx
View File

@ -30,35 +30,35 @@ export const SwitchTheme = (props: SwitchThemeProps): JSX.Element => {
<div
data-cy="switch-theme-dark"
className={classNames(
"absolute bottom-0 left-[8px] top-0 mb-auto mt-auto h-[10px] w-[14px] leading-[0] transition-opacity duration-[250ms] ease-in-out",
"absolute inset-y-0 left-[8px] my-auto h-[10px] w-[14px] leading-[0] transition-opacity duration-[250ms] ease-in-out",
{
"opacity-100": theme === "dark",
"opacity-0": theme === "light",
},
)}
>
<span className="relative flex h-[10px] w-[10px] items-center justify-center">
<span className="relative flex size-[10px] items-center justify-center">
🌜
</span>
</div>
<div
data-cy="switch-theme-light"
className={classNames(
"absolute bottom-0 right-[10px] top-0 mb-auto mt-auto h-[10px] w-[10px] leading-[0]",
"absolute inset-y-0 right-[10px] my-auto size-[10px] leading-[0]",
{
"opacity-100": theme === "light",
"opacity-0": theme === "dark",
},
)}
>
<span className="relative flex h-[10px] w-[10px] items-center justify-center">
<span className="relative flex size-[10px] items-center justify-center">
🌞
</span>
</div>
</div>
<div
className={classNames(
"absolute top-[1px] box-border h-[22px] w-[22px] rounded-[50%] bg-[#fafafa] text-white transition-all duration-[250ms] ease-in-out",
"absolute top-[1px] box-border size-[22px] rounded-[50%] bg-[#fafafa] text-white transition-all duration-[250ms] ease-in-out",
{
"left-[27px]": theme === "dark",
"left-0": theme === "light",
@ -70,7 +70,7 @@ export const SwitchTheme = (props: SwitchThemeProps): JSX.Element => {
data-cy="switch-theme-input"
type="checkbox"
aria-label="Dark mode toggle"
className="absolute m-[-1px] h-[1px] w-[1px] overflow-hidden border-0 p-0 hidden"
className="absolute m-[-1px] hidden size-[1px] overflow-hidden border-0 p-0"
defaultChecked
/>
</div>

2
components/Header/index.tsx
View File

@ -18,7 +18,7 @@ export const Header = (): JSX.Element => {
<div className="flex items-center justify-center">
<Image
quality={100}
className="w-16 h-16"
className="size-16"
src={Logo}
alt="Théo LUDWIG"
priority

4
components/Interests/InterestsList/InterestItem.tsx
View File

@ -10,9 +10,9 @@ export const InterestItem = (props: InterestItemProps): JSX.Element => {
const { fontAwesomeIcon, title } = props
return (
<li className="interest-item mx-2 my-2 h-8 w-8" title={title}>
<li className="m-2 size-8" title={title}>
<FontAwesomeIcon
className="block h-full w-full text-yellow dark:text-yellow-dark"
className="block size-full text-yellow dark:text-yellow-dark"
icon={fontAwesomeIcon}
/>
</li>

2
components/OpenSource/Repository.tsx
View File

@ -15,7 +15,7 @@ export const Repository = (props: RepositoryProps): JSX.Element => {
<a href={href} target="_blank" rel="noopener noreferrer">
<div className="flex">
<GitHubIcon className="mr-2 h-6" />
<span className="text-yellow dark:text-yellow-dark font-semibold">
<span className="font-semibold text-yellow dark:text-yellow-dark">
{name}
</span>
</div>

4
components/Portfolio/PortfolioItem.tsx
View File

@ -24,7 +24,7 @@ export const PortfolioItem = (props: PortfolioItemProps): JSX.Element => {
<div className="flex justify-center">
<Image
quality={100}
className="h-auto w-auto transition-opacity duration-500 group-hover:opacity-20 dark:group-hover:opacity-5"
className="size-auto transition-opacity duration-500 group-hover:opacity-20 dark:group-hover:opacity-5"
width={300}
height={300}
src={image}
@ -35,7 +35,7 @@ export const PortfolioItem = (props: PortfolioItemProps): JSX.Element => {
<h3 className="my-6 text-2xl font-semibold text-yellow dark:text-yellow-dark">
{title}
</h3>
<p className="my-6 mx-4 font-semibold">{description}</p>
<p className="mx-4 my-6 font-semibold">{description}</p>
</div>
</a>
</ShadowContainer>

4
components/Profile/ProfileDescriptionBottom.tsx
View File

@ -6,13 +6,13 @@ export const ProfileDescriptionBottom = (): JSX.Element => {
const i18n = getI18n()
return (
<div className="my-6 text-gray dark:text-gray-dark text-center max-w-md text-base">
<div className="my-6 max-w-md text-center text-base text-gray dark:text-gray-dark">
<p>{htmlParser(i18n.translate("home.about.description-bottom"))}</p>
<br />
<a
href="/curriculum-vitae/index.html"
className="text-yellow hover:underline dark:text-yellow-dark font-semibold"
className="font-semibold text-yellow hover:underline dark:text-yellow-dark"
>
Curriculum vitæ ({i18n.translate("common.fr-FR")})
</a>

2
components/Profile/SocialMediaList/SocialMediaIcons/Icon.tsx
View File

@ -8,7 +8,7 @@ export const Icon = (props: React.SVGProps<SVGSVGElement>): JSX.Element => {
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
className={classNames(
"h-8 w-8 fill-current text-black dark:text-white",
"size-8 fill-current text-black dark:text-white",
className,
)}
{...rest}

2
components/Profile/SocialMediaList/index.tsx
View File

@ -9,7 +9,7 @@ import { NPMIcon } from "./SocialMediaIcons/NPMIcon"
export const SocialMediaList = (): JSX.Element => {
return (
<ul className="social-media-list m-0 mt-2 list-none py-4 text-center">
<ul className="m-0 mt-2 list-none py-4 text-center">
<SocialMediaItem link="https://github.com/theoludwig" ariaLabel="GitHub">
<GitHubIcon />
</SocialMediaItem>

2
components/Skills/Skill.tsx
View File

@ -35,7 +35,7 @@ export const SkillComponent = (props: SkillComponentProps): JSX.Element => {
>
<div className="text-center">
<Image
className="inline h-16 w-16"
className="inline size-16"
quality={100}
width={64}
height={64}

2
components/Skills/SkillsSection.tsx
View File

@ -13,7 +13,7 @@ export const SkillsSection = (props: SkillsSectionProps): JSX.Element => {
<div className="mx-auto w-full px-4">
<div className="flex flex-wrap px-4 py-6">
<div className="flex-1">
<div className="mb-8 border-b border-gray-600 dark:border-white dark:border-opacity-10">
<div className="mb-8 border-b border-gray-600 dark:border-white/10">
<h3 className="my-3 text-xl font-semibold text-yellow dark:text-yellow-dark">
{title}
</h3>

2
components/design/Loader.tsx
View File

@ -16,7 +16,7 @@ export const Loader = (props: LoaderProps): JSX.Element => {
height,
}}
className={classNames(
"animate-spin inline-block border-[3px] border-current border-t-transparent text-yellow dark:text-yellow-dark rounded-full",
"inline-block animate-spin rounded-full border-[3px] border-current border-t-transparent text-yellow dark:text-yellow-dark",
className,
)}
role="status"