customization
Theme Configurations

Theme Configurations

Change Logo

  • Go to apps/site/src/components/fronted/header/Logo.jsx file
import Logo from "./Logo";
 
const CustomHeader = () => {
    return (
        <>
            <Logo />
        </>
    );
};
 
export default CustomHeader;

Change Color

  • Go to apps/site/tailwind.config.js file
  • Scroll down to line 9 and update the color
colors: {
    themePrimary: '#068179',
    themePrimaryLighter: '#E6F2F2',
    themeSecondary: '#F27125',
    themeGreenLight: '#3EA875',
    themeWhiteLow: '#66737F',
    themeWhiteLight: '#F7F8F9',
    themeWhiteLighter: '#5D6D7E',
    themeGrayBorder: '#EBEDEF',
    themeGray: '#AEB6BF',
    themeGrayLight: '#D6DBDF',
    themeGrayDarker: '#06648156',
    themeBlack: '#283746',
    themeBlackDarker: '#1A2B3A',
    themeBlackLighter: '#E7E9EE',
    themeBlackAlt: '#001324',
    themeRedLight: '#FF4040',
    themeYellowLight: '#FF9900',
    themeGrayWhite: '#85929E',
    themeWhiteAlt: '#9CA3AF',
    footerBorder: '#ffffff33',
}

Change Content

We use static content for the site. You can change the content from go to each page or component and update the content. For example, if you want to change the content of the home page HeroSection component, you can go to apps/site/src/components/fronted/hero-section.jsx file and update the content.

Change Font

  • Go to apps/site/pages/_document.jsx file
  • Scroll down to line 15 and update the font
<link
    href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap"
    rel="stylesheet"
/>
  • Go to apps/site/src/styles/globals.css file
  • Scroll down to line 6 and update the font
body {
    padding: 0;
    margin: 0;
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
}

Change Header

We have 2 header TopNav and MainNavBar components.

  • Go to apps/site/src/components/fronted/header/TopNav.jsx file to update the top navigation bar
  • Go to apps/site/src/components/fronted/header/MainNavBar.jsx file to update the main navigation bar
import TopNav from "../header/TopNav";
import MainNavBar from "../header/MainNavBar";
 
const CustomHeader = () => {
    return (
        <>
            <TopNav />
            <MainNavBar />
        </>
    );
};
 
export default CustomHeader;

Change Header Menu

  • Go to apps/site/src/components/fronted/header/header_data.jsx file
  • Scroll down to line 5 for the main navigation menu
