Section CSS

The styling of section will be written in the file style.css, located in the directory of the section.

All of css in this file style.css will be add the section prefix, so you can only write style for elements in the current section. 
Import css vendors 
If you need importing css vendors like font icons, you can do it in the @schema of section.lh 
section.lh
@schema
{
	"name"		: "Section Name",
	"author"	: "LayoutHub",
	"website"	: "https://www.LayoutHub.com",
	"version"	: "1.0",
	"vendors"	: [
		"icons/fa-solid.css"
	]
}
@endschema
Using variables 
Syntax
Description
%url%
The url of section to using image or import media
var(--lh-)
The theme color from theme settings
var(--lh-font-family)
The font family name from theme settings
var(--lh-font-size)
The font size from theme settings
var(--lh-title-font-family)
The font family of title from theme settings
rgba(var(--lh-color-rgb), 0.5);
Reduct the alpha value of color using RGBA 
Example 
style.css
button.sty2 {
    background: var(--lh-color);
    color: #fff;
}

button.sty2:hover {
    background: rgba( var(--lh-color-rgb), 0.5 );
    color: #fff;
}

Development - Previous

Javascript in section

Next - Development

Last updated 8 months ago

Syntax	Description
%url%	The url of section to using image or import media
var(--lh-)	The theme color from theme settings
var(--lh-font-family)	The font family name from theme settings
var(--lh-font-size)	The font size from theme settings
var(--lh-title-font-family)	The font family of title from theme settings
rgba(var(--lh-color-rgb), 0.5);	Reduct the alpha value of color using RGBA