feat: apply style to prices in others products rows

luisfbl · Sep 15, 2024 · 7f70388 · 7f70388
1 parent 5d1d092
commit 7f70388
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 20 deletions.
diff --git a/web/src/components/ProductList/UnpaginatedColumnProduct.tsx b/web/src/components/ProductList/UnpaginatedColumnProduct.tsx
@@ -26,7 +26,10 @@ export default function UnpaginatedColumnProduct(props: { item: any }) {
                     { Star_image }
                     <p>({item.rating_quantity || "N/A "})</p>
                 </div>
-                <p className="price">R$ {item.price}</p>
+                <span className="price">
+                    <span className="highlight">R$ {item.price}</span>/
+                    <span className="quantity">{item.unit_quantity}{item.unit}</span>
+                </span>
             </div>
         </div>
     )

diff --git a/web/src/components/ProductList/UnpaginatedProduct.tsx b/web/src/components/ProductList/UnpaginatedProduct.tsx
@@ -44,7 +44,8 @@ export default function UnpaginatedProduct(props: { item: any, i: number }) {
                         <p><ItemDist id={item.id}/></p>
                     </span>
                     <span className="price">
-                        <p>R$ {item.price} {item.unit}</p>
+                        <span className="highlight">R$ {item.price}</span>/
+                        <span className="quantity">{item.unit_quantity}{item.unit}</span>
                     </span>
                 </div>
             </a>

diff --git a/web/src/components/page/home/Access.astro b/web/src/components/page/home/Access.astro
@@ -24,12 +24,4 @@ import "../../../style/pages/home.scss";
             <a href="/access/signup">Criar conta</a>
         </section>
     </Fragment>
-
-    <script>
-        fetch(`/api/v1/users/@me`, {
-            credentials: "include"
-        }).then(request => {
-            request.json().then((data) => console.log(data)).catch(e => {})
-        }).catch(e => {})
-    </script>
 </BaseLayout>
diff --git a/web/src/components/page/home/client_home/Items.tsx b/web/src/components/page/home/client_home/Items.tsx
@@ -72,11 +72,12 @@ function RenderItems(props: { store: string, star_image_src: string, location_im
                             />
                             <div className="footer">
                                 <span>
-                                    <Location_Img location_image_src={props.location_image_src} />
-                                    <p><ItemDist id={item.id} /></p>
+                                    <Location_Img location_image_src={props.location_image_src}/>
+                                    <p><ItemDist id={item.id}/></p>
                                 </span>
                                 <span className="price">
-                                    <p>R$ {item.price} {item.unit}</p>
+                                    <span className="highlight">R$ {item.price}</span>/
+                                    <span className="quantity">{item.unit_quantity}{item.unit}</span>
                                 </span>
                             </div>
                         </a>
@@ -87,7 +88,7 @@ function RenderItems(props: { store: string, star_image_src: string, location_im
     )
 }
 
-const Location_Img = memo(({ location_image_src }: any) => {
+const Location_Img = memo(({location_image_src}: any) => {
     return (
         <img
             src={location_image_src}

diff --git a/web/src/components/page/home/client_home/ItemsModal.tsx b/web/src/components/page/home/client_home/ItemsModal.tsx
@@ -37,7 +37,10 @@ export default function Items(props: { container_id: string, store: string, star
                                         />
                                         <p>({item.rating_quantity || "N/A "})</p>
                                     </div>
-                                    <p className="price">R$ {item.price}</p>
+                                    <span className="price">
+                                        <span className="highlight">R$ {item.price}</span>/
+                                        <span className="quantity">{item.unit_quantity}{item.unit}</span>
+                                    </span>
                                 </div>
                             </div>
                         ))

diff --git a/web/src/style/layouts/unpaginatedproductlist.scss b/web/src/style/layouts/unpaginatedproductlist.scss
@@ -92,11 +92,13 @@
                 }
 
                 .footer {
-                    span {
-                        p {
-                            color: colors.$dark;
-                            font-size: 0.75em;
-                            font-weight: 600;
+                    .price {
+                        font-size: 0.75em;
+                        font-weight: 600;
+                        gap: 0.666px;
+
+                        .highlight {
+                            color: colors.$primary-dark;
                         }
                     }
                 }