fix: 🚨 fix lint errors

osmosis-labs · May 31, 2024 · 66200c7 · 66200c7
1 parent 741f7c4
commit 66200c7
Show file tree

Hide file tree

Showing 62 changed files with 164 additions and 164 deletions.
diff --git a/packages/web/components/assets/categories.tsx b/packages/web/components/assets/categories.tsx
@@ -176,7 +176,7 @@ export const AssetCategoriesSelectors: FunctionComponent<{
               key={category}
               aria-label={category.replace("_", " ").replace("-", " ")}
               className={classNames(
-                "group flex max-w-full shrink-0 items-center gap-3 rounded-full border py-4 px-6 text-osmoverse-200 transition-all duration-150 md:gap-2",
+                "group flex max-w-full shrink-0 items-center gap-3 rounded-full border px-6 py-4 text-osmoverse-200 transition-all duration-150 md:gap-2",
                 "hover:border-osmoverse-200 hover:text-white-high",
                 "focus:border-wosmongton-400 focus:text-osmoverse-200",
                 "active:opacity-50",

diff --git a/packages/web/components/assets/highlights-categories.tsx b/packages/web/components/assets/highlights-categories.tsx
@@ -166,7 +166,7 @@ export const AssetHighlights: FunctionComponent<
         className
       )}
     >
-      <div className="flex place-content-between pt-1 pb-3">
+      <div className="flex place-content-between pb-3 pt-1">
         <h6>
           {title}{" "}
           {subtitle && (

diff --git a/packages/web/components/buttons/link-button.tsx b/packages/web/components/buttons/link-button.tsx
@@ -26,7 +26,7 @@ export default function LinkButton({
         className={`flex flex-row gap-2 ${optionalClassNames ?? ""}`}
       >
         {icon}
-        <p className="text-base font-subtitle1 leading-6 tracking-wide text-osmoverse-200">
+        <p className="font-subtitle1 text-base leading-6 tracking-wide text-osmoverse-200">
           {label}
         </p>
       </Link>

diff --git a/packages/web/components/cards/app-card.tsx b/packages/web/components/cards/app-card.tsx
@@ -61,7 +61,7 @@ export const AppCard: FunctionComponent<{
           <div className="flex flex-wrap items-center gap-3">
             <h1
               className={classNames(
-                "text-h6 font-h6 font-semibold",
+                "font-h6 text-h6 font-semibold",
                 title.split(" ").length === 1 &&
                   title.length >= 10 &&
                   "xs:text-body1"

diff --git a/packages/web/components/cards/bond-card.tsx b/packages/web/components/cards/bond-card.tsx
@@ -100,7 +100,7 @@ export const BondCard: FunctionComponent<
 
         {userUnlockingShares && (
           <div className="flex w-fit flex-wrap items-center gap-1 rounded-lg bg-osmoverse-900 p-3 md:p-1.5">
-            <span className="text-subtitle1 font-subtitle1">
+            <span className="font-subtitle1 text-subtitle1">
               ~
               {t("pool.sharesAmount", {
                 shares: userUnlockingShares.shares
@@ -110,7 +110,7 @@ export const BondCard: FunctionComponent<
                   .toString(),
               })}
             </span>
-            <span className="flex items-center gap-1 text-subtitle1 font-subtitle1 text-osmoverse-400">
+            <span className="flex items-center gap-1 font-subtitle1 text-subtitle1 text-osmoverse-400">
               {userUnlockingShares.endTime ? (
                 <>
                   {t("pool.sharesAvailableIn")}
@@ -421,7 +421,7 @@ const UnbondButton: FunctionComponent<
           15, // gap
       }}
     >
-      <div className="flex transform items-center gap-[10px] self-start px-[12px] py-1.5 text-base font-button text-wosmongton-200 duration-300 ease-inOutBack group-hover:-translate-x-[30px] group-hover:text-rust-300">
+      <div className="flex transform items-center gap-[10px] self-start px-[12px] py-1.5 font-button text-base text-wosmongton-200 duration-300 ease-inOutBack group-hover:-translate-x-[30px] group-hover:text-rust-300">
         <span
           ref={leftContentRef}
           className="flex flex-shrink-0 items-center gap-[10px]"

diff --git a/packages/web/components/cards/hero-card.tsx b/packages/web/components/cards/hero-card.tsx
@@ -67,7 +67,7 @@ export const HeroCard: React.FunctionComponent<{
         <div className="gradient absolute left-0 top-0 z-20 h-full w-full bg-gradient-hero-card"></div>
         <div className="content text-white relative z-30 m-9 max-w-[45%] sm:max-w-full">
           <div className="mb-2 flex flex-wrap items-center gap-x-6 gap-y-3">
-            <h4 className=" text-h4 font-h4">{title}</h4>
+            <h4 className=" font-h4 text-h4">{title}</h4>
             <div className="flex items-center gap-2">
               {!!twitterUrl && (
                 <IconLink url={twitterUrl} ariaLabel="Twitter">

diff --git a/packages/web/components/cards/stake-info-card.tsx b/packages/web/components/cards/stake-info-card.tsx
@@ -120,7 +120,7 @@ export const StakeInfoCard: FunctionComponent<{
             />
           </div>
           <div className="flex flex-shrink flex-col">
-            <h6 className="flex flex-shrink items-center md:text-h6 md:font-h6">
+            <h6 className="flex flex-shrink items-center md:font-h6 md:text-h6">
               OSMO
             </h6>
             <span className="caption w-fit text-osmoverse-400">Osmosis</span>
@@ -130,7 +130,7 @@ export const StakeInfoCard: FunctionComponent<{
               type="number"
               className={classNames(
                 "placeholder:text-white w-full bg-transparent text-right text-white-full focus:outline-none md:text-subtitle1",
-                "text-h5 font-h5 md:font-subtitle1",
+                "font-h5 text-h5 md:font-subtitle1",
                 "overflow-hidden"
               )}
               placeholder="0"
@@ -139,7 +139,7 @@ export const StakeInfoCard: FunctionComponent<{
             />
             <h5
               className={classNames(
-                "w-full truncate text-right text-osmoverse-300 transition-opacity md:text-h6 md:font-h6",
+                "w-full truncate text-right text-osmoverse-300 transition-opacity md:font-h6 md:text-h6",
                 outAmountValue ? "opacity-100" : "opacity-50"
               )}
             >

diff --git a/packages/web/components/cl-deposit-input-group/index.tsx b/packages/web/components/cl-deposit-input-group/index.tsx
@@ -134,7 +134,7 @@ export const DepositAmountGroup: FunctionComponent<{
               )}
             >
               <InputBox
-                className="bg-transparent text-h5 font-h5"
+                className="bg-transparent font-h5 text-h5"
                 style="no-border"
                 inputClassName="!leading-4"
                 type="number"

diff --git a/packages/web/components/complex/add-conc-liquidity.tsx b/packages/web/components/complex/add-conc-liquidity.tsx
@@ -294,7 +294,7 @@ const StrategySelector: FunctionComponent<{
           }
         )}
       >
-        <div className="flex items-center justify-center gap-2 text-h6 font-h6">
+        <div className="flex items-center justify-center gap-2 font-h6 text-h6">
           {title}
           {isNew && (
             <Pill>
@@ -552,7 +552,7 @@ const AddConcLiqView: FunctionComponent<
                   "opacity-30": sfStakingDisabled,
                 })}
               >
-                <h6 className="md:text-subtitle1 md:font-subtitle1">
+                <h6 className="md:font-subtitle1 md:text-subtitle1">
                   {t("lockToken.superfluidStake")}{" "}
                   {superfluidPoolDetail.superfluidApr.toDec().isPositive()
                     ? `(+${superfluidPoolDetail.superfluidApr.maxDecimals(

diff --git a/packages/web/components/complex/add-liquidity.tsx b/packages/web/components/complex/add-liquidity.tsx
@@ -201,7 +201,7 @@ const AmountInput: FunctionComponent<{
         )}
         <div className="flex flex-col gap-2">
           {!isMobile && (
-            <div className="flex justify-end gap-2 text-caption font-caption">
+            <div className="flex justify-end gap-2 font-caption text-caption">
               <span className="my-auto">{t("addLiquidity.available")}</span>
               {assetBalance && (
                 <span
@@ -229,7 +229,7 @@ const AmountInput: FunctionComponent<{
                 placeholder=""
               />
               {!isMobile && (
-                <span className="pr-3 text-right text-xs font-caption leading-5 text-osmoverse-400">
+                <span className="pr-3 text-right font-caption text-xs leading-5 text-osmoverse-400">
                   {!inputAmountValue || inputAmountValue.toDec().isZero() ? (
                     <br />
                   ) : (

diff --git a/packages/web/components/complex/all-pools-table.tsx b/packages/web/components/complex/all-pools-table.tsx
@@ -624,7 +624,7 @@ const PoolCompositionCell: PoolCellComponent = ({
             size="sm"
             assetDenoms={reserveCoins.map((coin) => coin.denom)}
           />
-          <span className={classNames("text-sm font-caption opacity-60")}>
+          <span className={classNames("font-caption text-sm opacity-60")}>
             <p className={classNames("ml-auto flex items-center gap-1.5")}>
               {t("components.table.poolId", { id })}
               <div>

diff --git a/packages/web/components/complex/assets-page-v1.tsx b/packages/web/components/complex/assets-page-v1.tsx
@@ -175,8 +175,8 @@ const AssetsOverview: FunctionComponent = observer(() => {
 
 const Metric: FunctionComponent<Metric> = ({ label, value }) => (
   <div className="flex shrink-0 flex-col gap-1 md:gap-2">
-    <h6 className="md:text-subtitle1 md:font-subtitle1">{label}</h6>
-    <h2 className="text-h3 font-h3 text-wosmongton-100 md:text-h4 md:font-h4">
+    <h6 className="md:font-subtitle1 md:text-subtitle1">{label}</h6>
+    <h2 className="font-h3 text-h3 text-wosmongton-100 md:font-h4 md:text-h4">
       {value}
     </h2>
   </div>

diff --git a/packages/web/components/complex/pool/create/step1-set-ratios.tsx b/packages/web/components/complex/pool/create/step1-set-ratios.tsx
@@ -44,7 +44,7 @@ export const Step1SetRatios: FunctionComponent<StepProps> = observer(
                     }
                   }}
                 />
-                <div className="md:subtitle1 flex items-center gap-2.5 text-h6 font-h6 md:gap-1">
+                <div className="md:subtitle1 flex items-center gap-2.5 font-h6 text-h6 md:gap-1">
                   {config.poolType === "weighted" && (
                     <Button
                       size="sm"

diff --git a/packages/web/components/complex/remove-liquidity.tsx b/packages/web/components/complex/remove-liquidity.tsx
@@ -52,7 +52,7 @@ export const RemoveLiquidity: FunctionComponent<
             <h2 className="mt-12 md:mt-7">
               {removableValueWithPercentage.toString()}
             </h2>
-            <h5 className="text-osmoverse-100 md:text-h6 md:font-h6">
+            <h5 className="text-osmoverse-100 md:font-h6 md:text-h6">
               {t("removeLiquidity.sharesAmount", {
                 shares: removableSharesWithPercentage
                   .trim(true)

diff --git a/packages/web/components/complex/transfer.tsx b/packages/web/components/complex/transfer.tsx
@@ -483,7 +483,7 @@ export const Transfer = observer(
             {expectedOutput && (
               <div
                 className={
-                  "flex place-content-between items-center text-subtitle1 font-subtitle1 text-osmoverse-100"
+                  "flex place-content-between items-center font-subtitle1 text-subtitle1 text-osmoverse-100"
                 }
               >
                 <span className="inline">

diff --git a/packages/web/components/drawers/token-select-drawer.tsx b/packages/web/components/drawers/token-select-drawer.tsx
@@ -263,7 +263,7 @@ export const TokenSelectDrawer: FunctionComponent<{
                 icon={<Icon id="chevron-left" width={16} height={16} />}
               />
 
-              <h1 className="text-h6 font-h6">
+              <h1 className="font-h6 text-h6">
                 {t("components.selectToken.title")}
               </h1>
             </div>

diff --git a/packages/web/components/dropdown-with-label/dropdown-with-label.tsx b/packages/web/components/dropdown-with-label/dropdown-with-label.tsx
@@ -63,7 +63,7 @@ export const DropdownWithLabel = <T,>({
                 <Listbox.Option
                   className={({ active }) =>
                     classNames(
-                      "relative inline-flex cursor-default select-none items-center gap-3 py-2 px-4",
+                      "relative inline-flex cursor-default select-none items-center gap-3 px-4 py-2",
                       {
                         "bg-osmoverse-825": active,
                       }

diff --git a/packages/web/components/dropdown-with-multi-select/index.tsx b/packages/web/components/dropdown-with-multi-select/index.tsx
@@ -30,7 +30,7 @@ export const DropdownWithMultiSelect = <T,>({
             {stateValues.length === 0 ? (
               <span
                 className={classNames(
-                  "text-base font-subtitle1 font-normal leading-6",
+                  "font-subtitle1 text-base font-normal leading-6",
                   "text-osmoverse-400"
                 )}
               >

diff --git a/packages/web/components/earn/allocation/index.tsx b/packages/web/components/earn/allocation/index.tsx
@@ -101,7 +101,7 @@ export const EarnAllocation = () => {
         </div>
         <small
           className={classNames(
-            "absolute bottom-0 inline-flex w-full justify-center self-center text-overline font-subtitle2 font-medium tracking-normal text-osmoverse-300 transition-opacity duration-200 ease-in-out",
+            "absolute bottom-0 inline-flex w-full justify-center self-center font-subtitle2 text-overline font-medium tracking-normal text-osmoverse-300 transition-opacity duration-200 ease-in-out",
             { "opacity-0": y > 10 },
             { "opacity-50": y < 10 }
           )}

diff --git a/packages/web/components/earn/rewards/index.tsx b/packages/web/components/earn/rewards/index.tsx
@@ -137,7 +137,7 @@ export const EarnRewards = ({
         <h4 className="text-osmoverse-200">
           {formatPretty(totalUnclaimedRewards)}
         </h4>
-        <small className="max-w-[54px] text-right text-xs font-subtitle2 font-medium text-osmoverse-300">
+        <small className="max-w-[54px] text-right font-subtitle2 text-xs font-medium text-osmoverse-300">
           {t("earnPage.availableToClaim")}
         </small>
       </div>

diff --git a/packages/web/components/earn/table/cells.tsx b/packages/web/components/earn/table/cells.tsx
@@ -37,7 +37,7 @@ export const StrategyNameCell = (item: CellContext<EarnStrategy, string>) => {
         {item.getValue()}
       </p>
       <div className="flex items-center gap-2">
-        <small className="text-left text-sm font-subtitle1 capitalize text-osmoverse-400 1.5xs:text-xs">
+        <small className="text-left font-subtitle1 text-sm capitalize text-osmoverse-400 1.5xs:text-xs">
           {item.row.original.platform} · {item.row.original.type}
         </small>
         {/*  <div className="flex items-center justify-center rounded-xl bg-[#9D23E8] px-2">
@@ -164,7 +164,7 @@ export const LockCell = (item: CellContext<EarnStrategy, string>) => {
         {hasLockingDuration ? lockingDuration : "Instant"}
       </ColumnCellCell>
       {hasLockingDuration && (
-        <small className="text-sm font-subtitle2 text-osmoverse-400">
+        <small className="font-subtitle2 text-sm text-osmoverse-400">
           {t(lockingDuration <= 1 ? "earnPage.day" : "earnPage.days")}
         </small>
       )}
@@ -314,7 +314,7 @@ export const ActionsCell = (item: CellContext<EarnStrategy, unknown>) => {
               />
             ) : (
               <div className="inline-flex items-center gap-1">
-                <p className="text-sm font-subtitle1 font-medium text-osmoverse-300">
+                <p className="font-subtitle1 text-sm font-medium text-osmoverse-300">
                   {isBalanceVisible ? (
                     <span>{t("earnPage.manage")}</span>
                   ) : isGeoblocked ? (

diff --git a/packages/web/components/earn/table/columns.tsx b/packages/web/components/earn/table/columns.tsx
@@ -63,7 +63,7 @@ export const ColumnCellHeader = ({
     >
       <small
         className={classNames(
-          "whitespace-nowrap text-base font-subtitle2 font-semibold text-osmoverse-300",
+          "whitespace-nowrap font-subtitle2 text-base font-semibold text-osmoverse-300",
           className
         )}
       >

diff --git a/packages/web/components/funnels/balances-moved.tsx b/packages/web/components/funnels/balances-moved.tsx
@@ -33,7 +33,7 @@ export const BalancesMoved = forwardRef<HTMLAnchorElement, CustomClasses>(
       >
         <div className="relative 1.5lg:hidden">
           <Image
-            className="absolute left-0 -top-1/3"
+            className="absolute -top-1/3 left-0"
             alt="portfolio page screenshot"
             src="/images/new-portfolio-page.svg"
             width={526}

diff --git a/packages/web/components/main-menu.tsx b/packages/web/components/main-menu.tsx
@@ -146,7 +146,7 @@ const MorePopover: FunctionComponent<{
           <Popover.Button className="focus:outline-none">
             <MenuItemContent menu={item} selected={open} />
           </Popover.Button>
-          <Popover.Panel className="absolute bottom-full -left-1 flex w-full flex-col gap-2 rounded-3xl bg-osmoverse-800 py-2 px-2">
+          <Popover.Panel className="absolute -left-1 bottom-full flex w-full flex-col gap-2 rounded-3xl bg-osmoverse-800 px-2 py-2">
             {secondaryMenus.map((menu: MainLayoutMenu) => {
               const { link, selectionTest, secondaryLogo, showMore } = menu;
               return (
@@ -207,7 +207,7 @@ const MenuItemContent: React.FC<{
         {secondaryLogo && (
           <div
             className={classNames(
-              "absolute top-0 left-0 transition-all duration-100 ease-in-out",
+              "absolute left-0 top-0 transition-all duration-100 ease-in-out",
               showSubTitle ? "opacity-100" : "opacity-0"
             )}
           >

diff --git a/packages/web/components/navbar/index.tsx b/packages/web/components/navbar/index.tsx
@@ -229,7 +229,7 @@ export const NavBar: FunctionComponent<
                         }
                       />
                     </Popover.Button>
-                    <Popover.Panel className="absolute top-full mt-4 flex w-52 flex-col gap-2 rounded-3xl bg-osmoverse-800 py-3 px-2">
+                    <Popover.Panel className="absolute top-full mt-4 flex w-52 flex-col gap-2 rounded-3xl bg-osmoverse-800 px-2 py-3">
                       <MainMenu
                         menus={mobileMenus}
                         secondaryMenuItems={secondaryMenuItems}
@@ -246,7 +246,7 @@ export const NavBar: FunctionComponent<
             </Popover>
           </div>
           <div className="flex shrink-0 grow items-center gap-9 lg:gap-2 md:place-content-between md:gap-1">
-            <h4 className="md:text-h6 md:font-h6">
+            <h4 className="md:font-h6 md:text-h6">
               {navBarStore.title || title}
             </h4>
             <div className="flex items-center gap-3 lg:gap-1">

diff --git a/packages/web/components/one-click-trading/introducing-one-click-trading.tsx b/packages/web/components/one-click-trading/introducing-one-click-trading.tsx
@@ -24,17 +24,17 @@ export const IntroducingOneClick = ({
       <Pill className="!px-3 py-1 normal-case">
         {t("oneClickTrading.introduction.newFeature")}
       </Pill>
-      <h1 className="text-h5 font-h5">
+      <h1 className="font-h5 text-h5">
         {t("oneClickTrading.introduction.introducingTitle")}
       </h1>
-      <h2 className="px-8 text-body2 font-body2 text-osmoverse-200">
+      <h2 className="px-8 font-body2 text-body2 text-osmoverse-200">
         {t("oneClickTrading.introduction.introducingSubtitle")}{" "}
         <a
           className={buttonVariants({
             variant: "link",
             size: "sm",
             className:
-              "!inline w-auto !px-0 !text-body2 !font-body2 text-wosmongton-300",
+              "!inline w-auto !px-0 !font-body2 !text-body2 text-wosmongton-300",
           })}
           // TODO: Add link
         >

diff --git a/packages/web/components/one-click-trading/one-click-floating-banner.tsx b/packages/web/components/one-click-trading/one-click-floating-banner.tsx
@@ -106,16 +106,16 @@ const OneClickFloatingBannerContent = () => {
             >
               <h1
                 className={classNames(
-                  "flex-shrink-0 text-h6 font-h6",
-                  "sm:text-subtitle1 sm:font-subtitle1"
+                  "flex-shrink-0 font-h6 text-h6",
+                  "sm:font-subtitle1 sm:text-subtitle1"
                 )}
               >
                 {t("oneClickTrading.floatingBanner.title")}
               </h1>
               <ArrowButton
                 className={classNames(
-                  "text-subtitle1 font-subtitle1",
-                  "sm:text-left sm:text-caption sm:font-caption"
+                  "font-subtitle1 text-subtitle1",
+                  "sm:text-left sm:font-caption sm:text-caption"
                 )}
                 onClick={(e) => {
                   e.stopPropagation();

diff --git a/packages/web/components/one-click-trading/one-click-trading-connect-to-continue.tsx b/packages/web/components/one-click-trading/one-click-trading-connect-to-continue.tsx
@@ -15,10 +15,10 @@ const OneClickTradingConnectToContinue = () => {
         className="mb-6"
       />
 
-      <h1 className="mb-3 text-h5 font-h5">
+      <h1 className="mb-3 font-h5 text-h5">
         {t("oneClickTrading.connectToContinue.header")}
       </h1>
-      <p className="text-center text-body2 font-body2 text-osmoverse-200">
+      <p className="text-center font-body2 text-body2 text-osmoverse-200">
         {t("oneClickTrading.connectToContinue.description")}
       </p>
     </div>