> For the complete documentation index, see [llms.txt](https://codedthemes.gitbook.io/gradient-able-react/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://codedthemes.gitbook.io/gradient-able-react/file-structure.md).

# 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
```