From c317c7b59d850468bde7d5783f318470f1e0c748 Mon Sep 17 00:00:00 2001
From: Danh <nguyenhoaidanh2096@gmail.com>
Date: Tue, 12 Sep 2023 10:48:31 +0700
Subject: [PATCH] update css

---
 src/assets/svg/no-data.svg                        | 15 +++++++++++++++
 src/components/swapv2/LimitOrder/ExpirePicker.tsx |  5 +++--
 .../swapv2/LimitOrder/ListOrder/index.tsx         |  7 ++++---
 .../swapv2/LimitOrder/Modals/styled.tsx           |  2 +-
 src/components/swapv2/LimitOrder/const.ts         |  2 ++
 5 files changed, 25 insertions(+), 6 deletions(-)
 create mode 100644 src/assets/svg/no-data.svg

diff --git a/src/assets/svg/no-data.svg b/src/assets/svg/no-data.svg
new file mode 100644
index 0000000000..6f0d4f30fc
--- /dev/null
+++ b/src/assets/svg/no-data.svg
@@ -0,0 +1,15 @@
+<svg width="48" height="32" viewBox="0 0 48 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M47.5839 13.1476L37.0892 0.938182C36.841 0.646899 36.5326 0.412302 36.185 0.250396C35.8374 0.0884893 35.4588 0.003082 35.075 0H12.5089C11.7348 0 10.999 0.353455 10.4946 0.938182L0 13.1476V19.8502H47.5839V13.1476Z" fill="url(#paint0_linear_1516_33132)"/>
+<path d="M44.6101 20.0968L35.4247 9.46263C35.2026 9.21154 34.9289 9.01094 34.622 8.87447C34.3151 8.738 33.9823 8.66885 33.6461 8.67172H13.9376C13.261 8.67172 12.5998 8.95099 12.159 9.46263L2.97363 20.0968V25.9375H44.6101V20.0968Z" fill="#EDFFFA"/>
+<path d="M47.5839 27.5312C47.5839 28.4618 47.1628 29.2985 46.4983 29.8592L46.3634 29.9683C45.8366 30.3656 45.1934 30.5802 44.5323 30.5792H3.05266C2.67766 30.5792 2.3191 30.5116 1.98796 30.3872L1.82348 30.3218C1.28086 30.0816 0.819831 29.6901 0.496205 29.1946C0.172578 28.6992 0.000223694 28.121 0 27.5302L0 13.2207H11.5451C12.8203 13.2207 13.8477 14.2647 13.8477 15.5312V15.5476C13.8477 16.8152 14.8872 17.8374 16.1625 17.8374H31.4214C32.0344 17.8369 32.6221 17.5946 33.056 17.1638C33.4898 16.733 33.7344 16.1487 33.7361 15.5389C33.7361 14.2669 34.7646 13.2207 36.0388 13.2207H47.5849L47.5839 27.5312Z" fill="url(#paint1_linear_1516_33132)"/>
+<defs>
+<linearGradient id="paint0_linear_1516_33132" x1="23.7919" y1="0" x2="23.7919" y2="19.8502" gradientUnits="userSpaceOnUse">
+<stop stop-color="#31CB9E" stop-opacity="0.3"/>
+<stop offset="1" stop-color="#31CB9E" stop-opacity="0.25"/>
+</linearGradient>
+<linearGradient id="paint1_linear_1516_33132" x1="23.7925" y1="13.2207" x2="23.7925" y2="30.5793" gradientUnits="userSpaceOnUse">
+<stop stop-color="#31CB9E" stop-opacity="0.3"/>
+<stop offset="1" stop-color="#31CB9E" stop-opacity="0.25"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/components/swapv2/LimitOrder/ExpirePicker.tsx b/src/components/swapv2/LimitOrder/ExpirePicker.tsx
index e230c9f7ae..ae4ed43dfc 100644
--- a/src/components/swapv2/LimitOrder/ExpirePicker.tsx
+++ b/src/components/swapv2/LimitOrder/ExpirePicker.tsx
@@ -1,5 +1,6 @@
 import { Trans } from '@lingui/macro'
 import dayjs from 'dayjs'
