Benutzerdefiniertes CSS

gehostete und veröffentlichte spaces können mithilfe von css angepasst werden ihre css änderungen werden nur auf ihrer benutzerdefinierten domain angewendet wenn sie ihren veröffentlichten space in der vorschau anzeigen, sind sie nicht sichtbar, daher müssen sie ihn in die production veröffentlichen wählen sie einen space und klicken sie auf das einstellungen symbol ( ⚙️ ), um die bereichseinstellungen suchen sie im fenster space settings nach dem reiter benutzerdefinierter code gehen sie zum feld benutzerdefiniertes css geben sie die html \<style> tags ein speichern sie ihre änderungen im custom css feld \<style> / add the css clases and the properties you want to change / \</style> aus sicherheitsgründen wird benutzerdefinierter code nur auf einer benutzerdefinierten domain einbezogen im gesamten dom finden sie html elemente mit einer css klasse, die mit ab beginnt sie können diese klassen anvisieren, um das portal zu gestalten diese klassen werden garantiert niemals geändert, damit ihre anpassungen bei systemaktualisierungen nicht brechen wenn das element, das sie gestalten möchten, keine mit ab beginnende klasse hat, erlauben wir keine anpassung dies dient überwiegend ihrem eigenen schutz wenn wir zum beispiel die struktur ändern, könnte dies ihre gestaltung beeinträchtigen jedes element und jeder block im inhaltsbereich hat ebenfalls eine ähnliche klasse unten finden sie eine liste dieser klassen wenn sie sie prüfen möchten, öffnen sie die devtools in ihrem browser per rechtsklick → inspect dies ist eine liste der aktuell verfügbaren css klassen 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 { } ab windy template { } ab color nav template { } ab booklet template { } openapi css klassen 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 { } breadcrumbs klassen ab breadcrumb item { } jedes breadcrumb label ab breadcrumb item clickable { } breadcrumb, das zum navigieren anklickbar ist ab breadcrumb item highlight { } das aktuell aktive/hervorgehobene breadcrumb ab breadcrumb separator { } das chevron symbol zwischen breadcrumbs ab breadcrumbs wrapper { } der container um die gesamte breadcrumb leiste ab breadcrumb ellipsis { } das " " bei zu vielen breadcrumbs der dark mode fügt eine dark klasse an der spitze des html baums hinzu, und sie können diese verwenden, um dark mode stile zuzuweisen zum beispiel können sie so den text im dark mode auf rot ändern \<style> dark ab paragraph { color red !important ; } \</style>