Naar de hoofdinhoud

Selectoren - aanpassen template via CSS

Vandaag bijgewerkt

Voor de gevanceerde klant: je kunt templates aanpassen door selectoren te gebruiken. Hieronder vind je een lijst met alle selectoren die je kunt gebruiken:

Main Container Selectors

.kt-portlet /* Main wrapper */

.kt-portlet__body /* Body wrapper */

.kt-portlet__body--fit /* Body modifier */
.kt-invoice-2 /* Invoice container */

.kt-invoice__body /* Invoice body */

.kt-invoice__container /* Content container */

Room/Furniture List Selectors

.kt-invoice__rooms /* Rooms container */

.kt-invoice__room /* Individual room block */

.kt-invoice__room h4 /* Room name/title */

.kt-invoice__room h6 /* Cubic meter info */

.kt-invoice__room ul /* Furniture/inventory lists */

.kt-invoice__room ul.list-unstyled /* Unstyled lists */

Service Icons Selectors

.kt-pull-right /* Right-aligned icons container */

.fak.fa-assemble /* Assembly icon */

.fak.fa-disassemble /* Disassembly icon */

.fal.fa-warehouse /* Storage icon */

.kt-font-success /* Green/active state */

.kt-font-grey /* Grey/inactive state */

Footer/Legend Selectors

.kt-invoice__footer /* Footer section */

.kt-invoicefooter .kt-invoicecontainer /* Footer container */

Specific Targeting Examples

/* Target room furniture items */

.kt-invoice__room ul:last-child li

/* Target inventory items */

.kt-invoice__room ul:first-of-type li

/* Target service icons in furniture items */

.kt-invoice__room li .kt-pull-right i

/* Target active services */

.kt-invoice__room .kt-font-success

/* Target room headers */

.kt-invoice__room > h4

Was dit een antwoord op uw vraag?