+import { rgba } from 'polished'
 import { useCallback, useEffect, useMemo, useState } from 'react'
 import { Calendar, X } from 'react-feather'
 import { Flex, Text } from 'rebass'
@@ -44,8 +45,8 @@ const DefaultOptionContainer = styled.div`
 `
 
 const ResultContainer = styled.div`
-  border: ${({ theme }) => `1px solid ${theme.warning}`};
-  padding: 10px;
+  background-color: ${({ theme }) => rgba(theme.warning, 0.2)};
+  padding: 12px;
   border-radius: 20px;
   width: 100%;
   display: flex;
diff --git a/src/components/swapv2/LimitOrder/ListOrder/index.tsx b/src/components/swapv2/LimitOrder/ListOrder/index.tsx
index a04a0889ca..22abb15cb2 100644
--- a/src/components/swapv2/LimitOrder/ListOrder/index.tsx
+++ b/src/components/swapv2/LimitOrder/ListOrder/index.tsx
@@ -2,13 +2,14 @@ import { Trans, t } from '@lingui/macro'
 import { rgba } from 'polished'
 import { stringify } from 'querystring'
 import { ReactNode, forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useState } from 'react'
-import { Info, Trash } from 'react-feather'
+import { Trash } from 'react-feather'
 import { useNavigate } from 'react-router-dom'
 import { useMedia } from 'react-use'
 import { Flex, Text } from 'rebass'
 import { useGetListOrdersQuery } from 'services/limitOrder'
 import styled from 'styled-components'
 
+import { ReactComponent as NoDataIcon } from 'assets/svg/no-data.svg'
 import { ButtonLight } from 'components/Button'
 import Column from 'components/Column'
 import LocalLoader from 'components/LocalLoader'
@@ -376,12 +377,12 @@ export default forwardRef<ListOrderHandle>(function ListLimitOrder(props, ref) {
               </TableFooter>
             ) : (
               <NoResultWrapper>
-                <Info size={30} />
+                <NoDataIcon />
                 <Text marginTop={'10px'}>
                   {keyword ? (
                     <Trans>No orders found</Trans>
                   ) : isTabActive ? (
-                    <Trans>You don&apos;t have any active orders yet</Trans>
+                    <Trans>You don&apos;t have any open orders yet</Trans>
                   ) : (
                     <Trans>You don&apos;t have any order history</Trans>
                   )}
diff --git a/src/components/swapv2/LimitOrder/Modals/styled.tsx b/src/components/swapv2/LimitOrder/Modals/styled.tsx
index 4b3a28cd55..bc7b4d19c5 100644
--- a/src/components/swapv2/LimitOrder/Modals/styled.tsx
+++ b/src/components/swapv2/LimitOrder/Modals/styled.tsx
@@ -103,7 +103,7 @@ export const MarketInfo = ({
     >
       <Row>
         <Label style={{ fontSize: 12 }}>
-          <Trans>Estimated Market Price</Trans>
+          <Trans>Est. Market Price</Trans>
         </Label>
         <Value style={{ maxWidth: '60%' }}>
           <TradePrice
diff --git a/src/components/swapv2/LimitOrder/const.ts b/src/components/swapv2/LimitOrder/const.ts
index dc6cf69fcd..033b9e165a 100644
--- a/src/components/swapv2/LimitOrder/const.ts
+++ b/src/components/swapv2/LimitOrder/const.ts
@@ -14,7 +14,9 @@ export const getExpireOptions = () =>
   [
     MIN_TIME_MINUTES * TIMES_IN_SECS.ONE_MIN,
     10 * TIMES_IN_SECS.ONE_MIN,
+    30 * TIMES_IN_SECS.ONE_MIN,
     TIMES_IN_SECS.ONE_HOUR,
+    TIMES_IN_SECS.ONE_DAY,
     3 * TIMES_IN_SECS.ONE_DAY,
     7 * TIMES_IN_SECS.ONE_DAY,
     30 * TIMES_IN_SECS.ONE_DAY,