Estilos

Puede aplicar estilos a componentes individuales dentro de las aplicaciones mediante el componente UDStyle. Este componente deberá añadirse a su panel y forma parte de los componentes básicos incluidos con PowerShell Universal.

Aplicar un estilo

Para aplicar un estilo a un componente o a un conjunto de componentes, llame al cmdlet New-UDStyle, especifique un estilo CSS y, a continuación, incluya los componentes a los que desea aplicar el estilo dentro del bloque de script -Content.

New-UDStyle -Style '
    padding: 32px;
    background-color: hotpink;
    font-size: 24px;
    border-radius: 4px;
    &:hover {
      color: white;
    }
    .MuiCardHeader-root {
        background-color: green !important;   
    }
    .MuiCardContent-root {
        background-color: green !important;   
    }' -Content {
        New-UDCard -Title 'Test' -Content {
            "Hello"
        }
    }

Tarjeta con UDStyle

Sobrescribir estilos integrados

Cada componente de Material UI tiene un conjunto de clases integradas que puede sobrescribir mediante New-UDStyle. Para determinar los nombres de clase que necesita sobrescribir, puede consultar la documentación de la API del componente que intenta modificar en el sitio de Material UI. Por ejemplo, aquí tiene un listado de los nombres de clase CSS del componente Alert.

Al utilizar una alerta de éxito, se aplicará la clase .MuiAlert-standardSuccess a su componente. Puede sobrescribir este estilo predeterminado de la siguiente manera.

New-UDStyle -Style '.MuiAlert-standardSuccess { background-color: red !important;  }  ' -Content {
    New-UDAlert -Text "Hello"
}

La alerta resultante será roja en lugar del verde predeterminado.

Alerta con fondo rojo