Custom CSS

los spaces alojados y publicados pueden personalizarse usando css tus cambios de css solo se incluirán en tu dominio personalizado cuando visualices tu space publicado, no serán visibles, por lo que necesitas publicarlo en producción elige un space y haz clic en el settings (configuración) ( ⚙️ ) para abrir los space settings busca la pestaña custom code en la ventana de configuración del space ve al campo custom css escribe las etiquetas html \<style> guarda tus cambios en el campo custom css \<style> / add the css clases and the properties you want to change / \</style> por razones de seguridad, el código personalizado solo se incluye en un dominio personalizado en todo el dom, encontrarás elementos html con una clase css que comienza con ab puedes dirigirte a estas clases para diseñar el portal estas clases están garantizadas a no cambiar nunca para que no rompamos tu diseño cuando actualicemos el sistema si el elemento que intentas estilizar no tiene una clase que comience con ab , no permitimos la personalización, y es principalmente para protegerte de ti mismo por ejemplo, si cambiamos la estructura, podría afectar tu diseño cada elemento y bloque en la sección de contenido también tiene una clase similar a continuación puedes encontrar una lista de las clases si deseas revisarlas, abre las devtools en tu navegador haciendo clic derecho > inspeccionar esta es una lista de las clases css disponibles ab callout { } ab changeloc { } ab code editor { } ab minitasker { } ab graphiql { } ab horizontal divider { } ab jira { } ab map { } ab mermaid { } ab vertical split { } ab vertical split item { } ab video { } ab checklist { } ab blockquote { } ab diagram { } ab embed { } ab file { } ab iframe { } ab html { } ab image { } ab ul list { } ab ol list { } ab list item { } ab list item child { } ab table { } ab space { } ab collection { } ab space container { } ab collection container { } ab top navbar { } ab search input { } ab public search { } ab space content { } ab collection content { } ab tree navigation { } ab tree navigation link { } ab left nav chevron { } ab tree navigation link inactive { } ab space navigation { } ab doc name { } ab h1 { } ab h2 { } ab h3 { } ab expandable heading { } ab link { } ab link dynamic { } ab nav right { } ab nav right text { } ab bold { } ab code { } ab paragraph { } ab footer container { } ab search modal header { } ab search modal content { } ab auth jwt button { } ab auth saml button { } openapi clases css ab openapi { } ab open api param name { } ab open api param expand icon { } ab open api param type { } ab open api param description wrap { } ab open api param example wrap { } ab open api param custom type { } ab open api required star { } ab open api param example title { } ab open api param example { } ab open api param description title { } ab open api param description { } ab open api input wrap { } ab open api array input wrap { } ab open api schema wrap { } el modo oscuro añade una clase dark en la parte superior del árbol html, y puedes usarla para aplicar estilos específicos para el modo oscuro por ejemplo, así es como cambias el texto a rojo en modo oscuro \<style> dark ab paragraph { color red !important ; } \</style>