CSS

La aplicación le permite establecer sus propios CSS (hojas de estilo en cascada) para aplicarlos en la interfaz de usuario.

Los CSS se muestran en una estructura de tabla.

Name Context Active Actions

Crear un nuevo CSS

En la parte superior derecha, haga clic en el icono New CSS.
Rellene los campos.
- Name.
- Context: las opciones disponibles son frontend o mobile.
- Active.
Haga clic en el botón Create.

Editar un CSS

Haga clic en Edit metadata.
Modifique los campos.
Haga clic en el botón Edit.

Eliminar un CSS

Haga clic en el icono Delete CSS .
Haga clic en el botón Delete.

Clonar un CSS

Haga clic en el icono Clone CSS .
Modifique los campos.
Haga clic en el botón Clone.

Descargar un CSS

Haga clic en el icono Download CSS .
Pasados unos segundos, se descargará un archivo CSS.

Ejemplos

Ejemplos de la interfaz clásica (frontend)

Ejemplo de fuente grande

body, td, a, p, div, input, input.submit , textarea, select, button{
  font-family: Tahoma, Arial, Helvetica, sans-serif;
  font-size: 13px;
}

.gwt-MenuItem, .okm-TopMenuBar .gwt-MenuItem-selected, .okm-Input, .okm-TextArea, .okm-Select {
  font-family: Tahoma, Arial, Helvetica, sans-serif;
  font-size: 13px;
}

.okm-Popup .Caption, .okm-Popup-Error .Caption, .okm-Image-Popup .Caption {
  font-family: Tahoma, Arial, Helvetica, sans-serif;
  font-size: 15px;
}

Ejemplo de fuente mediana

body, td, a, p, div, input, input.submit , textarea, select, button{
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
}

.gwt-MenuItem, .okm-TopMenuBar .gwt-MenuItem-selected, .okm-Input, .okm-TextArea, .okm-Select {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
}

.okm-Popup .Caption, .okm-Popup-Error .Caption, .okm-Image-Popup .Caption {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
}

Ejemplo de fuente por defecto

body, td, a, p, div, input, input.submit , textarea, select, button{
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
}

.gwt-MenuItem, .okm-TopMenuBar .gwt-MenuItem-selected, .okm-Input, .okm-TextArea, .okm-Select {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
}

.okm-Popup .Caption, .okm-Popup-Error .Caption, .okm-Image-Popup .Caption {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
}

Ejemplos de la nueva interfaz (KCenter)

Ejemplo de fuente grande

body, td, a, p, div, input, textarea, select, b-tab {
  font-size: 1.2rem !important; // also can be used 14px;
  font-weight: 400; // Standard weight
}

Ejemplo de fuente mediana

body, td, a, p, div, input, textarea, select, b-tab {
  font-size: 1.1rem !important; // also can be used 13px;
  font-weight: 400; // Standard weight
}

Ejemplo en árabe

/*
 * Notes about some attribute values:
 * font-size: 1.2rem !important;      // Also can be used 14px;
 * font-weight: 400;                  // Standard weight value
*/
body, td, a, p, div, input, textarea, select, b-tab, button, ion-app, ion-menu, ion-header, ion-item, ion-content, ion-footer, ion-label {
  font-size: 1.2rem !important;
  font-weight: 400;
  font-family: "Noto Kufi Arabic" !important;
}

/* Properties */
li, td, th {
  font-size: 1.2rem !important;
}

/* breadcrumb */
li.breadcrumb-item.mt-1 a {
  font-size: 1.2rem !important;
}
#rootNodes div {
  min-height: 35px !important;
}

/* navbar */
#okm-mainMenu .navbar-nav > li.active > a {
  padding-top: 12px !important;
  padding-bottom: 11px !important;
    line-height: unset !important;
}

#okm-mainMenu .navbar-nav > li > a {
  padding-top: 12px !important;
    line-height: unset !important;
}

/* search */
.okm-forceEmptyLabel-topPadding {
  padding-top: 18px !important;
}

/* button */
.btn-group.okm-small-button > button {
  height: 30px !important;
}