Hi,
ich habe mir gerade die neuen Webfront Graphen in das Dashboard eingebaut.
Geht auch hinterbar jedoch nur muss ich leider die Hintergrundfarbe auf Schwarz umstellen.
Dashboard.php kopiert in Dashboardschwarz.php
webfront.css kopiert in Dashboardschwarz.php geändert
Jedoch ist die CSS Datei mal ganz komisch formatiert UTF-8??
Ich würde gerne den Hintergrund einfach Schwarz machen damit es bei mir besser ins Bild passt. Kann mir da jemand helfen?
Gruß
Christian
Ergänze den CSS-Teil der dashboard.php einfach um
#containerMiddleContent { background: black; }
#containerBottom { background: black; }
Die webfront.css sieht merkwürdig aus, da alle überflüssigen Zeichen entfernt worden sind, damit sie möglichst platzsparend ist.
kommt aus der webfront.css, dort unter .barBottomBackground gibt es zwei Farbeinstellungen;)
hm ne keine Änderung.
Es wird auch noch ein „background-image“ gesetzt, dass über der schwarzen Farbe liegt.
#containerBottom ist dafür zuständig. Hast Du den Code von mir auch wirklich direkt vor dem </style> eingebaut?
Direkt in die css
html,body {font:normal 14px verdana;background-color:#000;color:#fff;width:100%;height:100%;z-index:0;overflow:hidden;margin:0;padding:0}
a:link,a:visited,a:active,a:hover {color:#eef;text-decoration:none}a:hover {color:#7faaff}pre {margin:0}* {-moz-user-select:none}#pageContainer {position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}#containerTop {z-index:2;position:absolute;top:0;left:0;width:100%;height:50px}#containerMiddle {
background-color: Black;
z-index:1;
overflow:hidden;
position:absolute;
top:50px;
right:0;
bottom:50px;
left:0;
width:100%;
padding:0
}#containerBottom {z-index:50;position:absolute;bottom:0;left:0;width:100%;height:50px;margin:0;padding:0}
#barTop {font:normal 12px verdana;height:50px;position:absolute;top:0;left:0;z-index:100;width:10000px}
#barTopWidgetsContainer {
position:relative;
float:right;
z-index:101;
background-color: Black;
background-image:url(./img/barTopDark.png);
background-repeat:repeat-x;
width:auto;
height:40px;
overflow:hidden;
top:0;
border:1px solid #fff;
border-width:0 0 0 1px;
padding:0 5px
}.barTopWidgetsContainerScroll {border-width:0!important;padding:0 5px 0 0 !important}#barTopWidgetsContainer div {float:left;position:relative}#barTopScrollLeft,#barTopScrollRight {position:relative;display:block;z-index:101;width:40px;height:38px;border:1px solid #FFF;float:left;background-color:#3c4b60;background-image:url(./img/barTopTop.png);background-repeat:repeat-x;overflow:hidden;border-width:1px 1px 1px 0;padding:0}#barTopScrollRight {border-width:1px;margin:0 5px 0 0}#barTopScrollContainer {position:relative;display:block;z-index:100;height:40px;float:left;top:0}.barTopBackground {position:absolute;z-index:10;top:0;left:0;width:100%;height:50px}.barTopBackground .topArea {height:38px;border:1px solid #fff;background-color:#3c4b60;background-image:url(./img/barTopTop.png);background-repeat:repeat-x;border-width:1px 0}.barTopBackground .bottomArea {height:10px;background-color:#484a4c;background-image:url(./img/barTopBottom.png);background-repeat:repeat-x;overflow:hidden}.barTopItem,.barTopItemSelected {position:relative;border:1px solid transparent;min-width:56px;height:36px;font:normal 18px verdana;display:block;float:left;margin-top:1px;top:0;padding:0}.barTopItemSelected {border:1px #365380 solid;background-color:#405572;background-image:url(./img/barTopLight.png)}.barTopItemTitle,.barTopItemTitleIcon {line-height:36px;padding:0 15px}.barTopItemTitleIcon {padding-left:54px}.barTopItemTitleIcon img {position:absolute;left:12px;top:3px;width:32px;height:32px}.barBottom {font:normal 12px verdana;clear:both;height:50px;position:absolute;top:0;left:0;z-index:100;display:inline-block;#zoom:1;#display:inline;white-space:nowrap}#barBottomScrollLeft,#barBottomScrollRight {position:absolute;display:block;z-index:101;width:40px;height:38px;top:10px;border:1px solid #FFF;background-color:#3c4b60;background-image:url(./img/barBottomBottom.png);background-repeat:repeat-x;overflow:hidden;border-width:1px 1px 1px 0;margin:0;padding:0}#barBottomScrollRight {right:0;left:auto;border-width:1px 0 1px 1px}#barBottomScrollContainer {position:absolute;display:block;z-index:100;height:40px;top:10px;left:0;right:0}.barBottomScrollContainerScroll {left:41px!important;right:41px!important}.barBottomBackground {position:absolute;z-index:90;top:0;left:0;width:100%;height:50px}.barBottomBackground .topArea {height:10px;background-color:#ffffff;} .bottomArea {height:38px;border:1px solid #fff;background-color:#ffffff;}#containerMiddleContent {font:normal 1em verdana;clear:both;position:absolute;width:100%;height:100%;overflow:auto;background-color:#FFFFFF}.containerMiddleBackgroundContainer {position:absolute;top:0;bottom:0;width:100%;text-align:center;overflow:hidden;height:100%;margin:0;padding:0}.containerMiddleBackgroundContainer img {left:0;top:0}.containerMiddleContentContainer {position:absolute;width:100%;height:100%;top:0;left:0;overflow:auto}.webfrontPageContentPane {position:absolute;top:0;left:0;display:block;width:100%;height:100%;font-size:100%}#notificationLayer {position:absolute;right:18px;top:56px;z-index:700}#notificationLayer .notification {display:block;position:relative;width:300px;height:0;background-color:#000;filter:alpha(opacity=85);-moz-opacity:0.85;opacity:0.85;-moz-border-radius:5px;-webkit-border-radius:5px;-khtml-border-radius:5px;border-radius:5px;margin:12px 10px}#notificationLayer .notification .icon {display:block;position:absolute;padding:8px 16px}#notificationLayer .notification .text {display:block;position:relative;left:42px;width:238px;padding:16px}#notificationLayer .notification .textNoIcon {display:block;position:relative;width:280px;padding:16px}#notificationLayer .notification .title {font-weight:700}#popupLayerContainer {display:none;position:absolute;z-index:800;top:0;left:0;right:0;bottom:0;width:100%;height:100%}#popupLayer {display:block;position:absolute;z-index:801;top:10%;left:10%;width:80%;height:80%;font:normal 14px verdana;color:#FFF;filter:alpha(opacity=85);-moz-opacity:0.85;opacity:0.85}#popupLayerBorder {display:block;position:absolute;z-index:800;top:0;left:0;right:0;bottom:0;width:100%;height:100%;background:#000;filter:alpha(opacity=55);-moz-opacity:0.55;opacity:0.55}.popupLayerTitle {position:relative;font-size:22px;line-height:40px;height:40px;background:#123 url(./img/bgPopupTitle.png) repeat;-moz-border-radius-topleft:3px;-moz-border-radius-topright:3px;-webkit-border-top-left-radius:3px;-webkit-border-top-right-radius:3px;border:1px solid #FFF;overflow:hidden;border-width:1px 1px 0;margin:0;padding:0 10px}.popupLayerControls {top:0;right:0;height:40px;width:40px;position:absolute;background:#123 url(./img/bgPopupTitle.png) repeat;border:1px solid #fff;-moz-border-radius-topright:3px;-webkit-border-top-right-radius:3px}.popupLayerControls img {width:32px;height:32px;margin:4px}#popupLayerScrollContainer {position:absolute;top:40px;bottom:0;left:0;right:0;background-color:#000;border:1px solid #FFF;-moz-border-radius-bottomleft:3px;-moz-border-radius-bottomright:3px;-webkit-border-bottom-left-radius:3px;-webkit-border-bottom-right-radius:3px;overflow:auto}.popupLayerContent {position:relative;height:100%}.popupLayerError {position:relative;left:0;border:1px solid #000;margin:3px 20px}.popupLayerErrorTime {position:absolute;left:0;font:normal 14px verdana;color:#aae}.popupLayerErrorMessage {position:relative;margin-left:85px;font:normal 14px verdana;color:#FFF}.popupLayerErrorMessageDetailed {position:relative;font:normal 10px verdana;color:#bbb;border:1px #666 dashed;overflow:auto;word-wrap:break-word;margin:5px 3px 5px 88px}.popupLayerErrorButton {display:inline;position:relative;border:1px solid #FFF;background-color:#112;line-height:40px;z-index:999;margin:5px 3px 5px 88px;padding:10px}.webfrontMenu {font:normal 14px verdana;margin-right:10px;z-index:110;position:relative;display:inline-block;#zoom:1;#display:inline}.webfrontMenuActiveItem {position:relative;visibility:visible;top:1px;line-height:36px;border:1px #365380 solid;background-color:#405572;background-image:url(./img/barBottomLight.png);white-space:nowrap;padding:0 10px}.webfrontMenuItems {bottom:39px;display:none;position:absolute;z-index:500}.webfrontMenuItem {font:normal 14px verdana;color:#fff;position:relative;z-index:111;white-space:nowrap;padding:9px 10px 10px}.webfrontMenuItemInactive {opacity:.85;filter:alpha(opacity=85);-moz-opacity:0.85;background-color:#2d3540;border:1px solid #708090;border-width:1px 1px 0}.webfrontMenuItemInactiveHover {background-color:#3e4a59}#onScreenInput {position:absolute;z-index:810;top:0;left:0;width:100%;height:100%;display:none}#onScreenInputBorder {display:block;position:absolute;z-index:810;top:0;left:0;right:0;bottom:0;width:100%;height:100%;background-color:#000;filter:alpha(opacity=55);-moz-opacity:0.55;opacity:0.55}.onScreenInputContainer {z-index:811;top:50%;left:50%;margin-top:-150px;margin-left:-355px;text-align:left;font:normal 14px verdana;display:block;position:absolute;width:710px;height:300px;background-color:#000;filter:alpha(opacity=85);-moz-opacity:0.85;opacity:0.85;-moz-border-radius:5px;-webkit-border-radius:5px;-khtml-border-radius:5px;border-radius:5px;padding:5px 0}.onScreenInputContainerMultiLine {margin-top:-175px;height:350px}.onScreenInputRow,.onScreenInputRowInput {text-align:center;width:710px;position:relative}.onScreenInputRowInput {text-align:left}.onScreenInputInput {position:relative;width:550px;height:40px;display:block;border:1px solid #5d5d89;left:30px;text-align:left;margin:4px;padding:0}.onScreenInputInputMultiLine {height:90px}.onScreenInputInput input {position:absolute;display:block;background:#0c0d15;color:#fff;width:550px;height:40px;border:0;font:normal 18px verdana;line-height:40px;margin:0;padding:0}.onScreenInputInput textArea {position:absolute;display:block;background:#0c0d15;color:#fff;border:0;width:550px;height:90px;font:normal 18px verdana;resize:none;overflow:auto;margin:0;padding:0}.onScreenInputFirstLineKeys {width:90px;display:block;position:absolute;right:30px;top:-4px;#top:0;text-align:center}.onScreenInputKey {position:relative;width:40px;height:40px;display:inline-block;#zoom:1;#display:inline;border:1px solid #223;overflow:hidden;margin:4px}.onScreenInputKey div {position:absolute;display:block;border:0;top:0;left:0;width:100%;height:100%;line-height:40px;margin:0;padding:0}.onScreenInputKey div img {position:relative;display:inline;border:0;width:32px;height:32px;margin:4px 0;padding:0}.onScreenInputKeyWide {width:80px}.onScreenInputKeySpace {width:320px}.onScreenInputKeyOK {width:80px;background:#0C0D15}.onScreenInputKeyActive {background-color:#112;border-color:#669}.sizeContainer {position:absolute;visibility:hidden;z-index:1;top:0;left:-10000px}.webfrontFadingArrow {width:12px;height:12px}.achartListContainer {position:absolute;width:100%;height:100%;overflow:auto}.achartListItem {border:1px solid #3B3B4D;height:40px;position:relative;line-height:38px;margin:10px;padding:0 0 0 10px}.achartContainer {position:relative;bottom:0;float:left;margin:10px}.achartGraph {position:relative;background:#2D343D;border:1px solid #99A;margin:9px 9px 9px 59px}.achartBottom {position:relative;text-align:center}.achartAxisY {position:absolute;top:0;left:0;width:64px}.achartAxisYItem {font-size:10px;height:20px;line-height:17px;position:absolute;text-align:right;width:49px}.achartAxisYLine {position:absolute;width:5px;height:1px;border-top:1px solid #FFF;left:54px}.dwdContentPane {display:block;width:100%;overflow:auto}.dwdBarBottom {display:none}.dwdContainer {width:100%;height:100%}.dwdImageContainer {width:37%;float:left;padding:1.5%}.dwdImage {width:100%;border:1px #3d5f91 solid;background:transparent url(../../../img/dwdLogo200.png) no-repeat scroll center center}.dwdReport {float:left;width:58.5%;#width:auto;margin:1.5% 1.5% 1.5% 0}.dwdReportTitle {font:normal 18px verdana;color:#fff}.dwdReportText {font:normal 13px verdana;color:#d9e8ff}.ipsBarBottomCategoriesUpperLevel,.ipsBarBottomCategoriesActLevel,.ipsBarBottomCategoriesItem {height:38px;font:normal 14px verdana;display:inline-block;#zoom:1;#display:inline;white-space:nowrap;position:relative;top:1px;padding:0 11px}.ipsBarBottomCategoriesActLevelSelected,.ipsBarBottomCategoriesItemSelected {background-color:#405572;background-image:url(./../../../img/barBottomLight.png);border:1px solid #365380;border-width:0 1px;padding:0 10px}.ipsBarBottomCategoriesUpperLevel span,.ipsBarBottomCategoriesActLevel span,.ipsBarBottomCategoriesItem span {display:inline-block;#zoom:1;#display:inline;line-height:38px}.ipsMenuIcon {width:38px}.ipsMenuIcon img {position:absolute;top:0;margin:4px 4px 4px 0}.ipsMenuArrow {margin:0 0 -1px}.ipsDeviceContainer {position:relative;min-height:40px;border:1px solid #3b3b4d;margin:10px;padding:0}.ipsDeviceTitle {margin-right:239px}.ipsDeviceTitleContent {position:relative;font:normal 14px verdana;padding-left:52px;overflow:hidden;white-space:nowrap;line-height:40px}.ipsDeviceActionArea {position:absolute;right:195px;top:0;height:40px;overflow:hidden}.ipsDeviceActionArea div {position:relative;width:40px;height:40px;border-left:1px solid #3B3B4D}.ipsDeviceActionArea div img {position:relative;top:4px;left:4px}.ipsDeviceState,.ipsDeviceStateExtended {font:normal 14px verdana;position:absolute;right:0;top:0;height:40px;width:196px;overflow:hidden}.ipsDeviceStateExtended {right:40px;width:156px}.ipsDeviceStateContent {position:relative;font:normal 14px verdana;text-align:center;white-space:nowrap;overflow:hidden;line-height:40px;margin:0;padding:0}.ipsDeviceExtender,.ipsVariableExtender {font:normal 14px verdana;position:absolute;right:0;top:0;height:40px;width:40px;overflow:hidden;border-left:1px solid #3B3B4D;background:url(./../../../img/fadingArrowLeft.png) no-repeat center center}.ipsDeviceExtenderExtended,.ipsVariableExtenderExtended {background:url(./../../../img/fadingArrowDown.png) no-repeat center center}.ipsVariablesContainer {border:1px solid #3b3b4d;border-top-width:0;margin:0 11px 11px;padding:0}.ipsVariableContainer {position:relative;min-height:40px;border-top:1px solid #3b3b4d;margin:-1px 0 0}.ipsVariableDisplay,.ipsVariableDisplayExtended {position:relative;width:100%;height:100%;border-left:1px solid #3b3b4d;margin:0 -1px 0 1px}.ipsVariableDisplayExtended {width:154px}.ipsFadeBlock,.ipsFadeBlockSuccess {position:absolute;width:100%;height:100%;top:0;left:0;background-color:#354050;background-image:url(./../../../img/bgActionBar.png);background-repeat:repeat}.ipsFadeBlockSuccess {background-color:#017c01}.ipsIconImage {margin:4px 4px 4px 0}.ipsIconContainer {position:absolute;left:10px;top:4px;width:40px;height:40px}.ipsImageView {background-color:#1a1b1c;text-align:center;overflow:auto;overflow-y:hidden;height:auto;border-top:1px solid #3b3b4d;margin:0;padding:10px}.ipsImageView img {border:1px solid #3B3B4D;background-color:#000;margin:0;padding:10px}.ipsSwitchBasic {width:100%;height:100%;border-left:1px solid #3b3b4d;border-right:1px solid #3b3b4d;margin:0 -1px 0 1px}.ipsSwitchBasicOn {background-color:#017c01;text-align:center;background-image:url(./../../../img/bgActionBar.png);background-repeat:repeat}.ipsSwitchBasicOff {background-color:#ae1e1e;text-align:center;background-image:url(./../../../img/bgActionBar.png);background-repeat:repeat}.ipsSelectionBar {width:100%;background-color:#222324;border:1px solid #3b3b4d;border-collapse:collapse}.ipsSelectionBarBlock {height:40px;background-color:#222324;color:#fff;text-align:center;line-height:38px;border:1px solid #3b3b4d}.ipsSelectionBarBlockActive {background-color:#354050;background-image:url(./../../../img/bgActionBar.png);background-repeat:repeat}.ipsSliderBarMin {position:absolute;top:0;left:0;width:80px;height:40px;background-color:#2c323a;color:#fff;text-align:center;line-height:38px;border:1px solid #3b3b4d;border-width:0 1px 0 0}.ipsSliderBarState {position:absolute;left:0;top:0;width:100%;height:40px}.ipsSliderBarStatePositionContainer {position:relative;left:80px;height:40px;margin-right:160px}.ipsSliderBarStatePosition {height:40px;background-color:#354050;background-image:url(./../../../img/bgActionBar.png);background-repeat:repeat;border-right:1px solid #3B3B4D}.ipsSliderBarStateText {position:absolute;top:0;width:100%;height:40px;color:#FFF;text-align:center;line-height:38px}.ipsSliderBarMax {position:absolute;top:0;right:0;width:80px;height:40px;background-color:#2c323a;color:#fff;text-align:center;line-height:38px;border:1px solid #3b3b4d;border-width:0 0 0 1px}.ipsTextBoxBar div {padding:11px 10px}.ipsMailContainer {background-color:#222324;border:1px solid #3b3b4d;border-width:0 1px 1px;margin:0 11px 11px}.ipsMailContainerStandalone {border:0 none;margin:0}.ipsMailBlockSender {border-right:1px solid #3B3B4D;overflow:hidden;position:relative;width:180px;line-height:40px;height:40px;padding:0 10px}.ipsMailBlockSubject {left:200px;overflow:hidden;position:absolute;right:200px;top:0;line-height:40px;height:40px;margin:0;padding:0 10px}.ipsMailBlockDate {border-left:1px solid #3B3B4D;position:absolute;right:0;top:0;width:177px;line-height:40px;height:40px;text-align:center;padding:0 10px}.iviewContentFrame {position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;border:none;overflow:auto;color:#FFF}.widgetsClockBasicView {font:normal 14px verdana;text-align:right;white-space:nowrap;display:block;padding:12px 5px 10px}.widgetsInfoBasicViewText,.widgetsInfoBasicViewIcon {font:normal 14px verdana;white-space:nowrap;text-align:center;min-width:32px;display:block;margin-top:1px;padding:11px 5px}.widgetsInfoBasicViewIcon {padding:4px 5px}#barTopScrollLeft img,#barTopScrollRight img,#barBottomScrollLeft img,#barBottomScrollRight img {margin:4px}#notificationLayer .notification .icon img,.iconImage {width:32px;height:32px}.ipsSelectionBarOuter,.ipsSliderBarOuter,.ipsTextBoxBarOuter {clear:both;margin:0 11px 11px}.ipsSliderBar,.ipsTextBoxBar {width:100%;background-color:#222324;border:1px solid #3b3b4d;border-collapse:collapse;position:relative;min-height:40px}#containerMiddleContent { background: black; } #containerBottom { background: black; }
Ich würde nicht dashboard.php sagen, wenn ich es nicht so meinen würde. Die überschreibt schließlich die entsprechenden CSS-Styles, die Du dann auch wieder überschreiben musst ;).
Uhi Geil 
ich sollte richtig lesen.