Paleta de Colores

La gama de colores de la interfaz de la aplicación objetivo puede ser definida usando el objeto JSON cssStyles. Este elemento no es obligatorio y en el caso de que no se proporcione el generador Duende aplicará una gama por defecto.

La estructura del elemento cssStyles es la siguiente:

{

    ...

    "cssStyles": {

        "cssBgColorMenu": "color de fondo de la barra de menú",
        "cssColorMenu": "color del texto para los elementos del menú",
        "cssColorMenuHover": "color para los enlaces en estado hover del menú",
        "cssColorMenuActive": "color para los enlaces en estado activo del menú",
        "cssBgColorScreenTitles": "color de fondo para los títulos de las pantallas",
        "cssBgColorStandardButton": "color de fondo para los botones",
        "cssColorStandardButton": "color del texto para los botones",
        "cssBgColorStandardButtonHover": "color de fondo para los botones en estado hover",
        "cssColorStandardButtonHover": "color del texto para los botones en estado hover",
        "cssColorLightLink": "color para enlaces claros",
        "cssColorLightLinkHover": "color para enlaces claros en estado hover",
        "cssBackgroundColorForm": "color de fondo para formularios",
        "cssShadowForm": "color para la sombra de formularios",
        "cssColorSubtle": "color para elementos sutiles",
        "cssCompressedScreen": ¿comprimir la pantalla?
    },
    ...

}

Para facilitar la configuración de los colores de la interfaz se proporcionan paletas de colores predefinidas (Temas). Puede consultar estas plantillas de colores en el apartado Temas.

cssBgColorMenu

Valor: Color de fondo de la barra de menú

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: #0E415B

Use este elemento para indicar un color HTML válido de fondo para la barra de menú.

cssColorMenu

Valor: Color del texto para los elementos del menú

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: white

Use este elemento para indicar un color HTML válido para los elementos de la barra de menú.

cssColorMenuHover

Valor: Color para los enlaces en estado hover del menú

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: lightgray

Use este elemento para indicar un color HTML válido para los enlaces de la barra de menú cuando el puntero se posa encima (estado hover)

cssColorMenuActive

Valor: Color para los enlaces en estado activo del menú

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: #9FC4C6

Use este elemento para indicar un color HTML válido para el enlace de la opción que está activa en el momento.

cssBgColorScreenTitles

Valor: Color de fondo para los títulos de las pantallas

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: #187489

Use este elemento para indicar un color HTML válido para el fondo de los títulos de cada pantalla.

cssBgColorStandardButton

Valor: Color de fondo para los botones

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: #187489

Use este elemento para indicar un color HTML válido para el fondo de los botones.

cssColorStandardButton

Valor: Color del texto para los botones

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: white

Use este elemento para indicar un color HTML válido para el color de texto de los botones.

cssBgColorStandardButtonHover

Valor: Color de fondo para los botones en estado hover

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: #569FAF

Use este elemento para indicar un color HTML válido para el color de fondo de los botones cuando el puntero los sobrevuela (estado hover)

cssColorStandardButtonHover

Valor: Color del texto para los botones en estado hover

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: white

Use este elemento para indicar un color HTML válido para el color del texto de los botones cuando el puntero los sobrevuela (estado hover)

cssColorLightLink

Valor: Color para enlaces claros

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: white

Use este elemento para indicar un color HTML válido para el color de los enlaces claros.

cssColorLightLinkHover

Valor: Color para enlaces claros en estado hover

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: #DBE5E5

Use este elemento para indicar un color HTML válido para el color de los enlaces claros cuando los sobrevuela el puntero (estado hover)

cssBackgroundColorForm

Valor: Color de fondo para formularios

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: #DBE5E5

Use este elemento para indicar un color HTML válido para el color de fondo de los formularios.

cssShadowForm

Valor: Color para la sombra de formularios

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: rgba(229, 103, 23, 0.075)

Use este elemento para indicar un color HTML válido para la sombra de los formularios.

cssColorSubtle

Valor: Color para elementos sutiles

Tipo de datos: cadena de texto

Requerido: No

Valor por Defecto: gray

Use este elemento para indicar un color HTML válido para elementos sutiles.

cssCompressedScreen

Valor: ¿Comprimir la pantalla?

Tipo de datos: boolean

Requerido: No

Valor por Defecto: false

Si se activa este elemento, la aplicación resultante intentará aprovechar la pantalla al máximo, para mostrar la mayor cantidad de información posible. Esto se conseguirá disminuyendo el tamaño de la letra, los botones y otros elementos, así como reduciendo márgenes externos e internos de los distintos elementos.

Se recomienda usar esta opción si la aplicación tiene tablas con muchos datos. También puede ser interesante usarla junto con elementos similares de las Opciones Generales como goCompressedForm o goCompressedView.