File Structure

Project structure

Under the gradient-able/the folder you will find the project folder structure.

gradient-able/
├── public/
│   ├── robots.txt
└── src/
    ├── assets/
    |    ├── images/
    |    ├── scss/           -> Template SCSS files, check folder structure below  
    ├── components/          -> Template custom components
    ├── config/              -> Template constant value and live customization  
    ├── contexts/        
    ├── data/                -> Tables data
    ├── hooks/               -> Custom hooks             
    ├── layouts/
    |   ├── AdminLayout      -> Layout components & routers
    ├── service/
    ├── store/              
    ├── utils
    ├── views/               -> View files for all pages
    ├── App.jsx
    ├── index.jsx            -> Application root js file
    ├── index.scss           -> Application main scss file
    ├── menu-item.jsx        -> Allication menu data
    ├── routes.jsx           -> Add pages router
    ├── reportWebVitals.jsx
├── .env
├── .env.development
├── .env.qa
├── eslint.rc
├── .prettiertc
├── favicon.ico
├── index.html
├── jsconfig.json
├── package-lock.json           -> Package lock file.
├── package.json                -> Package json file.
├── vite.config.mjs
├── yarn.lock   

SCSS structure

Under the gradient-able/src/assets/scss/the folder you will find the following folder structure.

SCSS/
├── react-module/          -> Third party plugins customisation scss
├── settings/              -> Template variable scss folder
├── themes/                -> Layout and React views specific scss files
├── layout-dark.scss       -> Application dark file
├── layout-rtl.scss        -> Application RTL file
├── style.scss             -> Application main file

Last updated