initial commit

2025-08-05 12:35:40 +07:00
commit fffa2ead5c
1069 changed files with 118056 additions and 0 deletions
@@ -0,0 +1,106 @@
+// MUI Imports
+import Typography from '@mui/material/Typography'
+import Breadcrumbs from '@mui/material/Breadcrumbs'
+import Grid from '@mui/material/Grid2'
+import Divider from '@mui/material/Divider'
+import InputAdornment from '@mui/material/InputAdornment'
+
+// Third-party Imports
+import classnames from 'classnames'
+
+// Component Imports
+import Link from '@components/Link'
+import DirectionalIcon from '@components/DirectionalIcon'
+import CustomTextField from '@core/components/mui/TextField'
+
+// Styles Imports
+import frontCommonStyles from '@views/front-pages/styles.module.css'
+
+// Data
+const articleList = [
+  'Template Kits',
+  'Elementor Template Kits: PHP Zip Extends',
+  'Envato Elements Template Kits',
+  'Envato Elements Template Kits',
+  'How to use the template in WordPress',
+  'How to use the Template Kit Import'
+]
+
+const Questions = () => {
+  return (
+    <section className='flex flex-col justify-center items-center gap-4 md:plb-[100px] plb-[50px] pbs-[70px] -mbs-[70px] bg-backgroundPaper'>
+      <div className={classnames('pbs-10 md:pbs-16', frontCommonStyles.layoutSpacing)}>
+        <Grid container spacing={6}>
+          <Grid size={{ xs: 12, lg: 8 }}>
+            <div className='flex flex-col gap-2'>
+              <Breadcrumbs aria-label='breadcrumb'>
+                <Link className='hover:text-primary' href='/front-pages/help-center'>
+                  Help Center
+                </Link>
+                <Typography className='text-textPrimary'>How to add product in cart</Typography>
+              </Breadcrumbs>
+              <Typography variant='h4'>How to add product in cart?</Typography>
+              <Typography>1 month ago - Updated</Typography>
+            </div>
+            <Divider className='mlb-6' />
+            <div className='flex flex-col gap-6'>
+              <div>
+                <Typography className='mbe-4'>
+                  If you&apos;re after only one item, simply choose the &apos;Buy Now&apos; option on the item page.
+                  This will take you directly to Checkout.
+                </Typography>
+                <Typography>
+                  If you want several items, use the &apos;Add to Cart&apos; button and then choose &apos;Keep
+                  Browsing&apos; to continue shopping or &apos;Checkout&apos; to finalize your purchase.
+                </Typography>
+              </div>
+              <img src='/images/front-pages/product.png' alt='product image' className='rounded is-full max-is-auto' />
+              <Typography>
+                You can go back to your cart at any time by clicking on the shopping cart icon at the top right side of
+                the page.
+              </Typography>
+              <img
+                src='/images/front-pages/checkout.png'
+                alt='checkout image'
+                className='rounded is-full max-is-auto'
+              />
+            </div>
+          </Grid>
+          <Grid size={{ xs: 12, lg: 4 }} className='flex flex-col gap-6'>
+            <CustomTextField
+              placeholder='Search...'
+              slotProps={{
+                input: {
+                  startAdornment: (
+                    <InputAdornment position='start'>
+                      <i className='tabler-search' />
+                    </InputAdornment>
+                  )
+                }
+              }}
+            />
+            <div className='flex flex-col gap-4'>
+              <div className='pli-5 plb-2 bg-actionHover rounded'>
+                <Typography variant='h5'>Articles in this section</Typography>
+              </div>
+              <div className='flex flex-col gap-4'>
+                {articleList.map((article, index) => (
+                  <Typography key={index} component={Link} className='flex gap-2 justify-between hover:text-primary'>
+                    <Typography color='inherit'>{article}</Typography>
+                    <DirectionalIcon
+                      ltrIconClass='tabler-chevron-right text-textDisabled text-xl'
+                      rtlIconClass='tabler-chevron-left text-textDisabled text-xl'
+                      className='text-textDisabled'
+                    />
+                  </Typography>
+                ))}
+              </div>
+            </div>
+          </Grid>
+        </Grid>
+      </div>
+    </section>
+  )
+}
+
+export default Questions