const menuList = [
  {
    id: 1,
    name: 'Home',
    link: '/',
    icon: (
      <svg
        width="20"
        height="20"
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M16.6667 6.66643L11.6667 2.28309C11.2084 1.87313 10.615 1.64648 10.0001 1.64648C9.38513 1.64648 8.79176 1.87313 8.33341 2.28309L3.33341 6.66643C3.06872 6.90316 2.8575 7.19356 2.71381 7.5183C2.57012 7.84304 2.49726 8.19466 2.50008 8.54976V15.8331C2.50008 16.4961 2.76347 17.132 3.23231 17.6009C3.70115 18.0697 4.33704 18.3331 5.00008 18.3331H15.0001C15.6631 18.3331 16.299 18.0697 16.7678 17.6009C17.2367 17.132 17.5001 16.4961 17.5001 15.8331V8.54143C17.5017 8.18773 17.4283 7.83771 17.2846 7.5145C17.141 7.19128 16.9304 6.90222 16.6667 6.66643ZM11.6667 16.6664H8.33341V12.4998C8.33341 12.2787 8.42121 12.0668 8.57749 11.9105C8.73377 11.7542 8.94573 11.6664 9.16675 11.6664H10.8334C11.0544 11.6664 11.2664 11.7542 11.4227 11.9105C11.5789 12.0668 11.6667 12.2787 11.6667 12.4998V16.6664ZM15.8334 15.8331C15.8334 16.0541 15.7456 16.2661 15.5893 16.4223C15.4331 16.5786 15.2211 16.6664 15.0001 16.6664H13.3334V12.4998C13.3334 11.8367 13.07 11.2008 12.6012 10.732C12.1323 10.2632 11.4965 9.99976 10.8334 9.99976H9.16675C8.5037 9.99976 7.86782 10.2632 7.39898 10.732C6.93014 11.2008 6.66675 11.8367 6.66675 12.4998V16.6664H5.00008C4.77907 16.6664 4.5671 16.5786 4.41082 16.4223C4.25454 16.2661 4.16675 16.0541 4.16675 15.8331V8.54143C4.1669 8.42311 4.19224 8.30617 4.24109 8.19841C4.28995 8.09065 4.36119 7.99452 4.45008 7.91643L9.45008 3.54143C9.60215 3.40783 9.79766 3.33415 10.0001 3.33415C10.2025 3.33415 10.398 3.40783 10.5501 3.54143L15.5501 7.91643C15.639 7.99452 15.7102 8.09065 15.7591 8.19841C15.8079 8.30617 15.8333 8.42311 15.8334 8.54143V15.8331Z"
          fill="white"
        />
      </svg>
    ),
  },
  {
    id: 2,
    name: 'Browse All Ads',
    link: '/all-ads',
    icon: (
      <svg
        width="20"
        height="20"
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M7.49935 15.8337C7.60825 15.8323 7.71583 15.8097 7.81602 15.767C7.917 15.7248 8.01002 15.6656 8.09102 15.592C8.12872 15.551 8.16222 15.5063 8.19102 15.4587C8.224 15.4161 8.24937 15.3682 8.26602 15.317C8.29585 15.2707 8.31833 15.2201 8.33268 15.167C8.33677 15.1115 8.33677 15.0558 8.33268 15.0003C8.33137 14.8914 8.30872 14.7838 8.26602 14.6837C8.22859 14.5802 8.16888 14.4863 8.09111 14.4086C8.01335 14.3308 7.91943 14.2711 7.81602 14.2337C7.66516 14.1637 7.49684 14.1405 7.33268 14.167L7.18268 14.217C7.13149 14.2336 7.08356 14.259 7.04102 14.292C6.99334 14.3208 6.94867 14.3543 6.90768 14.392C6.83182 14.4712 6.77234 14.5647 6.73268 14.667C6.68779 14.7723 6.6651 14.8858 6.66602 15.0003C6.66602 15.2213 6.75381 15.4333 6.91009 15.5896C7.06637 15.7459 7.27834 15.8337 7.49935 15.8337ZM4.40768 15.592C4.48868 15.6656 4.58169 15.7248 4.68268 15.767C4.78287 15.8097 4.89045 15.8323 4.99935 15.8337H5.15768C5.21288 15.8259 5.26639 15.809 5.31602 15.7837C5.36912 15.7654 5.41956 15.7402 5.46602 15.7087L5.59102 15.6087C5.66462 15.5277 5.72381 15.4346 5.76602 15.3337C5.81529 15.2297 5.83819 15.1152 5.83268 15.0003C5.83677 14.9448 5.83677 14.8891 5.83268 14.8337C5.82356 14.7815 5.80671 14.7309 5.78268 14.6837C5.76604 14.6325 5.74067 14.5845 5.70768 14.542C5.67889 14.4943 5.64539 14.4497 5.60768 14.4087C5.4905 14.293 5.34169 14.2147 5.18003 14.1836C5.01837 14.1524 4.85111 14.1698 4.69935 14.2337C4.59706 14.2733 4.5036 14.3328 4.42435 14.4087C4.38664 14.4497 4.35314 14.4943 4.32435 14.542C4.29137 14.5845 4.26599 14.6325 4.24935 14.6837C4.21366 14.7288 4.18552 14.7795 4.16602 14.8337C4.16193 14.8891 4.16193 14.9448 4.16602 15.0003C4.16733 15.1092 4.18998 15.2168 4.23268 15.317C4.27488 15.418 4.33407 15.511 4.40768 15.592ZM15.8327 1.66699H4.16602C3.50297 1.66699 2.86709 1.93038 2.39825 2.39923C1.92941 2.86807 1.66602 3.50395 1.66602 4.16699V15.8337C1.66602 16.4967 1.92941 17.1326 2.39825 17.6014C2.86709 18.0703 3.50297 18.3337 4.16602 18.3337H15.8327C16.4957 18.3337 17.1316 18.0703 17.6005 17.6014C18.0693 17.1326 18.3327 16.4967 18.3327 15.8337V4.16699C18.3327 3.50395 18.0693 2.86807 17.6005 2.39923C17.1316 1.93038 16.4957 1.66699 15.8327 1.66699ZM16.666 15.8337C16.666 16.0547 16.5782 16.2666 16.4219 16.4229C16.2657 16.5792 16.0537 16.667 15.8327 16.667H4.16602C3.945 16.667 3.73304 16.5792 3.57676 16.4229C3.42048 16.2666 3.33268 16.0547 3.33268 15.8337V13.3337H16.666V15.8337ZM16.666 11.667H3.33268V8.33366H6.66602C6.77569 8.33429 6.88441 8.31327 6.98594 8.2718C7.08747 8.23033 7.17982 8.16923 7.25768 8.09199L8.33268 7.05033L10.666 9.71699C10.7413 9.80279 10.8334 9.87221 10.9366 9.92095C11.0398 9.96969 11.1519 9.99671 11.266 10.0003C11.3757 10.001 11.4844 9.97994 11.5859 9.93847C11.6875 9.897 11.7798 9.83589 11.8577 9.75866L13.2577 8.33366H16.666V11.667ZM16.666 6.66699H12.916C12.8063 6.66636 12.6976 6.68738 12.5961 6.72885C12.4946 6.77032 12.4022 6.83142 12.3243 6.90866L11.291 7.95033L8.95768 5.28366C8.87973 5.2004 8.78552 5.13403 8.68088 5.08865C8.57624 5.04328 8.4634 5.01986 8.34935 5.01986C8.2353 5.01986 8.12246 5.04328 8.01782 5.08865C7.91318 5.13403 7.81897 5.2004 7.74102 5.28366L6.32435 6.66699H3.33268V4.16699C3.33268 3.94598 3.42048 3.73402 3.57676 3.57774C3.73304 3.42146 3.945 3.33366 4.16602 3.33366H15.8327C16.0537 3.33366 16.2657 3.42146 16.4219 3.57774C16.5782 3.73402 16.666 3.94598 16.666 4.16699V6.66699Z"
          fill="white"
        />
      </svg>
    ),
  },
  {
    id: 3,
    name: 'Category',
    link: '/all-categories',
    icon: (
      <svg
        width="20"
        height="20"
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M10.834 11.667H7.50065C7.27964 11.667 7.06768 11.7548 6.9114 11.9111C6.75511 12.0674 6.66732 12.2793 6.66732 12.5003C6.66732 12.7213 6.75511 12.9333 6.9114 13.0896C7.06768 13.2459 7.27964 13.3337 7.50065 13.3337H10.834C11.055 13.3337 11.267 13.2459 11.4232 13.0896C11.5795 12.9333 11.6673 12.7213 11.6673 12.5003C11.6673 12.2793 11.5795 12.0674 11.4232 11.9111C11.267 11.7548 11.055 11.667 10.834 11.667ZM14.1673 3.33366H13.184C13.0121 2.84737 12.6939 2.42616 12.2732 2.12777C11.8525 1.82939 11.3498 1.66844 10.834 1.66699H9.16732C8.65153 1.66844 8.14882 1.82939 7.7281 2.12777C7.30738 2.42616 6.98925 2.84737 6.81732 3.33366H5.83398C5.17094 3.33366 4.53506 3.59705 4.06622 4.06589C3.59738 4.53473 3.33398 5.17062 3.33398 5.83366V15.8337C3.33398 16.4967 3.59738 17.1326 4.06622 17.6014C4.53506 18.0703 5.17094 18.3337 5.83398 18.3337H14.1673C14.8304 18.3337 15.4662 18.0703 15.9351 17.6014C16.4039 17.1326 16.6673 16.4967 16.6673 15.8337V5.83366C16.6673 5.17062 16.4039 4.53473 15.9351 4.06589C15.4662 3.59705 14.8304 3.33366 14.1673 3.33366ZM8.33398 4.16699C8.33398 3.94598 8.42178 3.73402 8.57806 3.57774C8.73434 3.42146 8.9463 3.33366 9.16732 3.33366H10.834C11.055 3.33366 11.267 3.42146 11.4232 3.57774C11.5795 3.73402 11.6673 3.94598 11.6673 4.16699V5.00033H8.33398V4.16699ZM15.0007 15.8337C15.0007 16.0547 14.9129 16.2666 14.7566 16.4229C14.6003 16.5792 14.3883 16.667 14.1673 16.667H5.83398C5.61297 16.667 5.40101 16.5792 5.24473 16.4229C5.08845 16.2666 5.00065 16.0547 5.00065 15.8337V5.83366C5.00065 5.61265 5.08845 5.40068 5.24473 5.2444C5.40101 5.08812 5.61297 5.00033 5.83398 5.00033H6.66732V5.83366C6.66732 6.05467 6.75511 6.26663 6.9114 6.42291C7.06768 6.5792 7.27964 6.66699 7.50065 6.66699H12.5007C12.7217 6.66699 12.9336 6.5792 13.0899 6.42291C13.2462 6.26663 13.334 6.05467 13.334 5.83366V5.00033H14.1673C14.3883 5.00033 14.6003 5.08812 14.7566 5.2444C14.9129 5.40068 15.0007 5.61265 15.0007 5.83366V15.8337ZM12.5007 8.33366H7.50065C7.27964 8.33366 7.06768 8.42146 6.9114 8.57774C6.75511 8.73402 6.66732 8.94598 6.66732 9.16699C6.66732 9.38801 6.75511 9.59997 6.9114 9.75625C7.06768 9.91253 7.27964 10.0003 7.50065 10.0003H12.5007C12.7217 10.0003 12.9336 9.91253 13.0899 9.75625C13.2462 9.59997 13.334 9.38801 13.334 9.16699C13.334 8.94598 13.2462 8.73402 13.0899 8.57774C12.9336 8.42146 12.7217 8.33366 12.5007 8.33366Z"
          fill="white"
        />
      </svg>
    ),
  },
  {
    id: 4,
    name: 'Sellers',
    link: '/sellers',
    icon: (
      <svg
        width="20"
        height="20"
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M10.2507 10.1837C10.6953 9.79877 11.0519 9.32273 11.2964 8.78784C11.5408 8.25296 11.6673 7.67175 11.6673 7.08366C11.6673 5.97859 11.2283 4.91878 10.4469 4.13738C9.66553 3.35598 8.60572 2.91699 7.50065 2.91699C6.39558 2.91699 5.33577 3.35598 4.55437 4.13738C3.77297 4.91878 3.33398 5.97859 3.33398 7.08366C3.33398 7.67175 3.46049 8.25296 3.70492 8.78784C3.94936 9.32273 4.306 9.79877 4.75065 10.1837C3.5841 10.7119 2.59437 11.5649 1.8998 12.6408C1.20523 13.7166 0.835211 14.9698 0.833984 16.2503C0.833984 16.4713 0.921782 16.6833 1.07806 16.8396C1.23434 16.9959 1.4463 17.0837 1.66732 17.0837C1.88833 17.0837 2.10029 16.9959 2.25657 16.8396C2.41285 16.6833 2.50065 16.4713 2.50065 16.2503C2.50065 14.9242 3.02744 13.6525 3.96512 12.7148C4.9028 11.7771 6.17457 11.2503 7.50065 11.2503C8.82673 11.2503 10.0985 11.7771 11.0362 12.7148C11.9739 13.6525 12.5007 14.9242 12.5007 16.2503C12.5007 16.4713 12.5884 16.6833 12.7447 16.8396C12.901 16.9959 13.113 17.0837 13.334 17.0837C13.555 17.0837 13.767 16.9959 13.9232 16.8396C14.0795 16.6833 14.1673 16.4713 14.1673 16.2503C14.1661 14.9698 13.7961 13.7166 13.1015 12.6408C12.4069 11.5649 11.4172 10.7119 10.2507 10.1837ZM7.50065 9.58366C7.0062 9.58366 6.52285 9.43704 6.11173 9.16233C5.7006 8.88763 5.38017 8.49718 5.19095 8.04037C5.00173 7.58355 4.95222 7.08089 5.04869 6.59593C5.14515 6.11098 5.38325 5.66552 5.73288 5.31589C6.08252 4.96626 6.52797 4.72816 7.01293 4.6317C7.49788 4.53523 8.00054 4.58474 8.45736 4.77396C8.91418 4.96318 9.30462 5.28361 9.57932 5.69473C9.85403 6.10586 10.0007 6.58921 10.0007 7.08366C10.0007 7.7467 9.73726 8.38259 9.26842 8.85143C8.79958 9.32027 8.16369 9.58366 7.50065 9.58366ZM15.6173 9.85033C16.1506 9.24977 16.499 8.50787 16.6205 7.71394C16.742 6.92001 16.6314 6.10789 16.3021 5.37533C15.9728 4.64276 15.4388 4.02099 14.7644 3.58484C14.0899 3.1487 13.3038 2.91678 12.5007 2.91699C12.2796 2.91699 12.0677 3.00479 11.9114 3.16107C11.7551 3.31735 11.6673 3.52931 11.6673 3.75033C11.6673 3.97134 11.7551 4.1833 11.9114 4.33958C12.0677 4.49586 12.2796 4.58366 12.5007 4.58366C13.1637 4.58366 13.7996 4.84705 14.2684 5.31589C14.7373 5.78473 15.0007 6.42062 15.0007 7.08366C14.9995 7.52136 14.8834 7.95108 14.664 8.32984C14.4447 8.70861 14.1297 9.02314 13.7507 9.24199C13.6271 9.31326 13.5239 9.41505 13.451 9.53761C13.378 9.66017 13.3377 9.79941 13.334 9.94199C13.3305 10.0835 13.3631 10.2235 13.4287 10.3489C13.4943 10.4743 13.5908 10.5809 13.709 10.6587L14.034 10.8753L14.1423 10.9337C15.1468 11.4101 15.9942 12.1637 16.5848 13.1056C17.1754 14.0475 17.4844 15.1386 17.4757 16.2503C17.4757 16.4713 17.5634 16.6833 17.7197 16.8396C17.876 16.9959 18.088 17.0837 18.309 17.0837C18.53 17.0837 18.742 16.9959 18.8982 16.8396C19.0545 16.6833 19.1423 16.4713 19.1423 16.2503C19.1491 14.9715 18.8288 13.7122 18.2119 12.592C17.5949 11.4719 16.7018 10.5281 15.6173 9.85033Z"
          fill="white"
        />
      </svg>
    ),
  },
  {
    id: 5,
    name: 'News & Blog',
    link: '/news-blog',
    icon: (
      <svg
        width="18"
        height="14"
        viewBox="0 0 18 14"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M1.49935 6.99967H6.49935C6.72036 6.99967 6.93232 6.91188 7.0886 6.7556C7.24488 6.59932 7.33268 6.38735 7.33268 6.16634V1.16634C7.33268 0.945327 7.24488 0.733366 7.0886 0.577086C6.93232 0.420805 6.72036 0.333008 6.49935 0.333008H1.49935C1.27834 0.333008 1.06637 0.420805 0.910093 0.577086C0.753813 0.733366 0.666016 0.945327 0.666016 1.16634V6.16634C0.666016 6.38735 0.753813 6.59932 0.910093 6.7556C1.06637 6.91188 1.27834 6.99967 1.49935 6.99967ZM2.33268 1.99967H5.66602V5.33301H2.33268V1.99967ZM9.83268 3.66634H16.4993C16.7204 3.66634 16.9323 3.57854 17.0886 3.42226C17.2449 3.26598 17.3327 3.05402 17.3327 2.83301C17.3327 2.61199 17.2449 2.40003 17.0886 2.24375C16.9323 2.08747 16.7204 1.99967 16.4993 1.99967H9.83268C9.61167 1.99967 9.39971 2.08747 9.24343 2.24375C9.08715 2.40003 8.99935 2.61199 8.99935 2.83301C8.99935 3.05402 9.08715 3.26598 9.24343 3.42226C9.39971 3.57854 9.61167 3.66634 9.83268 3.66634ZM9.83268 11.9997H1.49935C1.27834 11.9997 1.06637 12.0875 0.910093 12.2438C0.753813 12.4 0.666016 12.612 0.666016 12.833C0.666016 13.054 0.753813 13.266 0.910093 13.4223C1.06637 13.5785 1.27834 13.6663 1.49935 13.6663H9.83268C10.0537 13.6663 10.2657 13.5785 10.4219 13.4223C10.5782 13.266 10.666 13.054 10.666 12.833C10.666 12.612 10.5782 12.4 10.4219 12.2438C10.2657 12.0875 10.0537 11.9997 9.83268 11.9997ZM16.4993 8.66634H1.49935C1.27834 8.66634 1.06637 8.75414 0.910093 8.91042C0.753813 9.0667 0.666016 9.27866 0.666016 9.49967C0.666016 9.72069 0.753813 9.93265 0.910093 10.0889C1.06637 10.2452 1.27834 10.333 1.49935 10.333H16.4993C16.7204 10.333 16.9323 10.2452 17.0886 10.0889C17.2449 9.93265 17.3327 9.72069 17.3327 9.49967C17.3327 9.27866 17.2449 9.0667 17.0886 8.91042C16.9323 8.75414 16.7204 8.66634 16.4993 8.66634ZM16.4993 5.33301H9.83268C9.61167 5.33301 9.39971 5.4208 9.24343 5.57709C9.08715 5.73337 8.99935 5.94533 8.99935 6.16634C8.99935 6.38735 9.08715 6.59932 9.24343 6.7556C9.39971 6.91188 9.61167 6.99967 9.83268 6.99967H16.4993C16.7204 6.99967 16.9323 6.91188 17.0886 6.7556C17.2449 6.59932 17.3327 6.38735 17.3327 6.16634C17.3327 5.94533 17.2449 5.73337 17.0886 5.57709C16.9323 5.4208 16.7204 5.33301 16.4993 5.33301Z"
          fill="white"
        />
      </svg>
    ),
  },
  {
    id: 6,
    name: 'Contact Us',
    link: '/contact-us',
    icon: (
      <svg
        width="20"
        height="20"
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M16.1744 10.8337C15.9911 10.8337 15.7994 10.7753 15.6161 10.7337C15.2451 10.6507 14.8803 10.5421 14.5244 10.4087C14.1378 10.268 13.7129 10.2753 13.3313 10.4292C12.9498 10.583 12.6386 10.8725 12.4577 11.242L12.2744 11.6253C11.4651 11.1663 10.7174 10.6063 10.0494 9.95866C9.40179 9.29064 8.84174 8.54297 8.38274 7.73366L8.76608 7.55866C9.13555 7.37776 9.42506 7.0666 9.57891 6.68507C9.73275 6.30354 9.74005 5.87859 9.59941 5.49199C9.46707 5.13285 9.3585 4.76539 9.27441 4.39199C9.23274 4.20866 9.19941 4.01699 9.17441 3.83366C9.07322 3.24668 8.76577 2.71511 8.30743 2.33469C7.84909 1.95427 7.26999 1.75 6.67441 1.75866H4.16608C3.81378 1.7582 3.46537 1.8322 3.14368 1.97581C2.82198 2.11943 2.53427 2.32941 2.29941 2.59199C2.05968 2.8617 1.88117 3.18012 1.77616 3.52536C1.67115 3.87059 1.64213 4.23447 1.69108 4.59199C2.14407 8.06044 3.72875 11.2825 6.19941 13.7587C8.67553 16.2293 11.8976 17.814 15.3661 18.267C15.4743 18.2753 15.5829 18.2753 15.6911 18.267C16.3056 18.2679 16.8989 18.0424 17.3577 17.6337C17.6203 17.3988 17.8303 17.1111 17.9739 16.7894C18.1175 16.4677 18.1915 16.1193 18.1911 15.767V13.267C18.1866 12.6912 17.9835 12.1346 17.616 11.6912C17.2486 11.2479 16.7394 10.945 16.1744 10.8337ZM16.5827 15.8337C16.5825 15.9499 16.5579 16.0649 16.5105 16.1711C16.4631 16.2773 16.3941 16.3724 16.3077 16.4503C16.2164 16.5335 16.1077 16.5954 15.9895 16.6314C15.8714 16.6675 15.7466 16.6768 15.6244 16.6587C12.5146 16.2525 9.62462 14.8353 7.39941 12.6253C5.1723 10.3982 3.74277 7.49813 3.33274 4.37533C3.31464 4.2531 3.32394 4.12839 3.35997 4.0102C3.39601 3.89202 3.45787 3.78332 3.54108 3.69199C3.61993 3.60462 3.71639 3.53494 3.82412 3.48754C3.93184 3.44014 4.04839 3.4161 4.16608 3.41699H6.66608C6.85871 3.41228 7.04703 3.47448 7.19897 3.59299C7.3509 3.7115 7.45708 3.87901 7.49941 4.06699C7.49941 4.29199 7.57441 4.52533 7.62441 4.75033C7.72072 5.18688 7.84884 5.6158 8.00774 6.03366L6.84108 6.58366C6.64055 6.67571 6.48471 6.84354 6.40774 7.05033C6.3244 7.25321 6.3244 7.48077 6.40774 7.68366C7.60708 10.2526 9.67211 12.3177 12.2411 13.517C12.444 13.6003 12.6715 13.6003 12.8744 13.517C13.0812 13.44 13.249 13.2842 13.3411 13.0837L13.8661 11.917C14.296 12.0738 14.7359 12.2018 15.1827 12.3003C15.3994 12.3503 15.6327 12.392 15.8577 12.4253C16.0457 12.4677 16.2132 12.5738 16.3317 12.7258C16.4503 12.8777 16.5125 13.066 16.5077 13.2587L16.5827 15.8337ZM11.6661 1.66699C11.4744 1.66699 11.2744 1.66699 11.0827 1.66699C10.8617 1.68578 10.6572 1.79159 10.5142 1.96116C10.3712 2.13072 10.3015 2.35015 10.3202 2.57116C10.339 2.79217 10.4448 2.99667 10.6144 3.13967C10.784 3.28266 11.0034 3.35245 11.2244 3.33366H11.6661C12.9922 3.33366 14.2639 3.86044 15.2016 4.79813C16.1393 5.73581 16.6661 7.00758 16.6661 8.33366C16.6661 8.48366 16.6661 8.62533 16.6661 8.77533C16.6476 8.99517 16.7171 9.21336 16.8592 9.38208C17.0014 9.55079 17.2046 9.65624 17.4244 9.67533H17.4911C17.6997 9.67617 17.901 9.59874 18.0553 9.45834C18.2096 9.31793 18.3056 9.12476 18.3244 8.91699C18.3244 8.72533 18.3244 8.52533 18.3244 8.33366C18.3244 6.56699 17.6232 4.87256 16.3747 3.62256C15.1263 2.37255 13.4327 1.6692 11.6661 1.66699ZM13.3327 8.33366C13.3327 8.55467 13.4205 8.76663 13.5768 8.92291C13.7331 9.07919 13.9451 9.16699 14.1661 9.16699C14.3871 9.16699 14.5991 9.07919 14.7553 8.92291C14.9116 8.76663 14.9994 8.55467 14.9994 8.33366C14.9994 7.4496 14.6482 6.60176 14.0231 5.97664C13.398 5.35151 12.5501 5.00033 11.6661 5.00033C11.4451 5.00033 11.2331 5.08812 11.0768 5.2444C10.9205 5.40068 10.8327 5.61264 10.8327 5.83366C10.8327 6.05467 10.9205 6.26663 11.0768 6.42291C11.2331 6.57919 11.4451 6.66699 11.6661 6.66699C12.1081 6.66699 12.532 6.84259 12.8446 7.15515C13.1571 7.46771 13.3327 7.89163 13.3327 8.33366Z"
          fill="white"
        />
      </svg>
    ),
  },
]
  • Scroll down to line 123 for the logged in user dropdown menu
