Merge pull request #17 from Leaxlang/lea

Finalizing fixes
Leaxlang · May 2, 2024 · 0b7d626 · 0b7d626
2 parents 2071975 + 32059f0
commit 0b7d626
Show file tree

Hide file tree

Showing 8 changed files with 187 additions and 57 deletions.
diff --git a/app/components/Aside.jsx b/app/components/Aside.jsx
@@ -13,6 +13,7 @@
  *   id?: string;
  * }}
  */
+
 export function Aside({children, heading, id = 'aside'}) {
   return (
     <div aria-modal className="overlay" id={id} role="dialog">

diff --git a/app/components/Cart.jsx b/app/components/Cart.jsx
@@ -84,7 +84,7 @@ function CartLineItem({layout, line}) {
         />
       )}
 
-      <div>
+      <div class="cart-item-decription">
         <Link
           prefetch="intent"
           to={lineItemUrl}
@@ -124,7 +124,7 @@ function CartCheckoutActions({checkoutUrl}) {
   return (
     <div>
       <a href={checkoutUrl} target="_self">
-        <p>Continue to Checkout &rarr;</p>
+        <p class="checkout">Continue to Checkout &rarr;</p>
       </a>
       <br />
     </div>
@@ -187,6 +187,7 @@ function CartLineQuantity({line}) {
   return (
     <div className="cart-line-quantiy">
       <small>Quantity: {quantity} &nbsp;&nbsp;</small>
+      <div class="cart-button">
       <CartLineUpdateButton lines={[{id: lineId, quantity: prevQuantity}]}>
         <button
           aria-label="Decrease quantity"
@@ -209,6 +210,7 @@ function CartLineQuantity({line}) {
       </CartLineUpdateButton>
       &nbsp;
       <CartLineRemoveButton lineIds={[lineId]} />
+      </div>
     </div>
   );
 }
@@ -298,9 +300,11 @@ function CartDiscounts({discountCodes}) {
       {/* Show an input to apply a discount */}
       <UpdateDiscountForm discountCodes={codes}>
         <div>
+          <p>Discount Code:
+        </p>
           <input type="text" name="discountCode" placeholder="Discount code" />
           &nbsp;
-          <button type="submit">Apply</button>
+          <button type="submit" class="checkout-apply">Apply</button>
         </div>
       </UpdateDiscountForm>
     </div>

diff --git a/app/components/Header.jsx b/app/components/Header.jsx
@@ -11,7 +11,7 @@ export function Header({header, isLoggedIn, cart}) {
   return (
     <header className="header">
       <NavLink prefetch="intent" to="/" style={activeLinkStyle} end>
-      <img src={logo} alt="Astrophobia Logo" width="30%"/>
+      <img src={logo} alt="Astrophobia Logo"/>
         {/* <strong>{shop.name}</strong> */}
       </NavLink>
       <HeaderMenu
@@ -108,7 +108,7 @@ function HeaderCtas({isLoggedIn, cart}) {
 function HeaderMenuMobileToggle() {
   return (
     <a className="header-menu-mobile-toggle" href="#mobile-menu-aside">
-      <h3>☰</h3>
+      <h3></h3>
     </a>
   );
 }

diff --git a/app/routes/collections._index.jsx b/app/routes/collections._index.jsx
@@ -33,7 +33,9 @@ export default function Collections() {
               {isLoading ? 'Loading...' : <span>↑ Load previous</span>}
             </PreviousLink>
             {/* <CollectionsGrid collections={nodes} /> */}
+            <div class="collection-wrapper">
             <Carousel collections={nodes}/>
+            </div>
             <NextLink>
               {isLoading ? 'Loading...' : <span>Load more ↓</span>}
             </NextLink>

diff --git a/app/routes/products.$handle.jsx b/app/routes/products.$handle.jsx
@@ -176,13 +176,15 @@ function ProductMain({selectedVariant, product, variants}) {
       </Suspense>
       <br />
       <br />
+      <div class="description">
       <p>
         <strong>Description</strong>
       </p>
       <br />
       <div dangerouslySetInnerHTML={{__html: descriptionHtml}} />
       <br />
     </div>
+    </div>
   );
 }