KKeine Bearbeitungszusammenfassung |
KKeine Bearbeitungszusammenfassung |
||
Zeile 62: | Zeile 62: | ||
} | } | ||
.d-flex { | |||
display: flex; | |||
} | |||
.display__inline-flex { | |||
display: inline-flex; | |||
} | |||
/*** Schriftgrößen ***/ | |||
.em1 { | .em1 { | ||
font-size: 1em; | font-size: 1em; | ||
Zeile 74: | Zeile 84: | ||
} | } | ||
. | /*** Ende Schriftgrößen *** | ||
/*** Hintergrundfarben ***/ | |||
.UTM.bc__gruen, | |||
.UTM.bc__grün, | |||
.UMA.bc__gruen, | |||
.UMA.bc__grün { | |||
background-color: #468847; | |||
} | |||
.MS.bc__gruen, | |||
.MS.bc__grün { | |||
background-color: #2DCC71; | |||
} | |||
.UTM.bc__rot, | |||
.UMA.bc__rot { | |||
background-color: #ec7063; | |||
} | |||
.MS.bc__rot { | |||
background-color: #E74C3C; | |||
} | |||
.UTM.bc__grau { | |||
background-color: rgb(153, 153, 153); | |||
} | |||
.UMA.bc__grau { | |||
background-color: #555555; | |||
} | |||
.MS.bc__grau { | |||
background-color: #cccccc; | |||
} | |||
.bc__dgrau { | |||
background-color: rgb(51, 51, 51); /* Log-Einträge UTM, */ | |||
} | |||
.bc__hgrau { | |||
background-color: rgba(0, 0, 0, 0.05); /* Status-Meldungen */ | |||
} | |||
.bc__grau-app { | |||
background-color: #c1cbce; /* Graue Balken in der Android-App */ | |||
} | |||
.bc__grau-s { | |||
background-color: #55676d; /* Graue Schrift in Android-App */ | |||
} | |||
.bc__grau-b { | |||
background-color: #878a90; /* Graue Buttons in Android-App */ | |||
} | |||
.bc__blau { | |||
background-color: rgb(58, 135, 173); /* Zonen, Bereiche */ | |||
} | |||
.bc__hblau, .bc__hell-blau { | |||
background-color: #00bcd4; /* Geblockte Anfragen */ | |||
} | |||
.bc__macos-blau { | |||
background-color: #257bfe; /* Schaltflächen in MacOS */ | |||
} | |||
.bc__rots { | |||
background-color: rgba(231,76,60, 0.7); /* Symbole in rot */ | |||
} | |||
.bc__rotaus { | |||
background-color: #B94A48; /* verwendet für deaktivierte Buttons in UTM */ | |||
} | |||
.bc__orange { | |||
background-color: #ff5722; /* verwendet für Warnungen in Statistik */ | |||
} | |||
.bc__ddgrau { | |||
background-color: #484c53; /* Graue Ränder */ | |||
} | |||
.bc__rotr { | |||
background-color: #e43725; /* verwendet für Border von Schaltflächen */ | |||
} | |||
.bc__rotbd { | |||
background-color: #d62c1a; /* verwendet für Border von Hinweisen */ | |||
} | |||
.bc__rot-cb { | |||
background-color: #ef8b80; /* verwendet für Border von Clickboxen */ | |||
} | |||
.bc__white-lbd { | |||
background-color: rgba(255, 255, 255, 0.1); /* verwendet für weiße Ränder */ | |||
} | |||
.bc__gelbbd { | |||
background-color: #ec971f; /* Border gelbe Felder */ | |||
} | } | ||
. | .bc__grünbd { | ||
background-color: #24a25a; /* Border grüne Felder */ | |||
} | } | ||
.bc__r { | .bc__r, .bc__warnung { | ||
background-color: #d71e0b; | background-color: #d71e0b; /* rot */ | ||
} | } | ||
.bc__gr { | .bc__gr, .bc__positiv { | ||
background-color: rgb(2,90,0); | background-color: rgb(2,90,0); /* grün */ | ||
} | } | ||
.bc__g { | .bc__g, .bc__hinweis { | ||
background-color: rgb(255,200,0); | background-color: rgb(255,200,0); /* gelb */ | ||
} | } | ||
.bc__b { | .bc__b { | ||
background-color: rgb(2,100,130); | background-color: rgb(2,100,130); /* blau */ | ||
} | } | ||
Zeile 110: | Zeile 224: | ||
} | } | ||
.UTM. | /*** Ende Hintergrund-Farben ***/ | ||
.UTM. | |||
.UMA. | |||
.UMA. | |||
/*** Beginn Schrift-Farbe ***/ | |||
.UTM.font-color__gruen, | |||
.UTM.font-color__grün, | |||
.UMA.font-color__gruen, | |||
.UMA.font-color__grün { | |||
color: #468847; | |||
} | |||
.MS.font-color__gruen, | |||
.MS.font-color__grün { | |||
color: #2DCC71; | |||
} | |||
.UTM.font-color__rot, | |||
.UMA.font-color__rot { | |||
color: #ec7063; | |||
} | |||
.MS.font-color__rot { | |||
color: #E74C3C; | |||
} | |||
.UTM.font-color__grau { | |||
color: rgb(153, 153, 153); | |||
} | } | ||
. | .UMA.font-color__grau { | ||
color: #555555; | |||
} | } | ||
.MS.font-color__grau { | |||
color: #cccccc; | |||
} | |||
Zeile 131: | Zeile 271: | ||
.font-color__grau-l { | .font-color__grau-l { | ||
color: rgba(0, 0, 0, 0.6); | color: rgba(0, 0, 0, 0.6); | ||
} | |||
.font-color__dgrau { | |||
color: rgb(51, 51, 51); /* Log-Einträge UTM, */ | |||
} | |||
.font-color__hgrau { | |||
color: rgba(0, 0, 0, 0.05); /* Status-Meldungen */ | |||
} | |||
.font-color__grau-app { | |||
color: #c1cbce; /* Graue Balken in der Android-App */ | |||
} | |||
.font-color__grau-s { | |||
color: #55676d; /* Graue Schrift in Android-App */ | |||
} | |||
.font-color__grau-b { | |||
color: #878a90; /* Graue Buttons in Android-App */ | |||
} | |||
.font-color__blau { | |||
color: rgb(58, 135, 173); /* Zonen, Bereiche */ | |||
} | |||
.font-color__hblau, .font-color__hell-blau { | |||
color: #00bcd4; /* Geblockte Anfragen */ | |||
} | |||
.font-color__macos-blau { | |||
color: #257bfe; /* Schaltflächen in MacOS */ | |||
} | |||
.font-color__rots { | |||
color: rgba(231,76,60, 0.7); /* Symbole in rot */ | |||
} | |||
.font-color__rotaus { | |||
color: #B94A48; /* verwendet für deaktivierte Buttons in UTM */ | |||
} | |||
.font-color__orange { | |||
color: #ff5722; /* verwendet für Warnungen in Statistik */ | |||
} | |||
.font-color__ddgrau { | |||
color: #484c53; /* Graue Ränder */ | |||
} | |||
.font-color__rotr { | |||
color: #e43725; /* verwendet für Border von Schaltflächen */ | |||
} | |||
.font-color__rotbd { | |||
color: #d62c1a; /* verwendet für Border von Hinweisen */ | |||
} | |||
.font-color__rot-cb { | |||
color: #ef8b80; /* verwendet für Border von Clickboxen */ | |||
} | |||
.font-color__white-lbd { | |||
color: rgba(255, 255, 255, 0.1); /* verwendet für weiße Ränder */ | |||
} | |||
.font-color__gelbbd { | |||
color: #ec971f; /* Border gelbe Felder */ | |||
} | |||
.font-color__grünbd { | |||
color: #24a25a; /* Border grüne Felder */ | |||
} | |||
.font-color__r, .font-color__warnung { | |||
color: #d71e0b; /* rot */ | |||
} | |||
.font-color__gr, .font-color__positiv { | |||
color: rgb(2,90,0); /* grün */ | |||
} | |||
.font-color__g, .font-color__hinweis { | |||
color: rgb(255,200,0); /* gelb */ | |||
} | } | ||
.font-color__b { | .font-color__b { | ||
color: rgb(2,100,130); | color: rgb(2,100,130); /* blau */ | ||
} | } | ||
.font-color__gelb { | |||
color: #f0ad4e;; | |||
} | |||
.UTM.font-color__rot, .UMA.font-color__rot { | |||
color: #ec7063; | |||
} | |||
.MS.font-color__rot { | |||
color: #E74C3C; | |||
} | |||
/*** Ende Schrift-Farbe ***/ | |||
/*** Beginn Border-Farbe ***/ | |||
.UTM.border-color__gruen, | |||
.UTM.border-color__grün, | |||
.UMA.border-color__gruen, | |||
.UMA.border-color__grün { | |||
border-color: #468847; | |||
} | |||
.MS.border-color__gruen, | |||
.MS.border-color__grün { | |||
border-color: #2DCC71; | |||
} | |||
.UTM.border-color__rot, | |||
.UMA.border-color__rot { | |||
border-color: #ec7063; | |||
} | |||
.MS.border-color__rot { | |||
border-color: #E74C3C; | |||
} | |||
.UTM.border-color__grau { | |||
border-color: rgb(153, 153, 153); | |||
} | |||
.UMA.border-color__grau { | |||
border-color: #555555; | |||
} | |||
.MS.border-color__grau { | |||
border-color: #cccccc; | |||
} | |||
.border-color__white-l { | |||
border-color: rgba(255, 255, 255, 0.9); | |||
} | |||
.border-color__grau-l { | |||
border-color: rgba(0, 0, 0, 0.6); | |||
} | |||
.border-color__dgrau { | |||
border-color: rgb(51, 51, 51); /* Log-Einträge UTM, */ | |||
} | |||
.border-color__hgrau { | |||
border-color: rgba(0, 0, 0, 0.05); /* Status-Meldungen */ | |||
} | |||
.border-color__grau-app { | |||
border-color: #c1cbce; /* Graue Balken in der Android-App */ | |||
} | |||
.border-color__grau-s { | |||
border-color: #55676d; /* Graue Schrift in Android-App */ | |||
} | |||
.border-color__grau-b { | |||
border-color: #878a90; /* Graue Buttons in Android-App */ | |||
} | |||
.border-color__blau { | |||
border-color: rgb(58, 135, 173); /* Zonen, Bereiche */ | |||
} | |||
.border-color__hblau, .border-color__hell-blau { | |||
border-color: #00bcd4; /* Geblockte Anfragen */ | |||
} | |||
.border-color__macos-blau { | |||
border-color: #257bfe; /* Schaltflächen in MacOS */ | |||
} | |||
.border-color__rots { | |||
border-color: rgba(231,76,60, 0.7); /* Symbole in rot */ | |||
} | |||
.border-color__rotaus { | |||
border-color: #B94A48; /* verwendet für deaktivierte Buttons in UTM */ | |||
} | |||
.border-color__orange { | |||
border-color: #ff5722; /* verwendet für Warnungen in Statistik */ | |||
} | |||
.border-color__ddgrau { | |||
border-color: #484c53; /* Graue Ränder */ | |||
} | |||
.border-color__rotr { | |||
border-color: #e43725; /* verwendet für Border von Schaltflächen */ | |||
} | |||
.border-color__rotbd { | |||
border-color: #d62c1a; /* verwendet für Border von Hinweisen */ | |||
} | |||
.border-color__rot-cb { | |||
border-color: #ef8b80; /* verwendet für Border von Clickboxen */ | |||
} | |||
.border-color__white-lbd { | |||
border-color: rgba(255, 255, 255, 0.1); /* verwendet für weiße Ränder */ | |||
} | |||
.border-color__gelbbd { | |||
border-color: #ec971f; /* Border gelbe Felder */ | |||
} | |||
.border-color__grünbd { | |||
border-color: #24a25a; /* Border grüne Felder */ | |||
} | |||
.border-color__r, .border-color__warnung { | |||
border-color: #d71e0b; /* rot */ | |||
} | |||
.border-color__gr, .border-color__positiv { | |||
border-color: rgb(2,90,0); /* grün */ | |||
} | |||
.border-color__g, .border-color__hinweis { | |||
border-color: rgb(255,200,0); /* gelb */ | |||
} | |||
.border-color__b { | |||
border-color: rgb(2,100,130); /* blau */ | |||
} | |||
.border-color__gelb { | |||
border-color: #f0ad4e;; | |||
} | |||
.UTM.border-color__rot, .UMA.border-color__rot { | |||
border-color: #ec7063; | |||
} | |||
.MS.border-color__rot { | |||
border-color: #E74C3C; | |||
} | |||
/*** Ende Border-Farbe ***/ |
Version vom 28. Januar 2020, 10:51 Uhr
.Hinweis-Container { /* border: 1px solid red; */ } .Hinweis-Container--icon { display: inline-flex; width: 0; height: 0; font-size: 1em; padding: 0.65em; align-items: center; justify-content: center; margin-right: 6px; } .Hinweis-Container--Text-bordered { display: inline-flex; padding: 0.08em 3px; align-items: center; justify-content: center; vertical-align: top; min-height: 1em; margin-right: 3px; } .Hinweis-Container--Text-unbordered { display: inline-flex; padding: 0.08em; align-items: center; justify-content: center; vertical-align: top; min-height: 1em; margin-right: 3px; } .Hinweis-Container__border { border: 1px solid #cacaca; border-radius: 1px; } .Hinweis-Container__noborder { border: 0; } .Hinweis-Container__ausblenden, .Hinweis-Container--icon__ausblenden, .Hinweis-Container--Text-bordered__ausblenden, .Hinweis-Container--Text-unbordered__ausblenden, .Hinweis-Container span:empty { display: none; } .Hinweis-Container__einblenden, .Hinweis-Container--icon__einblenden, .Hinweis-Container--Text-bordered__einblenden, .Hinweis-Container--Text-unbordered__einblenden { display: inline-flex; } .Hinweis-Container__einblenden__block { display: flex; } .d-flex { display: flex; } .display__inline-flex { display: inline-flex; } /*** Schriftgrößen ***/ .em1 { font-size: 1em; } .em2 { font-size: 2em; } .em3 { font-size: 3em; } /*** Ende Schriftgrößen *** /*** Hintergrundfarben ***/ .UTM.bc__gruen, .UTM.bc__grün, .UMA.bc__gruen, .UMA.bc__grün { background-color: #468847; } .MS.bc__gruen, .MS.bc__grün { background-color: #2DCC71; } .UTM.bc__rot, .UMA.bc__rot { background-color: #ec7063; } .MS.bc__rot { background-color: #E74C3C; } .UTM.bc__grau { background-color: rgb(153, 153, 153); } .UMA.bc__grau { background-color: #555555; } .MS.bc__grau { background-color: #cccccc; } .bc__dgrau { background-color: rgb(51, 51, 51); /* Log-Einträge UTM, */ } .bc__hgrau { background-color: rgba(0, 0, 0, 0.05); /* Status-Meldungen */ } .bc__grau-app { background-color: #c1cbce; /* Graue Balken in der Android-App */ } .bc__grau-s { background-color: #55676d; /* Graue Schrift in Android-App */ } .bc__grau-b { background-color: #878a90; /* Graue Buttons in Android-App */ } .bc__blau { background-color: rgb(58, 135, 173); /* Zonen, Bereiche */ } .bc__hblau, .bc__hell-blau { background-color: #00bcd4; /* Geblockte Anfragen */ } .bc__macos-blau { background-color: #257bfe; /* Schaltflächen in MacOS */ } .bc__rots { background-color: rgba(231,76,60, 0.7); /* Symbole in rot */ } .bc__rotaus { background-color: #B94A48; /* verwendet für deaktivierte Buttons in UTM */ } .bc__orange { background-color: #ff5722; /* verwendet für Warnungen in Statistik */ } .bc__ddgrau { background-color: #484c53; /* Graue Ränder */ } .bc__rotr { background-color: #e43725; /* verwendet für Border von Schaltflächen */ } .bc__rotbd { background-color: #d62c1a; /* verwendet für Border von Hinweisen */ } .bc__rot-cb { background-color: #ef8b80; /* verwendet für Border von Clickboxen */ } .bc__white-lbd { background-color: rgba(255, 255, 255, 0.1); /* verwendet für weiße Ränder */ } .bc__gelbbd { background-color: #ec971f; /* Border gelbe Felder */ } .bc__grünbd { background-color: #24a25a; /* Border grüne Felder */ } .bc__r, .bc__warnung { background-color: #d71e0b; /* rot */ } .bc__gr, .bc__positiv { background-color: rgb(2,90,0); /* grün */ } .bc__g, .bc__hinweis { background-color: rgb(255,200,0); /* gelb */ } .bc__b { background-color: rgb(2,100,130); /* blau */ } .bc__gelb { background-color: #f0ad4e;; } .UTM.bc__rot, .UMA.bc__rot { background-color: #ec7063; } .MS.bc__rot { background-color: #E74C3C; } /*** Ende Hintergrund-Farben ***/ /*** Beginn Schrift-Farbe ***/ .UTM.font-color__gruen, .UTM.font-color__grün, .UMA.font-color__gruen, .UMA.font-color__grün { color: #468847; } .MS.font-color__gruen, .MS.font-color__grün { color: #2DCC71; } .UTM.font-color__rot, .UMA.font-color__rot { color: #ec7063; } .MS.font-color__rot { color: #E74C3C; } .UTM.font-color__grau { color: rgb(153, 153, 153); } .UMA.font-color__grau { color: #555555; } .MS.font-color__grau { color: #cccccc; } .font-color__white-l { color: rgba(255, 255, 255, 0.9); } .font-color__grau-l { color: rgba(0, 0, 0, 0.6); } .font-color__dgrau { color: rgb(51, 51, 51); /* Log-Einträge UTM, */ } .font-color__hgrau { color: rgba(0, 0, 0, 0.05); /* Status-Meldungen */ } .font-color__grau-app { color: #c1cbce; /* Graue Balken in der Android-App */ } .font-color__grau-s { color: #55676d; /* Graue Schrift in Android-App */ } .font-color__grau-b { color: #878a90; /* Graue Buttons in Android-App */ } .font-color__blau { color: rgb(58, 135, 173); /* Zonen, Bereiche */ } .font-color__hblau, .font-color__hell-blau { color: #00bcd4; /* Geblockte Anfragen */ } .font-color__macos-blau { color: #257bfe; /* Schaltflächen in MacOS */ } .font-color__rots { color: rgba(231,76,60, 0.7); /* Symbole in rot */ } .font-color__rotaus { color: #B94A48; /* verwendet für deaktivierte Buttons in UTM */ } .font-color__orange { color: #ff5722; /* verwendet für Warnungen in Statistik */ } .font-color__ddgrau { color: #484c53; /* Graue Ränder */ } .font-color__rotr { color: #e43725; /* verwendet für Border von Schaltflächen */ } .font-color__rotbd { color: #d62c1a; /* verwendet für Border von Hinweisen */ } .font-color__rot-cb { color: #ef8b80; /* verwendet für Border von Clickboxen */ } .font-color__white-lbd { color: rgba(255, 255, 255, 0.1); /* verwendet für weiße Ränder */ } .font-color__gelbbd { color: #ec971f; /* Border gelbe Felder */ } .font-color__grünbd { color: #24a25a; /* Border grüne Felder */ } .font-color__r, .font-color__warnung { color: #d71e0b; /* rot */ } .font-color__gr, .font-color__positiv { color: rgb(2,90,0); /* grün */ } .font-color__g, .font-color__hinweis { color: rgb(255,200,0); /* gelb */ } .font-color__b { color: rgb(2,100,130); /* blau */ } .font-color__gelb { color: #f0ad4e;; } .UTM.font-color__rot, .UMA.font-color__rot { color: #ec7063; } .MS.font-color__rot { color: #E74C3C; } /*** Ende Schrift-Farbe ***/ /*** Beginn Border-Farbe ***/ .UTM.border-color__gruen, .UTM.border-color__grün, .UMA.border-color__gruen, .UMA.border-color__grün { border-color: #468847; } .MS.border-color__gruen, .MS.border-color__grün { border-color: #2DCC71; } .UTM.border-color__rot, .UMA.border-color__rot { border-color: #ec7063; } .MS.border-color__rot { border-color: #E74C3C; } .UTM.border-color__grau { border-color: rgb(153, 153, 153); } .UMA.border-color__grau { border-color: #555555; } .MS.border-color__grau { border-color: #cccccc; } .border-color__white-l { border-color: rgba(255, 255, 255, 0.9); } .border-color__grau-l { border-color: rgba(0, 0, 0, 0.6); } .border-color__dgrau { border-color: rgb(51, 51, 51); /* Log-Einträge UTM, */ } .border-color__hgrau { border-color: rgba(0, 0, 0, 0.05); /* Status-Meldungen */ } .border-color__grau-app { border-color: #c1cbce; /* Graue Balken in der Android-App */ } .border-color__grau-s { border-color: #55676d; /* Graue Schrift in Android-App */ } .border-color__grau-b { border-color: #878a90; /* Graue Buttons in Android-App */ } .border-color__blau { border-color: rgb(58, 135, 173); /* Zonen, Bereiche */ } .border-color__hblau, .border-color__hell-blau { border-color: #00bcd4; /* Geblockte Anfragen */ } .border-color__macos-blau { border-color: #257bfe; /* Schaltflächen in MacOS */ } .border-color__rots { border-color: rgba(231,76,60, 0.7); /* Symbole in rot */ } .border-color__rotaus { border-color: #B94A48; /* verwendet für deaktivierte Buttons in UTM */ } .border-color__orange { border-color: #ff5722; /* verwendet für Warnungen in Statistik */ } .border-color__ddgrau { border-color: #484c53; /* Graue Ränder */ } .border-color__rotr { border-color: #e43725; /* verwendet für Border von Schaltflächen */ } .border-color__rotbd { border-color: #d62c1a; /* verwendet für Border von Hinweisen */ } .border-color__rot-cb { border-color: #ef8b80; /* verwendet für Border von Clickboxen */ } .border-color__white-lbd { border-color: rgba(255, 255, 255, 0.1); /* verwendet für weiße Ränder */ } .border-color__gelbbd { border-color: #ec971f; /* Border gelbe Felder */ } .border-color__grünbd { border-color: #24a25a; /* Border grüne Felder */ } .border-color__r, .border-color__warnung { border-color: #d71e0b; /* rot */ } .border-color__gr, .border-color__positiv { border-color: rgb(2,90,0); /* grün */ } .border-color__g, .border-color__hinweis { border-color: rgb(255,200,0); /* gelb */ } .border-color__b { border-color: rgb(2,100,130); /* blau */ } .border-color__gelb { border-color: #f0ad4e;; } .UTM.border-color__rot, .UMA.border-color__rot { border-color: #ec7063; } .MS.border-color__rot { border-color: #E74C3C; } /*** Ende Border-Farbe ***/