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 1 year 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