fix_prettier

Signed-off-by: Akella Srinivas <[email protected]>

Author: Srinu346

src/components/Product.js

@@ -4,18 +4,18 @@ import useBaseUrl from "@docusaurus/useBaseUrl";
 
 function UTG() {
   return (
-    <div className="rounded-lg w-full">
-      <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+    <div className="w-full rounded-lg">
+      <div className="grid grid-cols-1 gap-4 md:grid-cols-3">
         <div className="mt-5 flex flex-col space-y-3 text-lg">
           <Link
             className="text-foreground-light flex-grow text-sm"
             to={useBaseUrl("/running-keploy/unit-test-generator/")}
           >
-            <div className="rounded-lg bg-[color:var(--ifm-card-background-color)] p-4 md:p-5 lg:p-6 shadow transition hover:shadow-lg hover:shadow-[color:var(--ifm-card-shadow-color)] h-full">
+            <div className="h-full rounded-lg bg-[color:var(--ifm-card-background-color)] p-4 shadow transition hover:shadow-lg hover:shadow-[color:var(--ifm-card-shadow-color)] md:p-5 lg:p-6">
               <div className="flex items-center space-x-4">
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
-                  className="mb-4 h-8 w-8 md:h-10 md:w-10 lg:h-12 lg:w-12 rounded-lg bg-[color:var(--ifm-color)] p-2 text-[color:var(--ifm-background-color)]"
+                  className="mb-4 h-8 w-8 rounded-lg bg-[color:var(--ifm-color)] p-2 text-[color:var(--ifm-background-color)] md:h-10 md:w-10 lg:h-12 lg:w-12"
                   viewBox="0 0 64 64"
                   width="13"
                   height="16"
@@ -25,13 +25,13 @@ function UTG() {
                     fill="#FF914D"
                   />
                 </svg>
-                <h2 className="mb-4 text-lg md:text-xl font-semibold">
+                <h2 className="mb-4 text-lg font-semibold md:text-xl">
                   Unit Testing Agent
                 </h2>
               </div>
               <ul>
                 <li>
-                  <p className="text-sm md:text-base leading-relaxed">
+                  <p className="text-sm leading-relaxed md:text-base">
                     Generate reliable, validated tests as you code, ensuring
                     coverage and stability.
                   </p>
@@ -45,11 +45,11 @@ function UTG() {
             className="text-foreground-light flex-grow text-sm"
             to={useBaseUrl("keploy-explained/introduction")}
           >
-            <div className="rounded-lg bg-[color:var(--ifm-card-background-color)] p-4 md:p-5 lg:p-6 shadow transition hover:shadow-lg hover:shadow-[color:var(--ifm-card-shadow-color)] h-full">
+            <div className="h-full rounded-lg bg-[color:var(--ifm-card-background-color)] p-4 shadow transition hover:shadow-lg hover:shadow-[color:var(--ifm-card-shadow-color)] md:p-5 lg:p-6">
               <div className="flex items-center space-x-4">
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
-                  className="mb-4 h-8 w-8 md:h-10 md:w-10 lg:h-12 lg:w-12 rounded-lg bg-[color:var(--ifm-color)] p-2 text-[color:var(--ifm-background-color)]"
+                  className="mb-4 h-8 w-8 rounded-lg bg-[color:var(--ifm-color)] p-2 text-[color:var(--ifm-background-color)] md:h-10 md:w-10 lg:h-12 lg:w-12"
                   viewBox="0 0 100 100"
                   width="13"
                   height="16"
@@ -75,13 +75,13 @@ function UTG() {
                     d="M39.802 14.307l-.117 11.834c0 2.21-2.085 3.666-4.036 3.666-1.951 0-4.217-1.439-4.217-3.649l.037-12.58c0-1.307 1.607-2.451 2.801-2.451 1.194 0 2.345 1.149 2.345 2.456l.021 10.829c0 0-.083.667-1.005.645-.507-.012-1.145-.356-1.016-.906v-9.843h-.813l-.021 9.708c0 1.38.54 1.948 1.875 1.948s1.959-.714 1.959-2.094V13.665c0-2.271-1.36-3.5-3.436-3.5s-3.564 1.261-3.564 3.532l.032 12.11c0 3.04 2.123 4.906 4.968 4.906 2.845 0 5-1.71 5-4.75V14.307H39.802zM53.114 52.307h-23c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h23c.276 0 .5.224.5.5S53.391 52.307 53.114 52.307zM44.114 59.307h-14c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h14c.276 0 .5.224.5.5S44.391 59.307 44.114 59.307zM70.114 59.307h-24c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h24c.276 0 .5.224.5.5S70.391 59.307 70.114 59.307zM61.114 66.307h-11c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h11c.276 0 .5.224.5.5S61.391 66.307 61.114 66.307zM71.114 66.307h-8c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h8c.276 0 .5.224.5.5S71.391 66.307 71.114 66.307zM48.114 66.307h-18c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h18c.276 0 .5.224.5.5S48.391 66.307 48.114 66.307zM70.114 73.307h-13c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h13c.276 0 .5.224.5.5S70.391 73.307 70.114 73.307zM54.114 73.307h-24c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h24c.276 0 .5.224.5.5S54.391 73.307 54.114 73.307z"
                   />
                 </svg>
-                <h2 className="mb-4 text-lg md:text-xl font-semibold">
+                <h2 className="mb-4 text-lg font-semibold md:text-xl">
                   Integration Testing
                 </h2>
               </div>
               <ul>
                 <li>
-                  <p className="text-sm md:text-base leading-relaxed">
+                  <p className="text-sm leading-relaxed md:text-base">
                     Records and replays API calls with mocks for reliable
                     integration testing and stability.
                   </p>
@@ -95,11 +95,11 @@ function UTG() {
             className="text-foreground-light flex-grow text-sm"
             to={useBaseUrl("running-keploy/api-test-generator")}
           >
-            <div className="rounded-lg bg-[color:var(--ifm-card-background-color)] p-4 md:p-5 lg:p-6 shadow transition hover:shadow-lg hover:shadow-[color:var(--ifm-card-shadow-color)] h-full">
+            <div className="h-full rounded-lg bg-[color:var(--ifm-card-background-color)] p-4 shadow transition hover:shadow-lg hover:shadow-[color:var(--ifm-card-shadow-color)] md:p-5 lg:p-6">
               <div className="flex items-center space-x-4">
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
-                  className="mb-4 h-8 w-8 md:h-10 md:w-10 lg:h-12 lg:w-12 rounded-lg bg-[color:var(--ifm-color)] p-2 text-[color:var(--ifm-background-color)]"
+                  className="mb-4 h-8 w-8 rounded-lg bg-[color:var(--ifm-color)] p-2 text-[color:var(--ifm-background-color)] md:h-10 md:w-10 lg:h-12 lg:w-12"
                   viewBox="0 0 64 64"
                   width="100"
                   height="100"
@@ -216,13 +216,13 @@ function UTG() {
                   </g>
                   undefined
                 </svg>
-                <h2 className="mb-4 text-lg md:text-xl font-semibold">
+                <h2 className="mb-4 text-lg font-semibold md:text-xl">
                   API Testing Agent
                 </h2>
               </div>
               <ul>
                 <li>
-                  <p className="text-sm md:text-base leading-relaxed">
+                  <p className="text-sm leading-relaxed md:text-base">
                     Generates API tests from your docs, covering edge cases,
                     ensuring coverage.
                   </p>
@@ -238,16 +238,17 @@ function UTG() {
 
 export const Products = () => {
   return (
-    <section className="mt-12 text-bold w-full">
-      <div className="text-start mb-8">
+    <section className="text-bold mt-12 w-full">
+      <div className="mb-8 text-start">
         <h2 className="mb-4 text-2xl font-semibold tracking-wide md:text-3xl">
           Products 🛠️
         </h2>
         <p className="text-l mb-8 max-w-4xl">
-          Keploy provides three key products that help you streamline your testing workflow:
+          Keploy provides three key products that help you streamline your
+          testing workflow:
         </p>
       </div>
-        <UTG />
+      <UTG />
     </section>
   );
 };