Note: During the time that you are modifying, you should be use development server that help you create a local server and you can see it directly. To use it, first you need to install Node.js , then open terminal / command prompt and type: "npm run dev" to start development server:

Open http://localhost:3000/#/:

Layout

1. Title

Open "layouts/default.vue" and you will see:

Take a look at <v-toolbar-title> element, if you change text inside, the title will change.

Example:

Result:

2. Toolbar's color

Take a look at the color attribute in <v-toolbar> element, if you change text inside, the color of toolbar will change.

Note: Find color here.

Example:

Result:

3. Drawer

Scroll down and you will see:

Look at the its properties, you probably understand what it means. You can freely change the "icon" and "title" property, but be careful with the "path" property.

Find icon here

Generator Box

Open "components/GenerateBox.vue", if you want to change title, label,...etc, scroll down and take a look at "box" property:

You can freely change the "title" and "label" property, but shouldn't change "model" path.

Example:

Result:

Parallax in index page

Open "pages/index.vue":

If you want to change parallax image, you need to change the link in src attribute in <v-parallax> element.

Example:

Result:

Custom page

All of the instruction above are special things. All pages of this app located in folder "pages", to find out which component corresponds to which router, just look at the name of the component:

"index.vue" = yoururl.com/

"history.vue" = yoururl.com/history

"generator.vue" = yoururl.com/generator

You can add any element such as <p>, <h1>, <h2>,.... Example, in file "index.vue" that it match route "/":

I'm going add a <h2> element:

Result:

It is similar to other components, but if you want to add some element like button, you won't want to use <button> element, example:

Result:

This is the time that you need to use Vuetify - a material design component framework that include a large number of components such as button, input, select,...

Example, i will use <v-btn> instead of <button>:

Result:

So, if you want to go deeper, you will probably want to learn about its available components

.