Documentation

import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { Provider } from "react-redux";
import { BrowserRouter } from "react-router-dom";
import { store } from "./redux/store";
import AllRoutes from "./routes/router";

createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <Provider store={store}>
      <BrowserRouter>
        <AllRoutes />
      </BrowserRouter>
    </Provider>
  </StrictMode>
);

You can change the logo in your React project by following these steps:

1. Replace the Logo Image:
   • Place your new logo image (e.g., logo.svg or logo.png) in the src/assets/img/logo/ folder.
2. Update the Logo Import in Your Component:
   • Open the React component where the logo is used (commonly src/components/Header.tsx, Navbar.tsx, or similar).
   • Update the import statement to use your new logo file. For example:

   import logo from '../assets/img/logo/logo.svg';

3. Update the Logo Usage in JSX:
   • Replace the <img> tag's src attribute to use the imported logo variable:

   {``}

4. Save and View Changes:
   • Save the file and check your app in the browser. The new logo should appear in place of the old one.

The default font is Inter. To change the font:

Update the @import URL and the --font-family-primary variable in style.css:

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

// Font Family
--font-family-primary: SUSE,sans-serif;

The design token variables are defined in the @theme block of your CSS file. Here are the primary color tokens:

--color-primary: #7A13F0;
--color-success: #009966;
--color-info: #155DFC;
--color-warning: #E88C30;
--color-danger: #E5252A;

Background Color Change

You can change the header background color in style.css as per your wish

.navbar-header { 
	@apply bg-(--topbar-bg)
}