Merge pull request #406 from HoomanDgtl/main

akash-network · Nov 4, 2024 · bcbfca3 · bcbfca3
2 parents 77c7c57 + 7c282cc
commit bcbfca3
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 9 deletions.
diff --git a/src/components/pricing-page/gpus/availability-bar.tsx b/src/components/pricing-page/gpus/availability-bar.tsx
@@ -18,10 +18,10 @@ const AvailabilityBar: React.FC<AvailabilityBarProps> = ({
   return (
     <div className={clsx("my-5 flex flex-col gap-2", className)}>
       <div className="flex items-center justify-between">
-        <span className="text-lg font-bold text-foreground md:text-base">
+        <span className="text-lg font-bold text-foreground md:text-sm lg:text-base">
           {available} Available
         </span>
-        <span className="text-sm text-para md:text-base">(out of {total})</span>
+        <span className="text-sm text-para lg:text-base">({total} total)</span>
       </div>
       <div className="flex justify-between">
         {Array.from({ length: filledDots }).map((_, i) => (

diff --git a/src/components/pricing-page/gpus/gpu-table.tsx b/src/components/pricing-page/gpus/gpu-table.tsx
@@ -479,15 +479,15 @@ export const Tables = ({
                   >
                     <td className="w-[24%] rounded-l-lg border-y border-l text-base font-semibold xl:text-lg">
                       <div className="flex items-center gap-3">
-                        <div className="ml-6 rounded-md border p-[11px_5px]">
+                        <div className="ml-3 flex aspect-square w-10 items-center justify-center rounded-md border lg:ml-6">
                           <img
                             src="/logos/nvidia.png"
                             alt="nvidia"
                             className="h-4 w-6"
                           />
                         </div>
-                        <div className="">
-                          <p className="text-xl font-semibold capitalize text-foreground">
+                        <div className="flex-1">
+                          <p className="text-lg font-semibold capitalize text-foreground lg:text-xl">
                             {modifyModel(model?.model)}
                           </p>
                           <p className="text-sm font-medium text-[#71717A]">
@@ -496,15 +496,15 @@ export const Tables = ({
                         </div>
                       </div>
                     </td>
-                    <td className="w-[27.2%] border-y px-2 xl:px-8">
+                    <td className="w-[20%] border-y px-2 lg:w-[27.2%] xl:px-8">
                       <AvailabilityBar
                         available={model?.availability?.available}
                         total={model?.availability?.total}
                       />
                     </td>
                     <td className="w-[27.2%] border-y px-2 xl:px-8">
-                      <div className="flex justify-between border-b pb-1 text-lg">
-                        <span className="font-semibold">Average price:</span>
+                      <div className="flex justify-between border-b pb-1 text-sm lg:text-lg">
+                        <span className=" font-semibold ">Average price:</span>
                         <span className="font-semibold">
                           {price(model?.price?.avg)}
                         </span>
@@ -569,7 +569,7 @@ export const Tables = ({
                         // href={`https://console.akash.network/rent-gpu?vendor=${model?.vendor}&gpu=${model?.model}&interface=${model?.interface}&vram=${model?.ram}`}
                         href="https://console.akash.network/new-deployment"
                         target="_blank"
-                        className="inline-flex gap-1.5 rounded-md bg-foreground px-4 py-2 text-white hover:bg-primary dark:text-black dark:hover:text-inherit"
+                        className="inline-flex gap-1.5 rounded-md bg-foreground px-4 py-2 text-white hover:bg-primary dark:text-black dark:hover:text-inherit md:px-2 lg:px-4"
                       >
                         <p className="text-sm font-medium text-inherit">
                           Rent Now