Portal et Rendu Overlay Angular | ng-hub-ui-portal
Bibliothèque portal pour Angular permettant le rendu dynamique de composants, templates et overlays en dehors de l'arbre DOM actuel avec contrôle du positionnement.
Styles
Variables CSS
Personnalisez chaque pixel avec 15 variables CSS. Remplacez-les au niveau de :root ou limitez-les à un conteneur.
Variables de base du portail
Variables de style principales pour la structure et le positionnement du portal.
| Variable | Par défaut | Type | Description |
|---|---|---|---|
--portal-zindex | 1050 | number | Z-index de la superposition du portal. |
--portal-padding | 1rem | length | Marge intérieure par défaut du contenu du portal. |
--portal-margin | 0.5rem | length | Marge autour de la boîte de dialogue du portal. |
Apparence du portail
Variables contrôlant les couleurs, les bordures et les effets visuels du portal.
| Variable | Par défaut | Type | Description |
|---|---|---|---|
--portal-bg | #ffffff | color | Couleur d'arrière-plan du contenu du portal. |
--portal-color | #212529 | color | Couleur du texte du contenu du portal. |
--portal-border-color | #dee2e6 | color | Couleur de la bordure du portal. |
--portal-border-width | 1px | border | Épaisseur de la bordure du portal. |
--portal-border-radius | 0.375rem | border | Rayon des angles du portal. |
--portal-box-shadow | 0 0.5rem 1rem rgba(0, 0, 0, 0.15) | shadow | Ombre portée pour l'élévation du portal. |
En-tête et pied de page du portail
Variables de style pour les sections d'en-tête et de pied de page du portal.
| Variable | Par défaut | Type | Description |
|---|---|---|---|
--portal-header-padding | 1rem | length | Marge intérieure de l'en-tête du portal. |
--portal-header-border-color | #dee2e6 | color | Couleur de la bordure de l'en-tête du portal. |
--portal-footer-padding | 1rem | length | Marge intérieure du pied de page du portal. |
--portal-footer-border-color | #dee2e6 | color | Couleur de la bordure du pied de page du portal. |
Arrière-plan et superposition
Variables contrôlant l'apparence et le comportement du backdrop.
| Variable | Par défaut | Type | Description |
|---|---|---|---|
--portal-backdrop-bg | rgba(0, 0, 0, 0.5) | color | Couleur d'arrière-plan du backdrop du portal. |
--portal-backdrop-zindex | 1040 | number | Z-index du backdrop (doit être inférieur au z-index du portal). |