Template Options

vAPP comes with couples of pre-made template options such as: pre-made color as solid and gradient, boxed layout and patterns. They are very issue to apply in template

Set theme Color

Solid color as template primary color

add vAPP pre-defined class to the <body> elements to apply the theme.


Code Example


                                                <body class="theme-green">
                                        

Gradient color as template primary color

add vAPP pre-defined class to the <body> elements to apply the theme.


Code Example


                                                        <body class="theme-gradient-1">
                                                

Box Layout Options

Change page layout to Boxed Layout

add vAPP pre-defined class to the <body> elements to apply the theme.


Code Example


                                                <body class="boxed-layout">
                                        

Boxed Layout with Pattern

add vAPP pre-defined class to the <body> elements to apply the theme.


Code Example


                                                        <body class="theme-green boxed-layout circles-light">
                                                    

CSS Class Reference

Solid Color Option

You can apply either solid color or gradient color at a time. Gradient and Solid color won't work at the same time.

More information avilable in the customization page


.theme-green
.theme-blue
.theme-orange
.theme-violet
.theme-orange-light
.theme-firoza
Gradient Color Option

You can apply either solid color or gradient color at a time. Gradient and Solid color won't work at the same time.


.theme-gradient-1
.theme-gradient-2
.theme-gradient-3
.theme-gradient-4
.theme-gradient-5
.theme-gradient-6
Pattern Options

You must have to set layut as boxed-layout to apply the pattern


.circle-pattern
.circle-light
.leaf-pattern
.memphis-pattern
.round-pattern
.spiration-light
.swirl-light
.tic-tac-toe-pattern
.x-pattern
.hexagon
.curls
.darkness
.spiration-dark
.zig-zag-wool