# Folder Structure & Layout

## Folder Structure

#### `public/`

This folder contains public assets like favicon and index.html file

#### `src/`

This folder contains all the pages, components, styles. This is the folder you can develop your project.

***`@assets/`***

This folder keeps images, fonts, icons, and scss files.

***`@store/`***

This folder contains config file for your app.

***`@layout/`***

This folder contains layout files with its components.

***`@navigation/`***

This folder contains sidebar menu items.

***`@router/`***

Router folder contains page routes and the main router

***`@view/`***

View folder contains all Yoda pages like component pages. You can write your all pages here. 

## Layout

Yoda has three layout types;

#### Vertical Layout

Vertical layout is the main layout of Yoda. Yoda Main pages use this layout.

#### Horizontal Layout

Horizontal layout is 2. alternative layout, you can change it using customizer.

#### Full Layout

Full layout is using for Login screens, Lock pages, and error pages.

### How to apply layout?

You can apply from router. When you create new page on `src/router`. Vertical layout is default layout.

```
{
     path: "/pages/authentication/login",
     name: "login",
     component: () => import("@/view/pages/authentication/login"),
     meta: {
        layout: "full",
     },
 },
```