From 8b1ce9ac2f278ea661251f2119a032da02cf022d Mon Sep 17 00:00:00 2001 From: Manfred Kindl Date: Fri, 19 Jul 2013 15:49:42 +0000 Subject: [PATCH] Anpassungen an CIS-Redesign --- skin/cis.css | 16 +- skin/flexcrollstyles.css | 95 +++++ skin/print.css | 8 +- skin/style.css.php | 9 +- skin/styles/mobile.css | 893 +++++++++++++++++++++++++++++++-------- skin/styles/tw.css | 665 +++++++++++++++++++++++------ 6 files changed, 1363 insertions(+), 323 deletions(-) create mode 100644 skin/flexcrollstyles.css diff --git a/skin/cis.css b/skin/cis.css index e1ce3d8bb..5d89c5618 100644 --- a/skin/cis.css +++ b/skin/cis.css @@ -186,7 +186,7 @@ td.MarkLine background-color: #F2F2F2; } -td.Inaktiv /*für Inaktive Items bei der Raumbeschreibung*/ { +td.Inaktiv /*f�r Inaktive Items bei der Raumbeschreibung*/ { background-color: #F2F2F2; /*wie #EEEEEE; also grau fast weiss*/ color: #CFCFCF; } @@ -240,18 +240,20 @@ TABLE#zeitsperren TD /* Stundeplan */ TABLE.stdplan { - border: 1; - border-spacing: 0; - padding: 0px 0px 0px 0px; - font-size: small; + margin: 0px; + padding: 0px; + width: 100%; + background-color: white; + vertical-align: top; + border-spacing:1; } TABLE.stdplan TH { - background-color: #DDDDDD; + background-color: #A5AFB6; } TABLE.stdplan TD { - background-color: #EEEEEE + background-color: #E9ECEE; } .row-even { --> liste1 background-color:#f2f2f2; diff --git a/skin/flexcrollstyles.css b/skin/flexcrollstyles.css new file mode 100644 index 000000000..fa4b4926f --- /dev/null +++ b/skin/flexcrollstyles.css @@ -0,0 +1,95 @@ +/* Scroll Bar Master Styling Starts Here */ +/* All comments can be freely removed from the css */ +div.flexcroll +{ + height:100%; + outline: none; +} +.flexcroll +{ + outline: none; +} +/* scrollgeneric is used for corrective styling of elements, and should not be modified or removed */ +.scrollgeneric +{ + line-height: 1px; + font-size: 1px; + position: absolute; + top: 0; left: 0; +} +.vscrollerbase +{ + width:24px; +} +.vscrollerbar +{ + background-image: url(images/scrollbar_up_down.png); + width: 18px; + /* following is the bit that allows us fixed height scrollbars */ + height: 38px !important; + /* for fixed height, we force the vscrollerbar class with an !important decleration, and fleXcroll follows suit.*/ + + /* unfortunately, due to limitations of CSS, we cannot provide a color for the background when we are + using alpha images, thay have to be transparent.*/ +} + +/* * html .vscrollerbar { +IE6 alpha png trick +IE7 is not affected by this trick, as it perfectly handles the normal png +filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop src='scrollbar_up_down.png'); +background-image: none; +} */ +.vscrollerbasebeg +{ + top: 0px; + width: 18px; + background: url("images/scrollbase_top.png") no-repeat scroll transparent; +} +.vscrollerbaseend +{ + width: 18px; + height: 12px; + background: url("images/scrollbase_bottom.png") no-repeat scroll transparent; +} +/* do not forget to give horizontal scrollbars some color properties even if you don't plan on using them */ +.hscrollerbase +{ + height: 18px; +} +.hscrollerbar +{ + background-image: url(images/scrollbar_left_right.png); + height:18px; + width: 38px !important; +} +.hscrollerbasebeg +{ + top: 0px; + height: 18px; + background: url("images/scrollbase_left.png") no-repeat scroll transparent; +} +.hscrollerbaseend +{ + width: 12px; + height: 18px; + background: url("images/scrollbase_right.png") no-repeat scroll transparent; +} +.vscrollerbar, .hscrollerbar +{ + /* paddings of these elements will decide how far the scrollbar will stop in both ends, and are not actually + used for styling, and are set to 0 by the script, here we will set them the size of our faux arrows */ + padding: 12px; + z-index: 2; +} + +/* properties for scroller jog box (Stosspunkt der Scrollbar), just in case */ +/* .scrollerjogbox { +width: 30px; +height: 22px; +top: auto; left: auto; +bottom: 0px; right: 0px; +background: #698AAA; +} */ + + +/* Scroll Bar Master Styling Ends Here */ diff --git a/skin/print.css b/skin/print.css index ac2f62a2e..47c3f0570 100644 --- a/skin/print.css +++ b/skin/print.css @@ -10,22 +10,22 @@ body /* Seitenumbrueche */ .page-break-after { - page-break-after:always; + page-break-after: always; } .page-break-before { - page-break-before:always; + page-break-before: always; } .page-break-after-avoid { - page-break-after:avoid; + page-break-after: avoid; } .page-break-before-avoid { - page-break-before:avoid; + page-break-before: avoid; } .page-break-inside-avoid diff --git a/skin/style.css.php b/skin/style.css.php index c9ea25f51..02b2a80c8 100644 --- a/skin/style.css.php +++ b/skin/style.css.php @@ -8,6 +8,9 @@ else $path='../'; require ($path.'config/cis.config.inc.php'); + + //die($_SERVER["HTTP_USER_AGENT"]); + //setcookie('stylesheet', DEFAULT_STYLE); //Name des Stylesheets darf nur buchstaben von A-Z enthalten (ohne umlaute) if (isset($_COOKIE['stylesheet']) && preg_match('/^[a-zA-Z]+$/', $_COOKIE['stylesheet'])) @@ -23,6 +26,7 @@ else $stylesheet=DEFAULT_STYLE; } + //$stylesheet="mobile"; //setcookie('stylesheet', DEFAULT_STYLE); header("Content-Type: text/css"); //echo $_COOKIE['stylesheet']; @@ -37,8 +41,9 @@ function jahresplan_check_mobile() { 'Portable', 'Smartphone', 'SDA', 'PDA', 'Handheld', 'Symbian', 'WAP', 'Palm', 'Avantgo', - 'cHTML', 'BlackBerry', 'Opera Mini', - 'Nokia' + 'cHTML', 'BlackBerry', 'Opera Mobi', + 'Nokia','iPhone','iPad','Android','BlackBerry', + 'PlayBook','Kindle','Kindle Fire', 'Windows Phone' ); // Prüfen der Browserkennung for ($i=0; $ibody #menue { position:absolute; @@ -34,78 +85,85 @@ html>body #menue #content { - width:45%; - height:80%; + height: 42%; + + width:81%; left:18%; - overflow: auto; + padding: 0px; + margin: 0px; } -/*Alle außer IE 6*/ + +/*Alle au�er IE 6*/ html>body #content { position:absolute; } -#GlobalMenu -{ - padding: 0px 0px 0px 30px; - margin-top: 3px; - text-align: left; -} - - -.home_logo -{ - background-image:url(styles/mobile/TWLogo_klein.jpg); - width:100px; - height:31px; - z-index: 1003; -} -.header_line -{ - background-image:url(styles/mobile/header_line.jpg); - background-repeat:repeat-x; - width:100%; - height:3px; -} -} - /* Druckausgabe */ - - -@media print { - -.home_logo +@media print { -display:none; -} -.header_line -{ -display:none; -} - -#menue -{ -display:none; -} -#GlobalMenu -{ -display:none; -} - -#content -{ - width:800px; - height:900px; - left:0px; - overflow: hidden; -} + + .home_logo + { + display:none; + } + /*.header_line + { + display:none; + }*/ + + #menue + { + display:none; + } + #GlobalMenu + { + display:none; + } + + #content + { + width:800px; + height:900px; + left:0px; + overflow: hidden; + } } - input.TextBox { background-color: White; } +/* Such-Feld CIS-Suche */ +input.search +{ + background-color: #E9ECEE; + border-width: 1px; + border-style:solid; + border-color: #A5AFB6; +} +/* Login-Button CIS-Seite */ +input.cis_login +{ + cursor: pointer; + color: #666666; + font-size: 20px; + border: 1px solid #A5AFB6; + background-color: #E9ECEE; + width: 150px; + height: 35px; +} +#GlobalMenu +{ + margin-top: 3px; + text-align: right; +} +.home_logo +{ + background-image:url(styles/tw/TWLogo_klein.jpg); + width:170px; + height:53px; +} /*Vor IE/Mac verstecken \ *html .header_line{ @@ -131,48 +189,70 @@ div.tip } /* Links */ -a +a /*allgmeiner Link, Hauptmenuelinks*/ { - color: #008381; + color: #0086CC; /*tw-blau*/ text-decoration: none; cursor: pointer; - font-size: xx-small; } -a.HyperItem +a:hover /*link ohne Item-Definition*/ +{ + color: #0086CC; /*tw-blau*/ + text-decoration: underline; +} +a.ItemTesttool +{ + color: #008381; + line-height:25px; + display:block; +} +a:hover.ItemTesttool +{ + color: black; + line-height:25px; +} +a.HyperItem /* ? */ { color: Black; text-decoration: none; font-weight: bold; } -a:hover.HyperItem +a:hover.HyperItem /* ? */ { color: #008381; text-decoration: none; font-weight: bold; } -a[onClick]:hover.Item -{ - color: Black; text-decoration: none; - font-size: smaller; -} -a:hover.Item +a[onClick]:hover.Item /* ? */ { color: Black; text-decoration: none; } -a.Item2 +a:hover.Item /*allgemeine Links, Hauptmenuelink*/ +{ + color: #0086CC; /*tw-blau*/ + text-decoration: underline; +} +a.Item2 /* zB in den Lehrveranstaltungen (Buttons) verwendet bei den Lektoren */ { color: Black; text-decoration: none; } -a:hover.Item2 +a:hover.Item2 /* zB in den Lehrveranstaltungen (Buttons) verwendet bei den Lektoren */ { color: #008381; text-decoration: none; } -a.MenuItem +a.MenuItem /* Hauptmenuelink zum aufklappen */ { - color: #008381; text-decoration: none; + color: #0086CC; text-decoration: none; font-weight: bold; } -a:hover.MenuItem +a:hover.MenuItem /* Hauptmenuelink zum aufklappen */ { - color: Black; text-decoration: none; + color: #0086CC; /*tw-blau*/ + text-decoration: none; + font-weight: bold; +} +a:focus.MenuItem /* Hauptmenuelink zum aufklappen */ +{ + color: #0086CC; /*tw-blau*/ + text-decoration: none; font-weight: bold; } A.hilfe @@ -208,77 +288,137 @@ a.head:hover /* Tables */ +TABLE +{ + font-size: 13px; +} +TABLE.header +{ + width:100%; + height:100%; + /* background-image:url(../skin/images/header.png); */ + /* background-repeat:no-repeat; */ + background-color: white; +} +TABLE.cmstable /* Die Haupttable aller CMS-Contentseiten */ +{ + margin: 0px; + padding: 0px; + border: none; + width: 100%; +} TABLE.tabcontent { margin: 0px; padding: 0px; border-style: none; width: 100%; - /* - cellspacing: 0; - cellpadding: 0; - */ + background-color: white; + vertical-align: top; + border-spacing:0; } + +TABLE.menue +{ + margin: 0px; + padding: 0px; + border-style: none; + width: 100%; +} + +TABLE.menue TD +{ + padding-bottom: 2px; + padding-top: 2px; +} + TABLE.tabcontent2 { margin: 0px; padding: 0px; border-style: none; - /* - cellspacing: 0; - cellpadding: 0; - */ } TABLE.tabborder { - /* - cellspacing: 0; - cellpadding: 1; - */ width: 100%; /*border: 1px solid black; foo*/ } TABLE#tabterm { - /* - cellpadding: 0; - cellspacing: 0; - */ margin:auto; } +td.rand /* Seitenraender des CIS */ +{ + display:none; +} +td.boxshadow /* Farbverlauf im Hintergrund der CIS*/ +{ + position: fixed; + vertical-align:top; + width:100%; +} td.ContentHeader { - background-color: #008381; - /*grün*/ + background-color: #008381; /*gr�n*/ font-weight: bold; - height: 15px; - font-size: x-small; + height: 19px; } td.ContentHeader2 { - background-color: #CCCCCC; /*mittel-grau*/ + color: #0086CC; /*tw-blau */ font-weight: normal; - height: 15px; - font-size: smaller; } td.ContentHeader3 { - background-color: #CCCCCC; /*mittel-grau*/ + color: #0086CC;; /*tw-blau */ font-weight: bold; - height: 15px; - font-size: smaller; } td.MarkLine { - background-color: #F2F2F2; /*wie #EEEEEE; also grau fast weiß*/ + background-color: #F2F2F2; /*wie EEEEEE; also grau fast weiss */ } -td.Inaktiv /*für Inaktive Items bei der Raumbeschreibung*/ { - background-color: #F2F2F2; /*wie #EEEEEE; also grau fast weiss*/ +td.Inaktiv /*fuer Inaktive Items bei der Raumbeschreibung */ +{ + background-color: #F2F2F2; /*wie EEEEEE; also grau fast weiss */ color: #CFCFCF; + text-decoration: line-through; +} +td.ItemTesttool /*fuer die Button-Optik beim Testtool*/ +{ + color: #008381; + line-height:25px; + background-image: url(../skin/images/testtool_button.png); + background-position:center; + background-repeat:repeat-x; +} +td.ItemTesttoolLeft +{ + color: #008381; + line-height:25px; + background-image: url(../skin/images/testtool_buttonleft.png); + background-position:left; + background-repeat:no-repeat; +} +td.ItemTesttoolRight +{ + color: #008381; + line-height:25px; + background-image: url(../skin/images/testtool_buttonright.png); + background-position:right; + background-repeat:no-repeat; +} +td:hover.ItemTesttool +{ + color: black; + line-height:25px; + background-image: url(../skin/images/testtool_button_hover.png); + background-position:center; + background-repeat:repeat-x; } td.tdwidth10 { - width: 10px; + width: 5px; + /* width: 10px; */ } td.tdwidth30 { @@ -297,11 +437,44 @@ td.tdborder td.tdwrap { white-space: nowrap; + color: #0086CC; } - -td.tdvertical +td.tdvertical /* Für Ausrichtung der Icons bei der LV-Ãœbersicht */ { vertical-align: top; + padding: 10px 0 10px 0; + width: 33.33%; + /* height: 100px; */ +} +td.menubox /* Navigationsboxen in den CIS-Contentseiten */ +{ + width: 20%; + background-color: #eeeeee; + border-width: 1px; + padding-left: 15px; + padding-bottom: 20px; + padding-top: 20px; + height: 100%; + vertical-align: middle; +} +td.menubox p +{ + line-height:10px; +} +td.cmscontent +{ + vertical-align: top; + padding-right: 25px; + padding-left: 0px; +} +td.teambox +{ + vertical-align: top; + padding-top: 20px; +} +tr.header +{ + height: 10%; } TR.liste { @@ -309,11 +482,11 @@ TR.liste } TR.liste0 { - background-color: #FFFFFF; /*weiß*/ + background-color: #FFFFFF; /*wei�*/ } TR.liste1 { - background-color: #EEEEEE; /*grau fast weiß*/ + background-color: #EEEEEE; /*grau fast wei�*/ } TR.tryellow { @@ -324,11 +497,6 @@ TR.tryellow TABLE#zeitsperren { /*border: 1px solid black; foo*/ - /* - cellspacing: 0; - cellpadding: 0; - */ - font-size: small; width:100%; } TABLE#zeitsperren TH @@ -345,26 +513,27 @@ TABLE#zeitsperren TD.feiertag } TABLE#zeitsperren TD { - background-color: #EEEEEE /*grau fast weiß*/ + background-color: #EEEEEE; /*grau fast wei�*/ } -/* Stundeplan */ +/* Stundenplan */ TABLE.stdplan { - /*border: 1px solid black; foo*/ - /* - cellspacing: 0; - cellpadding: 0; - */ - font-size: small; + margin: 0px; + padding: 0px; + /* border: 1px solid; */ + width: 100%; + background-color: white; + vertical-align: top; + border-spacing:1; } TABLE.stdplan TH { - background-color: #DDDDDD; + background-color: #A5AFB6; } TABLE.stdplan TD { - background-color: #EEEEEE + background-color: #E9ECEE; } .row-even { /*liste1*/ background-color:#f2f2f2; @@ -376,15 +545,57 @@ TABLE.stdplan TD /* Fonts */ -h1 +/*h1 { - font-size: x-small; color: #ffffff; - background-color: #009e84; + background-color: #008381; /*gruen + font-weight: bold; + padding-top: 2px; + padding-bottom: 2px; + padding-left: 4px; + font-size: 1em; +}*/ +/* h1 +{ + color: black; + padding-top: 2px; + padding-bottom: 2px; + width:20%; + white-space:nowrap; + padding-left: 10px; + font-size: 20px; + letter-spacing: 2px; + border-bottom:solid 1px #0086CC; + font-weight:normal; +} */ +h1 +{ + color: black; + padding: 0px; + padding-bottom: 20px; + /* padding-left: 10px; */ + /* width:20%; */ + margin:0px; + white-space:nowrap; + font-size: 20px; + /* letter-spacing: 2px; + border-bottom:solid 1px #0086CC;*/ + font-weight:normal; } +/* h1.news +{ + color: black; + padding: 0px; + padding-bottom: 10px; + padding-left: 10px; + width:20%; + margin:0px; + white-space:nowrap; + font-size: 20px; + font-weight:normal; +} */ h1 td { - font-size: x-small; color: #ffffff; background-color: #009e84; } @@ -398,17 +609,36 @@ h1 a:hover text-decoration:none; } -h2 +/* h2 { - font-size: smaller; - color: #ffffff; - background-color: #00a4d2; /*hellblau*/ + font-size: 1em; + background-color: #CCCCCC; */ /*mittel-grau */ +/* font-weight: normal; + height: 19px; + padding-top: 2px; */ + /*padding-left: 2px; } -h2 td +/* h2 +{ + font-size: 16px; + + padding-top: 2px; + letter-spacing: 2px; + padding-left: 10px; +} */ +h2 +{ + margin: 0px; + padding-top: 0px; + padding-bottom: 20px; + /* padding-left: 10px; */ + font-weight: bold; + font-size: 15px; +} +/* h2 td { - font-size: smaller; color: #ffffff; - background-color: #00a4d2; /*hellblau*/ + background-color: #00a4d2; /*hellblau } h2 a { @@ -419,23 +649,38 @@ h2 a:hover color: #ffffff; text-decoration:none; } -h3 +/* h3 { - font-size: smaller; font-weight: bold; color: #008E74; + font-size: 1em; } h4 { - font-size: smaller; + font-size: 0.8em; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; color: #008E74; - /*cursor: hand; */ text-decoration: none; +} */ +h3 +{ + margin: 0px; + padding-top: 20px; + padding-bottom: 2px; + font-weight: bold; + font-size:13px; +} +h4 +{ + margin: 0px; + padding: 0px; + text-decoration: underline; + font-weight: normal; + font-size:13px; } .error { @@ -446,33 +691,51 @@ font.ContentHeader color: #FFFFFF; } -#news +/* #news { -} -#news .news +} */ +/* #news .news { - /*-moz-border-radius-topright: 20px;*/ + -moz-border-radius-topright: 20px; -moz-border-radius-topleft: 10px; width: 100%; border: 1px solid #E0E0E0; - background-color: #F0F0F0; - + background-color: #F0F0F0; } -#news .news .titel +#news .news .titel table { font-weight: bold; - font-size: smaller; - /*font-size: normal; - */ padding: 0px 10px 0px 10px; - white-space : nowrap; + white-space: nowrap; +} */ +#news .news +{ + width: 99%; + background-color: #A5AFB6; /* grauvariante A5AFB6 */ +} +#news .news .titel table +{ + padding: 3px 10px 3px 10px; + color: #ffffff; + font-weight: 500; } #news .news .text { - background-color: #FCFCFC; - padding: 0px 10px 0px 10px; + background-color: #E9ECEE; /* grauvariante E9ECEE */ + padding: 10px; } +/* Margin von ersten und letzten P tag entfernen, da sonst + breite Raender entstehen koenne*/ +#news .news .text p:first-child +{ + margin-top:0px; + +} +#news .news .text p:last-child +{ + margin-bottom:0px; +} /* Images */ img.testtoolfrage @@ -489,11 +752,37 @@ img { border: 0; } +img.lvplanbutton +{ + border:0; + vertical-align: bottom; +} img#layout { border: 1px solid #AAAAAA; } - +img.lv +{ + width: 40px; + height: 40px; + padding-bottom: 5px; +} +img.header_left +{ + display: none; +} +img.header_right +{ + display: none; +} +img.header_logo +{ + position: absolute; + left: 16px; + top: 3%; + z-index: 5000; + height: 7%; +} /*Farben*/ .grey { @@ -529,6 +818,31 @@ img#layout } +.studentnote +{ + font-weight:bold; +} + +.benotungstool_tabs +{ + border-top: 1px solid gray; + border-left: 1px solid gray; + border-right: 1px solid gray; + text-align: center; +} +.benotungstool_tabs_active +{ + border-top: 2px solid gray; + border-left: 2px solid gray; + border-right: 2px solid gray; + background-color: #eeeeee; + text-align: center; +} +.benotungstool_subtab +{ + border-top: 1px solid gray; + border-bottom: 1px solid gray; +} /*aussortiert*/ @@ -555,10 +869,235 @@ img#layout margin-bottom: 0px; margin-top: 0px; }*/ - .error { color: #ff0000; } +.ok +{ + color: green; +} .ausblenden {display:none;} -.einblenden {display:block;} \ No newline at end of file +.einblenden {display:block;} + +/* Inaktive Elemente in einem DropDown */ +option.inactive +{ + text-decoration:line-through; +} + +/* Difference Engine */ +.diffchange-inline +{ + background-color: yellow; +} +.diff-deletedline +{ + background-color: lightgray; +} +.diff-marker +{ + background-color: none; +} +.diff-addedline +{ + background-color: lightgreen; +} + +.suchmarker +{ + font-weight: bold; + text-decoration: underline; + font-size: medium; +} +.suchergebnis:hover +{ + background-color: #EEEEEE; +} +.suchergebnis a +{ + font-weight: bold; +} +.suchicon +{ + margin:0px; +} +.suchicon:hover +{ + cursor:pointer; + cursor:hand; +} + + +/**** Menubox-Effekt am Seitenrand. Nettes Feature aber dzt. nicht sinnvoll einsetzbar **** + +div.hoverbox div.preview div.hoverbox_inhalt +{ + display:none; +} + +div.preview +{ + position:relative; +} + + +div.hoverbox div.preview:hover div.hoverbox_inhalt +{ + display: block; + position: absolute; + top: -21px; + left: -158px; + z-index: 1; + border:1px; + border-color:grey; + background-color:white; +} +table.hoverbox +{ + + border:1px; + border-style:solid; + border-color:grey; +} +*/ + +/**** Kalender-Jump-Effekt im LV-Plan ****/ + +div.hoverbox div.preview div.hoverbox_inhalt +{ + display:none; + vertical-align: top; +} +div.preview +{ + position: relative; + vertical-align: top; +} +div.hoverbox div.preview:hover div.hoverbox_inhalt +{ + display: block; + position: absolute; + top: 15px; + left: -190px; + z-index: 2; + border:1px; + border-color:grey; + background-color:white; +} +table.hoverbox +{ + border:1px; + border-style:solid; + border-color:grey; + padding: 5px; +} + +/**** Gestaltung des Hauptmenues ****/ +ul.menu +{ + padding:0; + margin:0; + font-family:Arial, Helvetica, sans-serif; + color:#0086CC; + font-size:13px; + line-height:15px; + width:200px; + list-style-type:none; +} +/* #meine_lv +{ + padding: 0px; + margin: 0 0 0 0px; + font-family:Arial, Helvetica, sans-serif; + color:#0086CC; + font-size:13px; + line-height:15px; + width:250px; + list-style-type:none; +} +#meine_lv ul +{ + font-family:Arial, Helvetica, sans-serif; + color:#0086CC; + font-size:13px; + line-height:15px; + width:250px; + list-style-type:none; +} */ +#menu +{ + padding:0; + margin:0; + font-family:Arial, Helvetica, sans-serif; + color:#0086CC; + font-size:13px; + line-height:18px; + width:250px; + list-style-type:none; +} +#menu a +{ + display:block; + padding:0 0 0 5px; + outline:none; + text-decoration:none; + /* border-top: solid 1px #689CC1;*/ + + /* background-image:url(../skin/images/icon-plus.png); + background-repeat:no-repeat; + background-position: center left; */ +} +#menu li +{ + margin:0 0 0 10px; + padding: 5px 0 0 0; + display:block; + border:1px solid #FFFFFF; +} + +#menu a.selected +{ + padding:0 0 0 5px; + /* font-weight: bold; + background-image:url(../skin/images/icon-minus.png); + background-repeat:no-repeat; + background-position: center left; */ +} +/* #menu a:hover +{ + background-image:url(../skin/images/icon-minus.png); + background-repeat:no-repeat; + background-position: center left; + padding:0 0 0 15px; +} */ +#menu a:hover +{ + text-decoration: underline; +} +#menu a.leaf +{ + color: #616B71; /* 0086CC */ + padding-left: 5px; + /* background-image:url(../skin/images/square_lightblue_small.png); + background-repeat:no-repeat; + background-position: center left 15px; */ + + /* border-top: none;*/ +} +/* #menu a.leaf:hover +{ + background-image:url(../skin/images/icon-plus.png); + background-image:url(../skin/images/square_blue_medium.png); + background-repeat:no-repeat; + background-position: center left 6px; +} */ + + + +/* #menu ul +{ + padding:0; + margin:0; + list-style-type:none; +} */ diff --git a/skin/styles/tw.css b/skin/styles/tw.css index 535e8d899..2888494f5 100644 --- a/skin/styles/tw.css +++ b/skin/styles/tw.css @@ -2,17 +2,42 @@ /* Allgemein */ body { - background-color: White; + background-color: white; font-family: Arial, Helvetica, sans-serif; - font-size: 0.8em; -} -iframe -{ + font-size: 13px; + height: 100%; + width: 100%; margin:0px; border-width:0px; border-style:none; padding:0px; } +body.main /* Workaround fuer Farbverlauf im IE statt ShadowBox */ +{ + background-color: white; + font-family: Arial, Helvetica, sans-serif; + font-size: 13px; + height: 100%; + width: 100%; + margin:0px; + border-width: 2px; + border-style: none; + padding:0px; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc',endColorstr='#ffffff'); +} +html +{ + height: 100%; +} +iframe +{ + margin:0px; + padding:0px; + height: 100%; + + /* border-width:1px; + border-style:solid; */ +} textarea { font-family: Arial, Helvetica, sans-serif; @@ -21,22 +46,36 @@ form { font-family: Arial, Helvetica, sans-serif; } +p +{ + margin-top: 0px; +} hr { color:#CCCCCC; height:1px; } -img +li, ul { - border: 0; + list-style-image:url(images/square_blue.png); + padding-left: 0px; + padding-top: 2px; + padding-bottom: 2px; + margin-left: 6px; } -@media screen { +li.ui-menu-item +{ + list-style-image:none; +} +/* @media screen { */ #menue { - top:70px; - width:19%; - height:86%; - z-index:1000; + bottom: 2%; + width: 17%; + height: 81%; + z-index: 1000; + padding: 0px; + margin: 0px; } /*Alle au�er IE 6*/ html>body #menue @@ -46,52 +85,78 @@ html>body #menue #content { - width:80%; - height:85%; - left:20%; + bottom: 2%; + width:81%; + height:81%; + left:18%; + padding: 0px; + margin: 0px; +} +#content /* Hack für IE8 */ +{ + *width: 75\%; + *left: 21\%; } /*Alle au�er IE 6*/ html>body #content { position:absolute; } -} /* Druckausgabe */ - - -@media print { -.home_logo +@media print { - display:none; -} -.header_line -{ -display:none; -} - -#menue -{ -display:none; -} -#GlobalMenu -{ -display:none; -} - -#content -{ - width:800px; - height:900px; - left:0px; - overflow: hidden; -} + + .home_logo + { + display:none; + } + /*.header_line + { + display:none; + }*/ + + #menue + { + display:none; + } + #GlobalMenu + { + display:none; + } + + #content + { + width:800px; + height:900px; + left:0px; + overflow: hidden; + } } input.TextBox { background-color: White; } +/* Such-Feld CIS-Suche */ +input.search +{ + background-color: #E9ECEE; + border-width: 1px; + border-style:solid; + border-color: #A5AFB6; +} +/* Login-Button CIS-Seite */ +input.cis_login +{ + cursor: pointer; + color: #666666; + font-size: 20px; + border: 1px solid #A5AFB6; + background-color: #E9ECEE; + width: 150px; + height: 35px; +} #GlobalMenu { margin-top: 3px; @@ -102,15 +167,8 @@ input.TextBox background-image:url(styles/tw/TWLogo_klein.jpg); width:170px; height:53px; +} -} -.header_line -{ - background-image:url(styles/tw/header_line.jpg); - background-repeat:repeat-x; - width:100%; - height:3px; -} /*Vor IE/Mac verstecken \ *html .header_line{ height:0.5px; @@ -135,14 +193,16 @@ div.tip } /* Links */ -a +a /*allgmeiner Link, Hauptmenuelinks*/ { - color: #008381; text-decoration: none; + color: #0086CC; /*tw-blau*/ + text-decoration: none; cursor: pointer; } -a:hover +a:hover /*link ohne Item-Definition*/ { - color: Black; text-decoration: none; + color: #0086CC; /*tw-blau*/ + text-decoration: underline; } a.ItemTesttool { @@ -155,50 +215,49 @@ a:hover.ItemTesttool color: black; line-height:25px; } -a.HyperItem +a.HyperItem /* ? */ { color: Black; text-decoration: none; font-weight: bold; } -a:hover.HyperItem +a:hover.HyperItem /* ? */ { color: #008381; text-decoration: none; font-weight: bold; } -a[onClick]:hover.Item +a[onClick]:hover.Item /* ? */ { color: Black; text-decoration: none; } -a:hover.Item +a:hover.Item /*allgemeine Links, Hauptmenuelink*/ +{ + color: #0086CC; /*tw-blau*/ + text-decoration: underline; +} +a.Item2 /* zB in den Lehrveranstaltungen (Buttons) verwendet bei den Lektoren */ { color: Black; text-decoration: none; } -a.Item2 -{ - color: Black; text-decoration: none; -} -a:hover.Item2 +a:hover.Item2 /* zB in den Lehrveranstaltungen (Buttons) verwendet bei den Lektoren */ { color: #008381; text-decoration: none; } -a.MenuItem +a.MenuItem /* Hauptmenuelink zum aufklappen */ { - color: #008381; text-decoration: none; + color: #0086CC; text-decoration: none; font-weight: bold; } -a:hover.MenuItem +a:hover.MenuItem /* Hauptmenuelink zum aufklappen */ { - color: Black; text-decoration: none; + color: #0086CC; /*tw-blau*/ + text-decoration: none; font-weight: bold; } -A.hilfe -{ - text-decoration:none; -} -A.hilfe:hover -{ - text-decoration:none; - cursor:help; +a:focus.MenuItem /* Hauptmenuelink zum aufklappen */ +{ + color: #0086CC; /*tw-blau*/ + text-decoration: none; + font-weight: bold; } A.stpl_detail { @@ -226,19 +285,32 @@ a.head:hover /* Tables */ TABLE { - font-size: 1em; + font-size: 13px; +} +TABLE.header +{ + width:100%; + height:100%; + /* background-image:url(../skin/images/header.png); */ + /* background-repeat:no-repeat; */ + background-color: white; +} +TABLE.cmstable /* Die Haupttable aller CMS-Contentseiten */ +{ + margin: 0px; + padding: 0px; + border: none; + width: 100%; } - TABLE.tabcontent { margin: 0px; padding: 0px; border-style: none; width: 100%; - /* - cellspacing: 0; - cellpadding: 0; - */ + background-color: white; + vertical-align: top; + border-spacing:0; } TABLE.menue @@ -260,28 +332,36 @@ TABLE.tabcontent2 margin: 0px; padding: 0px; border-style: none; - /* - cellspacing: 0; - cellpadding: 0; - */ } TABLE.tabborder { - /* - cellspacing: 0; - cellpadding: 1; - */ width: 100%; /*border: 1px solid black; foo*/ } TABLE#tabterm { - /* - cellpadding: 0; - cellspacing: 0; - */ margin:auto; } +td.rand /* Seitenraender des CIS */ +{ + font-size: 11px; + padding-top: 0px; + padding-left: 6px; + width: 3%; + height: 100%; + vertical-align: middle; +} +td.boxshadow /* Farbverlauf im Hintergrund der CIS*/ +{ + position: fixed; + vertical-align:top; + width:94%; + box-shadow: 0px 100px 0px 0px #FFFFFF, /* Unterer weisser Rand bei sehr kleinen Aufloesungen */ + 0px 0px 5px 5px #888, /* schmaler dunkler Schatten */ + /*0px 300px 5px 5px #888, /* schmaler dunkler Schatten unten bei sehr kleinen Aufloesungen*/ + 20px 20px 70px 30px #DDDDDD, /* heller Verlauf rechts */ + -20px 20px 70px 30px #DDDDDD; /* heller Verlauf links */ +} td.ContentHeader { background-color: #008381; /*gr�n*/ @@ -290,16 +370,13 @@ td.ContentHeader } td.ContentHeader2 { - background-color: #CCCCCC; /*mittel-grau */ + color: #0086CC; /*tw-blau */ font-weight: normal; - height: 19px; - } td.ContentHeader3 { - background-color: #CCCCCC; /*mittel-grau */ + color: #0086CC;; /*tw-blau */ font-weight: bold; - height: 19px } td.MarkLine { @@ -345,7 +422,8 @@ td:hover.ItemTesttool } td.tdwidth10 { - width: 10px; + width: 5px; + /* width: 10px; */ } td.tdwidth30 { @@ -364,11 +442,44 @@ td.tdborder td.tdwrap { white-space: nowrap; + color: #0086CC; } - -td.tdvertical +td.tdvertical /* Für Ausrichtung der Icons bei der LV-Ãœbersicht */ { vertical-align: top; + padding: 10px 0 10px 0; + width: 33.33%; + /* height: 100px; */ +} +td.menubox /* Navigationsboxen in den CIS-Contentseiten */ +{ + width: 20%; + height: 100%; + background-color: #eeeeee; + border-width: 1px; + padding: 20px 15px 20px 15px; + vertical-align: middle; +} +td.menubox p +{ + line-height:10px; +} +td.cmscontent +{ + vertical-align: top; + padding-right: 25px; + padding-left: 0px; +} +td.teambox +{ + vertical-align: top; + padding-top: 20px; + height: 1000px; /* Damit die menubox im IE mit der richtigen höhe angezeigt wird */ +} +tr.header +{ + position:relative; + height: 10%; } TR.liste { @@ -391,10 +502,6 @@ TR.tryellow TABLE#zeitsperren { /*border: 1px solid black; foo*/ - /* - cellspacing: 0; - cellpadding: 0; - */ width:100%; } TABLE#zeitsperren TH @@ -411,25 +518,27 @@ TABLE#zeitsperren TD.feiertag } TABLE#zeitsperren TD { - background-color: #EEEEEE /*grau fast wei�*/ + background-color: #EEEEEE; /*grau fast wei�*/ } -/* Stundeplan */ +/* Stundenplan */ TABLE.stdplan { - /*border: 1px solid black; foo*/ - /* - cellspacing: 0; - cellpadding: 0; - */ + margin: 0px; + padding: 0px; + /* border: 1px solid; */ + width: 100%; + background-color: white; + vertical-align: top; + border-spacing:1; } TABLE.stdplan TH { - background-color: #DDDDDD; + background-color: #A5AFB6; } TABLE.stdplan TD { - background-color: #EEEEEE + background-color: #E9ECEE; } .row-even { /*liste1*/ background-color:#f2f2f2; @@ -441,16 +550,55 @@ TABLE.stdplan TD /* Fonts */ -h1 +/*h1 { color: #ffffff; - background-color: #008381; /*gruen*/ + background-color: #008381; /*gruen font-weight: bold; padding-top: 2px; padding-bottom: 2px; padding-left: 4px; font-size: 1em; +}*/ +/* h1 +{ + color: black; + padding-top: 2px; + padding-bottom: 2px; + width:20%; + white-space:nowrap; + padding-left: 10px; + font-size: 20px; + letter-spacing: 2px; + border-bottom:solid 1px #0086CC; + font-weight:normal; +} */ +h1 +{ + color: black; + padding: 0px; + padding-bottom: 20px; + /* padding-left: 10px; */ + /* width:20%; */ + margin:0px; + white-space:nowrap; + font-size: 20px; + /* letter-spacing: 2px; + border-bottom:solid 1px #0086CC;*/ + font-weight:normal; } +/* h1.news +{ + color: black; + padding: 0px; + padding-bottom: 10px; + padding-left: 10px; + width:20%; + margin:0px; + white-space:nowrap; + font-size: 20px; + font-weight:normal; +} */ h1 td { color: #ffffff; @@ -466,19 +614,36 @@ h1 a:hover text-decoration:none; } -h2 +/* h2 { font-size: 1em; - background-color: #CCCCCC; /*mittel-grau */ - font-weight: normal; + background-color: #CCCCCC; */ /*mittel-grau */ +/* font-weight: normal; height: 19px; - padding-top: 2px; - padding-left: 2px; + padding-top: 2px; */ + /*padding-left: 2px; } -h2 td +/* h2 +{ + font-size: 16px; + + padding-top: 2px; + letter-spacing: 2px; + padding-left: 10px; +} */ +h2 +{ + margin: 0px; + padding-top: 0px; + padding-bottom: 15px; + /* padding-left: 10px; */ + font-weight: bold; + font-size: 15px; +} +/* h2 td { color: #ffffff; - background-color: #00a4d2; /*hellblau*/ + background-color: #00a4d2; /*hellblau } h2 a { @@ -489,7 +654,7 @@ h2 a:hover color: #ffffff; text-decoration:none; } -h3 +/* h3 { font-weight: bold; color: #008E74; @@ -504,8 +669,23 @@ h4 font-variant: normal; text-transform: none; color: #008E74; - /*cursor: hand; */ text-decoration: none; +} */ +h3 +{ + margin: 0px; + padding-top: 0px; /* 20px */ + padding-bottom: 2px; + font-weight: bold; + font-size:13px; +} +h4 +{ + margin: 0px; + padding: 0px; + text-decoration: underline; + font-weight: normal; + font-size:13px; } .error { @@ -516,12 +696,12 @@ font.ContentHeader color: #FFFFFF; } -#news +/* #news { -} -#news .news +} */ +/* #news .news { - /*-moz-border-radius-topright: 20px;*/ + -moz-border-radius-topright: 20px; -moz-border-radius-topleft: 10px; width: 100%; border: 1px solid #E0E0E0; @@ -532,11 +712,22 @@ font.ContentHeader font-weight: bold; padding: 0px 10px 0px 10px; white-space: nowrap; +} */ +#news .news +{ + width: 99%; + background-color: #A5AFB6; /* grauvariante A5AFB6 */ +} +#news .news .titel table +{ + padding: 3px 10px 3px 10px; + color: #ffffff; + font-weight: 500; } #news .news .text { - background-color: #FCFCFC; - padding: 5px 10px 0px 10px; + background-color: #E9ECEE; /* grauvariante E9ECEE */ + padding: 10px; } /* Margin von ersten und letzten P tag entfernen, da sonst @@ -566,11 +757,45 @@ img { border: 0; } +img.lvplanbutton +{ + border:0; + vertical-align: bottom; +} img#layout { border: 1px solid #AAAAAA; } - +img.lv +{ + width: 40px; + height: 40px; + padding-bottom: 5px; +} +img.header_left +{ + position: absolute; + left: 0px; + z-index: 1; + max-width: 100%; + height: 16%; +} +img.header_right +{ + position: absolute; + right: 0px; + z-index: 2; + max-width: 100%; + height: 16%; +} +img.header_logo +{ + position: absolute; + left: 16px; + top: 3%; + z-index: 5000; + height: 7%; +} /*Farben*/ .grey { @@ -715,3 +940,177 @@ option.inactive cursor:pointer; cursor:hand; } + + +/**** Menubox-Effekt am Seitenrand. Nettes Feature aber dzt. nicht sinnvoll einsetzbar **** + +div.hoverbox div.preview div.hoverbox_inhalt +{ + display:none; +} + +div.preview +{ + position:relative; +} + + +div.hoverbox div.preview:hover div.hoverbox_inhalt +{ + display: block; + position: absolute; + top: -21px; + left: -158px; + z-index: 1; + border:1px; + border-color:grey; + background-color:white; +} +table.hoverbox +{ + + border:1px; + border-style:solid; + border-color:grey; +} +*/ + +/**** Kalender-Jump-Effekt im LV-Plan ****/ + +div.hoverbox div.preview div.hoverbox_inhalt +{ + display:none; + vertical-align: top; +} +div.preview +{ + position: relative; + vertical-align: top; +} +div.hoverbox div.preview:hover div.hoverbox_inhalt +{ + display: block; + position: absolute; + top: 15px; + left: -190px; + z-index: 2; + border:1px; + border-color:grey; + background-color:white; +} +table.hoverbox +{ + border:1px; + border-style:solid; + border-color:grey; + padding: 5px; +} + +/**** Gestaltung des Hauptmenues ****/ +ul.menu +{ + padding:0; + margin:0; + font-family:Arial, Helvetica, sans-serif; + color:#0086CC; + font-size:13px; + line-height:15px; + width:200px; + list-style-type:none; +} +/* #meine_lv +{ + padding: 0px; + margin: 0 0 0 0px; + font-family:Arial, Helvetica, sans-serif; + color:#0086CC; + font-size:13px; + line-height:15px; + width:250px; + list-style-type:none; +} +#meine_lv ul +{ + font-family:Arial, Helvetica, sans-serif; + color:#0086CC; + font-size:13px; + line-height:15px; + width:250px; + list-style-type:none; +} */ +#menu +{ + padding:0; + margin:0; + font-family:Arial, Helvetica, sans-serif; + color:#0086CC; + font-size:13px; + line-height:18px; + width:250px; + list-style-type:none; +} +#menu a +{ + display:block; + padding:0 0 0 5px; + outline:none; + text-decoration:none; + /* border-top: solid 1px #689CC1;*/ + + /* background-image:url(../skin/images/icon-plus.png); + background-repeat:no-repeat; + background-position: center left; */ +} +#menu li +{ + margin:0 0 0 10px; + padding: 5px 0 0 0; + display:block; + border:1px solid #FFFFFF; +} + +#menu a.selected +{ + padding:0 0 0 5px; + /* font-weight: bold; + background-image:url(../skin/images/icon-minus.png); + background-repeat:no-repeat; + background-position: center left; */ +} +/* #menu a:hover +{ + background-image:url(../skin/images/icon-minus.png); + background-repeat:no-repeat; + background-position: center left; + padding:0 0 0 15px; +} */ +#menu a:hover +{ + text-decoration: underline; +} +#menu a.leaf +{ + color: #616B71; /* 0086CC */ + padding-left: 5px; + /* background-image:url(../skin/images/square_lightblue_small.png); + background-repeat:no-repeat; + background-position: center left 15px; */ + + /* border-top: none;*/ +} +/* #menu a.leaf:hover +{ + background-image:url(../skin/images/icon-plus.png); + background-image:url(../skin/images/square_blue_medium.png); + background-repeat:no-repeat; + background-position: center left 6px; +} */ + + + +/* #menu ul +{ + padding:0; + margin:0; + list-style-type:none; +} */