Design

Mit der Funktion "Design"

 

icon admin design

 

können Sie das Portal an Ihre Wünsche und ggf. an Ihr "Corporate Design" anpassen. Sie können das Logo anpassen und entweder zwischen vordefinierten Themes wählen oder Ihr eigenes Theme erstellen und nutzen.

 

hint

Das Logo kann eine maximale Größe von 250 Pixel x 70 Pixel haben. Größere Bilder werden entsprechend skaliert.

 

dialog admin design

 

hint

Nach der Änderung dieser Optionen wird ein Neustart benötigt.

 

Beispiel Theme:

 

/* general defninition */
html {
  font-family: sans-serif !important;
  line-height: 1.15 !important;
  font-size: 10px !important;
}
 
body {
  background-color: #fff !important;
}
 
#footer {
  background-color: rgba(0, 0, 0, 0.25) !important;
}
 
/* dialog defninition */
.dialog-header {
  background-color: #d9d9d9 !important;
  border-color: #bbb !important;
}
 
.dialog-body {
  background-color: #fff !important;
}
 
.dialog-footer {
  background-color: #e6e6e6 !important;
  border-color: #ddd !important;
}
 
/* button defninition */
.button:hover {
  background-color: #fff3c8 !important;
}
 
.button.active {
  background-color: #ffdb62 !important;
}
 
.btn-primary {
  background-color: #ffdb62 !important;
  border-color: #c89b00 !important;
}
 
.btn-primary:hover {
  background-color: #fff3c8 !important;
  border-color: #8b6b00 !important;
}
 
.btn-default {
  background-color: #fff !important;
  border-color: #ccc !important;
}
 
.btn-default:hover {
  background-color: #fff3c8 !important;
  border-color: #adadad !important;
}
 
.button-sidebar {
  background: #eee !important;
  border-color: #666 !important;
}
 
.button-sidebar:hover {
  background: #fff3c8 !important;
}
 
/* toolbar definition */
.toolbar-gradient {
  background: linear-gradient(to bottom, #f0f0f0 0%, #ebebeb 50%, #d9d9d9 100%) !important;
  border-color: #bbb !important;
}
 
.toolbar-gradient.is-vertical {
  background: linear-gradient(to right, #fafafa 0%, #F5F5F5 50%, #e8e8e8 100%) !important;
  border-color: #bbb !important;
}
 
/* panel definition */
.panel {
  border-color: #bbb !important;
}
 
.panel-heading {
  background: linear-gradient(to bottom, #fafafa 0%, #f0f0f0 100%) !important;
  border-color: #bbb !important;
}
 
.panel-body {
  background: #fff !important;
}
 
/* media-list definition */
.media-list-header {
  background: linear-gradient(to bottom, #fafafa 0%, #f0f0f0 100%) !important;
}
 
.media > .data {
  background: #fff !important;
}
 
.media.is-selected > .data {
  background: #ffdb62 !important;
}