Componentes
Theme

Theme

El componente Theme permite gestionar y representar visualmente los temas de la aplicación, utilizando la funcionalidad y componentes proporcionados por fenextjs-svg y fenextjs-hook.

Ejemplo

Importación

Para importar el componente Theme, se puede hacer desde fenextjs

import { Theme } from "fenextjs";

Parámetros

ParámetroTipoRequeridoDefaultDescripcion
classNamestringno''Clase CSS para personalizar el contenedor del componente.
classNameItemstringno''Clase CSS para los elementos dentro del componente.

NOTA

Fenextjs usa por defecto el Tema Automático del Navegador. En caso de que quieras deshabilitar esta funcionalidad sin usar el componente Theme, puedes agregar esta propiedad: data-fenext-prefers-color-scheme-disabled en cualquier etiqueta de HTML.

<body data-fenext-prefers-color-scheme-disabled>
    contenido
</body>
 
//O
 
<body>
    contenido
    <div data-fenext-prefers-color-scheme-disabled/>
</body>

Storybook

Para ver el storybook del componente lo puede hacer con este link (opens in a new tab)

Usos

  • Básico
<Theme />
  • Con clases personalizadas
<Theme className="custom-theme" classNameItem="custom-theme-item" />
TextTitle