import {
  AiOutlineBell,
  AiOutlineHeart,
  AiOutlineUser,
} from 'react-icons/ai'
 
const loginMenu = [
  {
    id: 1,
    name: 'Dashboard',
    link: '/dashboard',
    icon: (
      <svg
        width="18"
        className="text-white"
        height="18"
        viewBox="0 0 18 18"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M7.5 9.75H2.25C2.05109 9.75 1.86032 9.82902 1.71967 9.96967C1.57902 10.1103 1.5 10.3011 1.5 10.5V15.75C1.5 15.9489 1.57902 16.1397 1.71967 16.2803C1.86032 16.421 2.05109 16.5 2.25 16.5H7.5C7.69891 16.5 7.88968 16.421 8.03033 16.2803C8.17098 16.1397 8.25 15.9489 8.25 15.75V10.5C8.25 10.3011 8.17098 10.1103 8.03033 9.96967C7.88968 9.82902 7.69891 9.75 7.5 9.75ZM6.75 15H3V11.25H6.75V15ZM15.75 1.5H10.5C10.3011 1.5 10.1103 1.57902 9.96967 1.71967C9.82902 1.86032 9.75 2.05109 9.75 2.25V7.5C9.75 7.69891 9.82902 7.88968 9.96967 8.03033C10.1103 8.17098 10.3011 8.25 10.5 8.25H15.75C15.9489 8.25 16.1397 8.17098 16.2803 8.03033C16.421 7.88968 16.5 7.69891 16.5 7.5V2.25C16.5 2.05109 16.421 1.86032 16.2803 1.71967C16.1397 1.57902 15.9489 1.5 15.75 1.5ZM15 6.75H11.25V3H15V6.75ZM15.75 9.75H10.5C10.3011 9.75 10.1103 9.82902 9.96967 9.96967C9.82902 10.1103 9.75 10.3011 9.75 10.5V15.75C9.75 15.9489 9.82902 16.1397 9.96967 16.2803C10.1103 16.421 10.3011 16.5 10.5 16.5H15.75C15.9489 16.5 16.1397 16.421 16.2803 16.2803C16.421 16.1397 16.5 15.9489 16.5 15.75V10.5C16.5 10.3011 16.421 10.1103 16.2803 9.96967C16.1397 9.82902 15.9489 9.75 15.75 9.75ZM15 15H11.25V11.25H15V15ZM7.5 1.5H2.25C2.05109 1.5 1.86032 1.57902 1.71967 1.71967C1.57902 1.86032 1.5 2.05109 1.5 2.25V7.5C1.5 7.69891 1.57902 7.88968 1.71967 8.03033C1.86032 8.17098 2.05109 8.25 2.25 8.25H7.5C7.69891 8.25 7.88968 8.17098 8.03033 8.03033C8.17098 7.88968 8.25 7.69891 8.25 7.5V2.25C8.25 2.05109 8.17098 1.86032 8.03033 1.71967C7.88968 1.57902 7.69891 1.5 7.5 1.5ZM6.75 6.75H3V3H6.75V6.75Z"
          fill="currentColor"
        />
      </svg>
    ),
  },
  {
    id: 2,
    name: 'Edit Profile',
    link: '/dashboard/edit-profile',
    icon: <AiOutlineUser className="text-xl text-white" />,
  },
  {
    id: 3,
    name: 'Favourite Ads',
    link: '/dashboard/favourite-ads',
    icon: <AiOutlineHeart className="text-xl text-white" />,
  },
  {
    id: 4,
    name: 'Message',
    link: '/dashboard/message',
    icon: (
      <svg
        className="text-white"
        width="16"
        height="16"
        viewBox="0 0 16 16"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M8 5.75C7.85166 5.75 7.70666 5.79399 7.58332 5.8764C7.45999 5.95881 7.36386 6.07594 7.30709 6.21299C7.25032 6.35003 7.23547 6.50083 7.26441 6.64632C7.29335 6.7918 7.36478 6.92544 7.46967 7.03033C7.57456 7.13522 7.7082 7.20665 7.85368 7.23559C7.99917 7.26453 8.14997 7.24967 8.28701 7.19291C8.42406 7.13614 8.54119 7.04001 8.6236 6.91668C8.70601 6.79334 8.75 6.64834 8.75 6.5C8.75 6.30109 8.67098 6.11032 8.53033 5.96967C8.38968 5.82902 8.19891 5.75 8 5.75ZM13.25 0.5H2.75C2.15326 0.5 1.58097 0.737053 1.15901 1.15901C0.737053 1.58097 0.5 2.15326 0.5 2.75V10.25C0.5 10.8467 0.737053 11.419 1.15901 11.841C1.58097 12.2629 2.15326 12.5 2.75 12.5H11.4425L14.2175 15.2825C14.2876 15.352 14.3707 15.407 14.4621 15.4443C14.5534 15.4817 14.6513 15.5006 14.75 15.5C14.8484 15.5025 14.946 15.482 15.035 15.44C15.172 15.3837 15.2892 15.2882 15.372 15.1654C15.4547 15.0426 15.4993 14.8981 15.5 14.75V2.75C15.5 2.15326 15.2629 1.58097 14.841 1.15901C14.419 0.737053 13.8467 0.5 13.25 0.5ZM14 12.9425L12.2825 11.2175C12.2124 11.148 12.1293 11.093 12.0379 11.0557C11.9466 11.0183 11.8487 10.9994 11.75 11H2.75C2.55109 11 2.36032 10.921 2.21967 10.7803C2.07902 10.6397 2 10.4489 2 10.25V2.75C2 2.55109 2.07902 2.36032 2.21967 2.21967C2.36032 2.07902 2.55109 2 2.75 2H13.25C13.4489 2 13.6397 2.07902 13.7803 2.21967C13.921 2.36032 14 2.55109 14 2.75V12.9425ZM5 5.75C4.85166 5.75 4.70666 5.79399 4.58332 5.8764C4.45999 5.95881 4.36386 6.07594 4.30709 6.21299C4.25032 6.35003 4.23547 6.50083 4.26441 6.64632C4.29335 6.7918 4.36478 6.92544 4.46967 7.03033C4.57456 7.13522 4.7082 7.20665 4.85368 7.23559C4.99917 7.26453 5.14997 7.24967 5.28701 7.19291C5.42406 7.13614 5.54119 7.04001 5.6236 6.91668C5.70601 6.79334 5.75 6.64834 5.75 6.5C5.75 6.30109 5.67098 6.11032 5.53033 5.96967C5.38968 5.82902 5.19891 5.75 5 5.75ZM11 5.75C10.8517 5.75 10.7067 5.79399 10.5833 5.8764C10.46 5.95881 10.3639 6.07594 10.3071 6.21299C10.2503 6.35003 10.2355 6.50083 10.2644 6.64632C10.2934 6.7918 10.3648 6.92544 10.4697 7.03033C10.5746 7.13522 10.7082 7.20665 10.8537 7.23559C10.9992 7.26453 11.15 7.24967 11.287 7.19291C11.4241 7.13614 11.5412 7.04001 11.6236 6.91668C11.706 6.79334 11.75 6.64834 11.75 6.5C11.75 6.30109 11.671 6.11032 11.5303 5.96967C11.3897 5.82902 11.1989 5.75 11 5.75Z"
          fill="currentColor"
        />
      </svg>
    ),
  },
  {
    id: 5,
    name: 'Ad Alert',
    link: '/dashboard/ad-alert',
    icon: <AiOutlineBell className="text-xl text-white" />,
  },
]

