# Frontend

<figure><img src="/files/62HAupyw8nK4opOqLUpC" alt=""><figcaption><p>Folder structure</p></figcaption></figure>

In this folder, there are sections for the design code and settings of our project.

The `backend` folder contains assets related to the admin panel, while the `frontend` folder contains assets for the website.

For easy color changes on the frontend:

`->frontend->assets->css->style.css`` ``//following the file`&#x20;

````css
```css
   :root {
     --primary-bg-color: #07242b;
     --primary-bg-hover-color: #10313a;
     --hero-text-bg-color:#175a6a;
     --primary-color: #292929;
     --secondary-color: #6c7187;
     --tertiary-color: #8998be;
     --quaternary-color: #57688b;
     --quinary-color: #d4fe00;
     --quinary-hover-color: #abcc07;
     --footer-color: #ffffff;
     --footer-hover-color: #c5c5c5;
     --orange-color: #f57f1e;
     --orange-hover-color: #d16b17;
     --senary-color: #606060;
     --card-bg: #f4f5f9;
     --default-text-color: #202020;
     --light-bg-color: #e1e1e140;
     --color-white: #ffffff;
     --color-black: #141414;
     --sidebar-text-color: #cccccc;
     --sidebar-text-hover-color: #afafaf;
   }
```
````

Here, you can easily manage your colors. In our CSS file and all other design files, all the settings are grouped under comment tags, making it easy for you to find and customize them.

If you want to make a change in the frontend, particularly in the header or footer, you can find the files under: `resources->views->frontend->layout` folder, where the files are divided into 3 sections:

1. **master.blade.php**: This file contains the frontend code that appears on your site's main pages.
2. **user.blade.php**: This file is responsible for the user dashboard section.
3. **write.blade.php**: This file handles the page for creating complaints.

In these design files, backend code has been kept as separate as possible to ensure that you can easily make edits without interfering with the backend functionality. This structure has been implemented to give you flexibility in customizing the frontend without complications.

Additionally, some design files are supported by Livewire in our project, and these can be found in the following directory:

`->resources->views->livewire`

This allows for dynamic and interactive components in your frontend that can easily be managed and customized using Livewire.

For more support, you can reach me through [my user profile](https://codecanyon.net/user/softbynet) on CodeCanyon.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://complainify.gitbook.io/complainify-docs/code-support/frontend.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.