Difference between revisions of "CSS built-in classes"
From Lianjapedia
Yvonne.milne (Talk | contribs) (→Classes) |
Yvonne.milne (Talk | contribs) (→Classes) |
||
Line 28: | Line 28: | ||
!width="100%"|Class | !width="100%"|Class | ||
|- | |- | ||
− | |valign="top"| | + | |valign="top"|alert |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|alert-danger |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|alert-dark |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|alert-info |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|alert-light |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|alert-primary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|alert-secondary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|alert-success |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|alert-warning |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|badge |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|badge-danger |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|badge-dark |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|badge-info |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|badge-light |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|badge-pill |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|badge-primary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|badge-secondary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|badge-success |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|badge-warning |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-black |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-blue |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-cyan |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-danger |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-dark |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-gray |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-gray-dark |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-green |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-indigo |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-info |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-light |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-orange |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-pink |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-primary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-purple |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-red |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-secondary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-success |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-teal |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-transparent |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-warning |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-white |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|bg-yellow |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border-0 |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border-bottom-0 |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border-danger |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border-dark |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border-info |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border-left-0 |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border-light |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border-primary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border-right-0 |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border-secondary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|border-success |
+ | |- | ||
+ | |valign="top"|border-top-0 | ||
+ | |- | ||
+ | |valign="top"|border-warning | ||
+ | |- | ||
+ | |valign="top"|boxshadow | ||
+ | |- | ||
+ | |valign="top"|btn | ||
+ | |- | ||
+ | |valign="top"|btn-danger | ||
|- | |- | ||
|valign="top"|btn-dark | |valign="top"|btn-dark | ||
|- | |- | ||
− | |valign="top"| | + | |valign="top"|btn-default |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|btn-info |
+ | |- | ||
+ | |valign="top"|btn-lg | ||
+ | |- | ||
+ | |valign="top"|btn-light | ||
|- | |- | ||
|valign="top"|btn-link | |valign="top"|btn-link | ||
|- | |- | ||
− | |valign="top"| | + | |valign="top"|btn-md |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|btn-primary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|btn-secondary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|btn-sm |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|btn-success |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|btn-warning |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|btn-xs |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|dropshadow |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|dropshadowleft |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|dropshadowright |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|flatbtn |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|flatbtnlast |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|font-italic |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|font-weight-bold |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|font-weight-light |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|font-weight-normal |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|h1 |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|h2 |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|h3 |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|h4 |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|h5 |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|h6 |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|label |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|label-big |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|label-danger |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|label-default |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|label-info |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|label-medium |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|label-primary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|label-success |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|label-warning |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|mdc-textfield |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|noborder |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-0 |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-big |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-bottom |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-bottom-big |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-bottom-medium |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-circle |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-left |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-left-big |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-left-medium |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-medium |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-right |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-right-big |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-right-medium |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-top |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-top-big |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|rounded-top-medium |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|shadow |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-blue |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-center |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-cyan |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-danger |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-dark |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-gray |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-gray-dark |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-green |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-indigo |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-info |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-left |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-light |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-orange |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-pink |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-primary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-purple |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-red |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-right |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-secondary |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-success |
|- | |- | ||
− | |valign="top"| | + | |valign="top"|text-teal |
+ | |- | ||
+ | |valign="top"|text-warning | ||
+ | |- | ||
+ | |valign="top"|text-white | ||
+ | |- | ||
+ | |valign="top"|text-yellow | ||
+ | |- | ||
+ | |valign="top"|well | ||
+ | |- | ||
+ | |valign="top"|well-lg | ||
+ | |- | ||
+ | |valign="top"|well-sm | ||
|- | |- | ||
|} | |} | ||
+ | |||
[[Category:Page Builder]] | [[Category:Page Builder]] | ||
Line 295: | Line 322: | ||
[[Category:SectionAnatomy]] | [[Category:SectionAnatomy]] | ||
[[Category:Lianja v9.1]] | [[Category:Lianja v9.1]] | ||
+ | [[Category:Lianja v9.4]] |
Revision as of 05:55, 11 January 2024
Contents
See Also
Overview
Lianja CSS has built-in support for common bootstrap classes, e.g. btn, btn-success, btn-warning, btn-danger. The full list is defined below.
Using these classes provides you with the ability to standardise on colors and the general UI appearance in your Apps.
Usage
The CSS classes can be specified in the Page Builder Assistant or in the advanced level Attributes.
You can combine classes by separating them with a space, e.g.
btn btn-success
You can override individual attributes like this:
btn btn-success;background-color:lightgreen;...
Classes
The following Boostrap classes are built into Lianja Desktop, Web and Mobile:
Class |
---|
alert |
alert-danger |
alert-dark |
alert-info |
alert-light |
alert-primary |
alert-secondary |
alert-success |
alert-warning |
badge |
badge-danger |
badge-dark |
badge-info |
badge-light |
badge-pill |
badge-primary |
badge-secondary |
badge-success |
badge-warning |
bg-black |
bg-blue |
bg-cyan |
bg-danger |
bg-dark |
bg-gray |
bg-gray-dark |
bg-green |
bg-indigo |
bg-info |
bg-light |
bg-orange |
bg-pink |
bg-primary |
bg-purple |
bg-red |
bg-secondary |
bg-success |
bg-teal |
bg-transparent |
bg-warning |
bg-white |
bg-yellow |
border |
border-0 |
border-bottom-0 |
border-danger |
border-dark |
border-info |
border-left-0 |
border-light |
border-primary |
border-right-0 |
border-secondary |
border-success |
border-top-0 |
border-warning |
boxshadow |
btn |
btn-danger |
btn-dark |
btn-default |
btn-info |
btn-lg |
btn-light |
btn-link |
btn-md |
btn-primary |
btn-secondary |
btn-sm |
btn-success |
btn-warning |
btn-xs |
dropshadow |
dropshadowleft |
dropshadowright |
flatbtn |
flatbtnlast |
font-italic |
font-weight-bold |
font-weight-light |
font-weight-normal |
h1 |
h2 |
h3 |
h4 |
h5 |
h6 |
label |
label-big |
label-danger |
label-default |
label-info |
label-medium |
label-primary |
label-success |
label-warning |
mdc-textfield |
noborder |
rounded |
rounded-0 |
rounded-big |
rounded-bottom |
rounded-bottom-big |
rounded-bottom-medium |
rounded-circle |
rounded-left |
rounded-left-big |
rounded-left-medium |
rounded-medium |
rounded-right |
rounded-right-big |
rounded-right-medium |
rounded-top |
rounded-top-big |
rounded-top-medium |
shadow |
text-blue |
text-center |
text-cyan |
text-danger |
text-dark |
text-gray |
text-gray-dark |
text-green |
text-indigo |
text-info |
text-left |
text-light |
text-orange |
text-pink |
text-primary |
text-purple |
text-red |
text-right |
text-secondary |
text-success |
text-teal |
text-warning |
text-white |
text-yellow |
well |
well-lg |
well-sm |