Change Footer

  • Go to apps/site/src/components/fronted/footer/Footer.jsx file
  • Scroll down to line 62 and update the footer content
import Footer from "../footer/Footer";
 
const CustomFooter = () => {
    return (
        <Footer />
    );
};
 
export default CustomFooter;

Change Footer Menus

  • Go to apps/site/src/components/fronted/footer/footer_data.jsx file
  • Scroll down to line 5 for social links
  • Scroll down to line 29 for quick links column one menu
  • Scroll down to line 58 for quick links column two menu
import { FaFacebookF, FaLinkedinIn, FaTwitter, FaYoutube } from "react-icons/fa";
 
const socialShare = [
  {
    id: 1,
    icon: <FaFacebookF className="text-white" />,
    link: 'https://www.facebook.com/',
  },
  {
    id: 3,
    icon: <FaTwitter className="text-white" />,
    link: 'https://twitter.com/',
  },
  {
    id: 4,
    icon: <FaYoutube className="text-white" />,
    link: 'https://www.youtube.com/',
  },
  {
    id: 2,
    icon: <FaLinkedinIn className="text-white" />,
    link: 'https://www.linkedin.com/',
  },
];
 
const linkOne = [
  {
    id: 1,
    name: "Footer LInk Here",
    link: "/",
  },
  {
    id: 2,
    name: "Footer LInk Here",
    link: "/",
  },
  {
    id: 3,
    name: "Footer LInk Here",
    link: "/",
  },
  {
    id: 4,
    name: "Footer LInk Here",
    link: "/",
  },
  {
    id: 5,
    name: "Footer LInk Here",
    link: "/",
  },
]
 
const linkTwo = [
  {
    id: 1,
    name: "Footer LInk Here",
    link: "/",
  },
  {
    id: 2,
    name: "Footer LInk Here",
    link: "/",
  },
  {
    id: 3,
    name: "Footer LInk Here",
    link: "/",
  },
  {
    id: 4,
    name: "Footer LInk Here",
    link: "/",
  },
  {
    id: 5,
    name: "Footer LInk Here",
    link: "/",
  },
]

Custom Development Support

If you require custom development or need assistance with the customization process, our team is here to help. Please contact us for personalized support.

For inquiries, please reach out to support@jstemplate.net