Lianja 6.3 introduces UI theming for Web, Tablet and Phone Apps.

The UI theme is specified in CSS.

Name:  Screen Shot 2021-10-20 at 11.18.25 AM.jpg
Views: 130
Size:  108.1 KB


Here is a sample theme file:

Code:
/* Lianja custom theme for Web Apps */


/* page */
.lianja_ui_page
{
	background:beige !important;
}


.lianja_ui_page_header
{
	background:gray !important;
	color:white !important;
}


.lianja_ui_page_navigationpanel
{
	background:transparent !important;
}


.lianja_ui_page_navigationpanel_header
{
	background:darkgray !important;
	color:white !important;
	height:24px;
	text-align:center;
}


.lianja_ui_page_navigationpanel_divider
{
	background:lightgray !important;
	color:black !important;
}


.lianja_ui_page_navigationpanel_item
{
	background:white !important;
	color:black !important;
}


/* section */
.lianja_ui_section
{
	background:beige !important;
}


.lianja_ui_section_header 
{
	background:darkgray !important;
	color:white !important;
	border-bottom:1px solid black;
}


.lianja_ui_section_header a
{
	background:darkgray !important;
	color:white !important;
}


.lianja_ui_section_searchpanel
{
	background:lightgreen;
	color:white;
}


.lianja_ui_section_menu
{
	background:green !important;
	color:yellow !important;
}


.lianja_ui_section_footer
{
	background:pink;
	color:white;
}


/* form */
.lianja_ui_section_form
{
}


.lianja_ui_section_formitem
{
	border-bottom:1px solid wheat !important;
}


.lianja_ui_section_formitem_label
{
	background:beige !important;
	color:black !important;
}


.lianja_ui_section_formitem_data
{
	background:beige !important;
	color:black !important;
}


/* grid */
.lianja_ui_section_grid
{
	font-size:larger;
}


.lianja_ui_section_grid_heading
{
	height:30px !important;
}


.lianja_ui_section_grid_menubar
{
	background:lightgray;
	color:white;
	border-bottom:1px solid gray;
}


.lianja_ui_section_grid_container
{
	top:60px !important;
}


.lianja_ui_section_grid_row
{
	height:30px;
}


.lianja_ui_section_grid_cell
{
}


.lianja_ui_section_grid_summary
{
}


.lianja_ui_section_grid_actionbar
{
	background:white !important;
}
And the resultant Web App.

Name:  Screen Shot 2021-10-20 at 11.13.04 AM.jpg
Views: 140
Size:  81.5 KB

Changing the theme changes the UI appearance without needing any code changes. So if you want to increase fonts or change the color scheme just specify a CSS theme.