Hiboutik : Configure CSS

Configure CSS

In 'Settings/Users/Access management', enable the right:
'Manage CSS spreadsheet'

In 'Settings/General settings/CSS', you can enter CSS code that will replace the existing CSS code of your account.

More specifically, you can also provide CSS rules to the user in 'Settings/Users/Users' (field 'CSS').

Find below some examples of CSS code :

Goal	Code
Customize the design (ex: change left menu colors)	.nav-header {<br>background: #000000;<br>}<br>body{<br>background-color: #000000;<br>}<br>nav #side-menu li.active {<br>border-left: 4px solid #fff8c00;<br>background: #808080;<br>}<br>.navbar-default .nav > li > form.input_nav:hover {<br>background-color: #808080;<br>}<br>.btn-primary, .btn-info {<br>background-color: #FFFFFF;<br>border-color: #000000;<br>color: #000000;<br>}
Change size of product keys	.bt_express {<br>width: 10%;<br>}
Hide some data fields (ex: delete the Expiry date field when creating a customer in a sale)	#validite_client_modif_vente_tr<br>{display: none;<br>}
Set the ticket height on the sales interface	.vente_liste_produits {<br>overflow-y: scroll;<br>max-height: 20em;<br>}
Rename button labels (ex : Next 1 in Starters)	#btn_ordo_2 span {<br>display: none;<br>}<br>#btn_ordo_2:after {<br>content: 'Entrées';<br>}