fix: row padding on small screens

osmosis-labs · Aug 12, 2024 · b7635bd · b7635bd
1 parent 6ecbd1e
commit b7635bd
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/packages/web/components/complex/orders-history/index.tsx b/packages/web/components/complex/orders-history/index.tsx
@@ -469,7 +469,7 @@ const TableOrderRow = memo(
         style={style}
         className={classNames(
           gridClasses,
-          "xl:-mx-4 xl:items-center xl:overflow-visible xl:px-4 xl:hover:cursor-pointer xl:hover:bg-osmoverse-900"
+          "xl:-mx-4 xl:items-center xl:overflow-visible xl:px-4 xl:hover:cursor-pointer xl:hover:bg-osmoverse-900 sm:[&>td]:!py-0"
         )}
         onClick={() => onOrderSelect(order)}
       >

diff --git a/packages/web/components/complex/orders-history/order-modal.tsx b/packages/web/components/complex/orders-history/order-modal.tsx
@@ -30,7 +30,7 @@ export const OrderModal = memo(({ order, onRequestClose }: OrderModalProps) => {
     <ModalBase
       isOpen={!!order}
       onRequestClose={onRequestClose}
-      className="xl:!p-0 sm:h-full sm:min-h-[100vh] sm:!rounded-none"
+      className="xl:!px-0 xl:!pb-0 xl:!pt-2 sm:h-full sm:min-h-[100vh] sm:!rounded-none"
     >
       <OrderDetails
         order={order}
@@ -189,7 +189,7 @@ const OrderDetails = observer(
     return (
       <div
         className={classNames(
-          "top-[4.5rem] flex w-full flex-col overflow-y-auto border-osmoverse-700 bg-osmoverse-900 xl:!py-8 xl:!px-8 sm:top-0 sm:h-full sm:!h-full sm:rounded-none sm:bg-osmoverse-850"
+          "top-[4.5rem] flex w-full flex-col overflow-y-auto border-osmoverse-700 bg-osmoverse-900 xl:!py-6 xl:!px-8 sm:top-0 sm:h-full sm:!h-full sm:rounded-none sm:bg-osmoverse-850"
         )}
       >
         {!isModal && (