From 0655d6c004a2c3e69e59387d9acdb8c27f1040a8 Mon Sep 17 00:00:00 2001
From: Dessalines <tyhou13@gmx.com>
Date: Sat, 14 Oct 2023 17:15:45 -0400
Subject: [PATCH] Fixing class -> className

---
 src/shared/components/apps.tsx      |  7 +++++--
 src/shared/components/common.tsx    | 12 ++++++------
 src/shared/components/donate.tsx    | 12 ++++++------
 src/shared/components/icon.tsx      |  2 +-
 src/shared/components/instances.tsx |  6 +++---
 src/shared/components/news.tsx      |  2 +-
 src/shared/components/no-match.tsx  |  4 ++--
 7 files changed, 24 insertions(+), 21 deletions(-)

diff --git a/src/shared/components/apps.tsx b/src/shared/components/apps.tsx
index 2813887..3ddb34c 100644
--- a/src/shared/components/apps.tsx
+++ b/src/shared/components/apps.tsx
@@ -46,9 +46,12 @@ interface AppDetailsButtonsProps {
 }
 
 const AppDetailsButtons = ({ links }: AppDetailsButtonsProps) => (
-  <div class="flex flex-row justify-between gap-2">
+  <div className="flex flex-row justify-between gap-2">
     {links.map(l => (
-      <a class="btn btn-sm btn-primary text-white normal-case" href={l.link}>
+      <a
+        className="btn btn-sm btn-primary text-white normal-case"
+        href={l.link}
+      >
         <Icon icon={l.icon} />
       </a>
     ))}
diff --git a/src/shared/components/common.tsx b/src/shared/components/common.tsx
index 0b7c64f..791ea5f 100644
--- a/src/shared/components/common.tsx
+++ b/src/shared/components/common.tsx
@@ -50,9 +50,9 @@ export const DonateDesc = () => (
 );
 
 export const DonateButtons = () => (
-  <div class="flex flex-row flex-wrap justify-between gap-2">
+  <div className="flex flex-row flex-wrap justify-between gap-2">
     <a
-      class="btn btn-primary text-white sm:max-md:btn-block normal-case"
+      className="btn btn-primary text-white sm:max-md:btn-block normal-case"
       href="https://liberapay.com/Lemmy"
     >
       <T i18nKey="support_on_liberapay">
@@ -60,7 +60,7 @@ export const DonateButtons = () => (
       </T>
     </a>
     <a
-      class="btn btn-secondary text-white sm:max-md:btn-block normal-case"
+      className="btn btn-secondary text-white sm:max-md:btn-block normal-case"
       href="https://www.patreon.com/dessalines"
     >
       <T i18nKey="support_on_patreon">
@@ -68,7 +68,7 @@ export const DonateButtons = () => (
       </T>
     </a>
     <a
-      class="btn btn-primary text-white sm:max-md:btn-block normal-case"
+      className="btn btn-primary text-white sm:max-md:btn-block normal-case"
       href="https://opencollective.com/lemmy"
     >
       <T i18nKey="support_on_opencollective">
@@ -76,7 +76,7 @@ export const DonateButtons = () => (
       </T>
     </a>
     <Link
-      class="btn btn-secondary text-white sm:max-md:btn-block normal-case"
+      className="btn btn-secondary text-white sm:max-md:btn-block normal-case"
       to="/crypto"
     >
       Crypto
@@ -130,7 +130,7 @@ export const DonateBlock = () => (
   <div className="flex flex-col items-center pt-16">
     <div className={`card card-bordered ${CARD_GRADIENT} shadow-xl`}>
       <div className="card-body px-8 md:px-32 py-16">
-        <p class={`card-title text-4xl mb-3 ${TEXT_GRADIENT}`}>
+        <p className={`card-title text-4xl mb-3 ${TEXT_GRADIENT}`}>
           {i18n.t("donate")}
         </p>
         <DonateDesc />
diff --git a/src/shared/components/donate.tsx b/src/shared/components/donate.tsx
index 5d61039..3937b2c 100644
--- a/src/shared/components/donate.tsx
+++ b/src/shared/components/donate.tsx
@@ -26,9 +26,9 @@ const SectionTitle = ({ title }) => (
 const ContributorsBlock = () => (
   <div className="my-16">
     <SectionTitle title={i18n.t("contributers")} />
-    <p class="text-sm text-gray-300 mb-3">{i18n.t("thanks_coders")}</p>
+    <p className="text-sm text-gray-300 mb-3">{i18n.t("thanks_coders")}</p>
     <CodersBlock />
-    <p class="text-sm text-gray-300 mt-6 mb-3">
+    <p className="text-sm text-gray-300 mt-6 mb-3">
       {i18n.t("thanks_translators")}
     </p>
     <TranslatorsBlock />
@@ -139,11 +139,11 @@ interface GoldSponsorCardsProps {
 const GoldSponsorCards = ({ title, sponsors, color }: GoldSponsorCardsProps) =>
   sponsors.length > 0 && (
     <div>
-      <p class="text-sm text-gray-300 mb-3">{title}</p>
-      <div class="flex flex-row flex-wrap gap-2 mb-2">
+      <p className="text-sm text-gray-300 mb-3">{title}</p>
+      <div className="flex flex-row flex-wrap gap-2 mb-2">
         {sponsors.map(s => (
           <a
-            class={`btn btn-${color} btn-outline w-32 h-16 normal-case`}
+            className={`btn btn-${color} btn-outline w-32 h-16 normal-case`}
             href={s.link}
           >
             <div className="flex flex-wrap flex-row justify-center">
@@ -173,7 +173,7 @@ const GeneralSponsorCard = () => {
 
   return (
     <div>
-      <p class="text-sm text-gray-300 mt-6 mb-3">
+      <p className="text-sm text-gray-300 mt-6 mb-3">
         {i18n.t("general_sponsors_desc")}
       </p>
       <div className="card card-bordered bg-neutral-900 shadow-xl">
diff --git a/src/shared/components/icon.tsx b/src/shared/components/icon.tsx
index 3e7017f..e614c76 100644
--- a/src/shared/components/icon.tsx
+++ b/src/shared/components/icon.tsx
@@ -12,7 +12,7 @@ interface IconProps {
 }
 
 export const Icon = ({ icon, size = IconSize.Medium, classes }: IconProps) => (
-  <svg class={`icon ${size} ${classes}`}>
+  <svg className={`icon ${size} ${classes}`}>
     <title>{icon}</title>
     <use xlinkHref={`#icon-${icon}`}></use>
   </svg>
diff --git a/src/shared/components/instances.tsx b/src/shared/components/instances.tsx
index 75890b8..1e5ac9a 100644
--- a/src/shared/components/instances.tsx
+++ b/src/shared/components/instances.tsx
@@ -141,15 +141,15 @@ const InstanceCard = ({ instance }: InstanceCardProps) => {
         </div>
         <div className={`text-2xl font-bold ${TEXT_GRADIENT}`}>{domain}</div>
         <p className="text-sm text-gray-300 mb-2">{description}</p>
-        <div class="flex flex-row flex-wrap justify-between gap-2">
+        <div className="flex flex-row flex-wrap justify-between gap-2">
           <a
-            class="btn btn-primary text-white sm:max-md:btn-block bg-gradient-to-r from-[#69D066] to-[#03A80E] normal-case"
+            className="btn btn-primary text-white sm:max-md:btn-block bg-gradient-to-r from-[#69D066] to-[#03A80E] normal-case"
             href={buildUrl(domain)}
           >
             {i18n.t("browse_instance")}
           </a>
           <button
-            class="btn btn-secondary btn-outline text-white sm:max-md:btn-block normal-case"
+            className="btn btn-secondary btn-outline text-white sm:max-md:btn-block normal-case"
             onClick={() =>
               (document.getElementById(modalId) as any).showModal()
             }
diff --git a/src/shared/components/news.tsx b/src/shared/components/news.tsx
index 8ba3c4c..ed5e434 100644
--- a/src/shared/components/news.tsx
+++ b/src/shared/components/news.tsx
@@ -54,7 +54,7 @@ interface NewsProps {
 const NewsCard = ({ news }: NewsProps) => (
   <div className="card card-bordered bg-neutral-900 shadow-xl mb-3">
     <div className="card-body">
-      <div class="grid md:grid-cols-12 grid-cols-1 gap-4">
+      <div className="grid md:grid-cols-12 grid-cols-1 gap-4">
         <div className="md:col-span-10">
           <div className="md:flex md:flex-row md:items-baseline md:space-x-3">
             <Link to={news.url} className={`text-2xl ${TEXT_GRADIENT}`}>
diff --git a/src/shared/components/no-match.tsx b/src/shared/components/no-match.tsx
index ac7d613..08af7e3 100644
--- a/src/shared/components/no-match.tsx
+++ b/src/shared/components/no-match.tsx
@@ -7,8 +7,8 @@ export class NoMatch extends Component<any, any> {
 
   render() {
     return (
-      <div class="container">
-        <h1>404</h1>
+      <div className="container mx-auto px-4">
+        <div className="pt-16 text-center text-4xl font-bold mb-8">404</div>
       </div>
     );
   }