code.vuplus.com Git - vuplus_dvbapp-plugin/blob - webinterface/src/web-data/style.css

   1 body {
   2         text-align:left;
   3         vertical-align: top;
   4         margin:0px;
   5         font-family:Arial,sans-serif;
   6         font-size: 12px;
   7         background-color:#EEE;
   8         color:#444;
   9 }
  10
  11 a:link { color:#444; }
  12 a:visited { color:#444; }
  13 a:active { color:#444; }
  14
  15 hr{ border: 1px solid #BBB;
  16         margin-left: 3px;
  17         margin-right: 3px;
  18 }
  19
  20 form{
  21         margin: 0px;
  22         padding: 0px;
  23 }
  24
  25 /**************************************************************
  26 Make the ServiceList Table scrollable**************************
  27 ***************************************************************/
  28
  29 /* define height and width of scrollable area. Add 16px to width for scrollbar          */
  30 div.BodyContent {
  31         border: 1px solid #000;
  32         height: 455px;
  33         overflow: auto;
  34         margin: 0px 9px 0px;
  35         font-size: 12px;
  36 }
  37
  38 div.BodyContentChannellist {
  39         clear: both;
  40         height: 450px;
  41         overflow: auto;
  42 /*      width: 780px; */
  43 }
  44
  45 .BodyContentChannellist{
  46         font-size: 12px;
  47 }
  48
  49 /* Reset overflow value to hidden for all non-IE browsers. */
  50 html>body div.BodyContentChannellist {
  51         overflow: hidden;
  52         width: 780px;
  53 }
  54
  55 /* define width of table. IE browsers only                 */
  56 div.BodyContentChannellist table {
  57         float: left;
  58         width: 760px;
  59         height: 450px;
  60 }
  61
  62 /* define width of table. Add 16px to width for scrollbar.           */
  63 /* All other non-IE browsers.                                        */
  64 html>body div.BodyContentChannellist table {
  65         width: 780px;
  66 }
  67
  68 /* set table header to a fixed position. WinIE 6.x only                                       */
  69 /* In WinIE 6.x, any element with a position property set to relative and is a child of       */
  70 /* an element that has an overflow property set, the relative value translates into fixed.    */
  71 /* Ex: parent element DIV with a class of tableContainer has an overflow property set to auto */
  72 thead.fixedHeader tr {
  73         position: relative
  74 }
  75
  76 /* set THEAD element to have block level attributes. All other non-IE browsers            */
  77 /* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
  78 html>body thead.fixedHeader tr {
  79         display: block
  80 }
  81
  82 /* make the TH elements pretty */
  83 thead.fixedHeader th {
  84         background: #0066CC;
  85         border: 0px;
  86         font-weight: normal;
  87         padding: 4px 3px;
  88         text-align: left
  89 }
  90
  91 /* make the A elements pretty. makes for nice clickable headers                */
  92 thead.fixedHeader a, thead.fixedHeader a:link, thead.fixedHeader a:visited {
  93         color: #FFF;
  94         display: block;
  95         text-decoration: none;
  96         width: 100%
  97 }
  98
  99 /* make the A elements pretty. makes for nice clickable headers                */
 100 /* WARNING: swapping the background on hover may cause problems in WinIE 6.x   */
 101 thead.fixedHeader a:hover {
 102         color: #FFF;
 103         display: block;
 104         text-decoration: underline;
 105         width: 100%
 106 }
 107
 108 /* define the table content to be scrollable                                              */
 109 /* set TBODY element to have block level attributes. All other non-IE browsers            */
 110 /* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
 111 /* induced side effect is that child TDs no longer accept width: auto                     */
 112 html>body tbody.scrollContent {
 113         display: block;
 114         height: 422px;
 115         /* This is realy bad for resolution below 1280x1024 */
 116         overflow: auto;
 117         width: 100%;
 118 }
 119
 120 /* make TD elements pretty. Provide alternating classes for striping the table */
 121 /* http://www.alistapart.com/articles/zebratables/                             */
 122
 123
 124 tbody.scrollContent td, tbody.scrollContent tr.normalRow td {
 125         background: #FFF;
 126         border-bottom: none;
 127         border-left: none;
 128         border-right: 1px solid #CCC;
 129         border-top: 1px solid #DDD;
 130         padding: 2px 3px 3px 4px;
 131 }
 132
 133 /* define width of TH elements: 1st, 2nd, and 3rd respectively.          */
 134 /* Add 16px to last TH for scrollbar padding. All other non-IE browsers. */
 135 /* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors        */
 136 html>body thead.fixedHeader th {
 137         width: 780px;
 138 }
 139
 140 /* define width of TD elements: 1st, 2nd, and 3rd respectively.          */
 141 /* All other non-IE browsers.                                            */
 142 /* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors        */
 143 html>body tbody.scrollContent td {
 144 width: 764px;
 145 }
 146
 147 /****************************************
 148 normal stylesheet-stuff******************
 149 *****************************************/
 150
 151 #Main{
 152         width:960px;
 153         background-color: #AAA;
 154         text-align: left;
 155         margin: 0;
 156         padding: 0;
 157         overflow: auto;
 158         vertical-align: top;
 159         cursor: default;
 160         border: 1px solid #000;
 161 }
 162
 163 #Content{
 164         vertical-align: middle;
 165         float: left;
 166         background-color: #FFF;
 167         width: 800px;
 168         padding-bottom: 10px;
 169         border-right: 1px solid #000;
 170         border-left: 1px solid #000;
 171 }
 172
 173 #CurrentService {
 174         font-family: Arial,sans-serif;
 175         font-size: 14px;
 176         font-weight: bold;
 177         float: left;
 178         background-color: #0066CC;
 179         color: #FFFFFF;
 180
 181         width: 55%;
 182         height: 20px;
 183 }
 184
 185 #CurrentEvent {
 186         font-family: Arial,sans-serif;
 187         font-size: 14px;
 188         font-weight: bold;
 189         float: left;
 190         background-color: #0066CC;
 191         color: #FFFFFF;
 192         text-align: right;
 193         width: 45%;
 194         height: 20px;
 195 }
 196
 197 #VolumePanel {
 198         font-family:Arial,sans-serif;
 199         font-size:14px;
 200         font-weight:bold;
 201
 202         float:left;
 203         background-color: #0066CC;
 204         color: #FFFFFF;
 205
 206         width:25%;
 207         height:20px;
 208 }
 209
 210 #CurrentTime {
 211         font-family:Arial,sans-serif;
 212         font-size:14px;
 213         font-weight:bold;
 214
 215         float:left;
 216         text-align:right;
 217         background-color: #0066CC;
 218         color: #FFFFFF;
 219
 220         width: 11%;
 221         height: 20px;
 222 }
 223
 224 #SignalPanel {
 225         font-family:Arial,sans-serif;
 226         font-size:14px;
 227         font-weight:bold;
 228
 229         float:left;
 230
 231         background-color: #0066CC;
 232         color: #FFFFFF;
 233         text-align:right;
 234
 235         width:20px;
 236         height:20px;
 237 }
 238 #StreaminterfaceButton {
 239         font-family:Arial,sans-serif;
 240         font-size:14px;
 241         font-weight:bold;
 242
 243         float:left;
 244
 245         background-color: #0066CC;
 246         color: #FFFFFF;
 247         text-align:right;
 248
 249         width:20px;
 250         height:20px;
 251 }
 252
 253
 254 #RecordButton {
 255         float:left;
 256         background-color: #0066CC;
 257         width:20px;
 258         height:20px;
 259 }
 260
 261 #ServiceInfo{
 262         width:800px;
 263         height: 20px;
 264         border-bottom: 1px solid #000;
 265         float:none;
 266         clear:both;
 267         padding: 0 0 0;
 268         margin: 0 0 0;
 269         background-color: #0066CC;
 270         color: #FFFFFF;
 271 }
 272
 273 #nav{
 274         float: left;
 275         width: 117px;
 276         background-color: #AAA;
 277 }
 278
 279 #navTable{
 280         background-color: #EEE;
 281         vertical-align: middle;
 282         font-size: 14px;
 283         font-weight: bold;
 284         width: 100%;
 285         margin:0 0 0 0;
 286         padding:0 0 0 0;
 287 }
 288
 289 #NavHd{
 290         background-color: #0066CC;
 291         color: #FFFFFF;
 292         font-size:10px;
 293         font-weight: bold;
 294         height: 20px;
 295         vertical-align: middle;
 296 }
 297 #RequestIndicator{
 298         display: inline;
 299         vertical-align: middle;
 300         font-size:14px;
 301         font-weight: bold;
 302         height:20px;
 303 }
 304
 305 #EventNowNext{
 306 }
 307
 308 #updates{
 309         visibility: hidden;
 310 }
 311
 312 .navMenuPanel{
 313         background-color: #BBB;
 314 }
 315 .navMenuHeader{
 316         font-size: 14px;
 317         border-top: 1px solid #000;
 318         height: 20px;
 319 }
 320
 321 .navMenuContent{
 322         font-size: 12px;
 323         font-weight: normal;
 324         background-color: #EEE;
 325         border: 0px;
 326 }
 327 .navMenuItem{
 328         font-size: 12px;
 329 }
 330
 331 .divblock{
 332         width:100%;
 333         float:none;
 334         clear:both;
 335 }
 336
 337 .event{
 338         font-size:12px;
 339         width:100%;
 340         font-weight:bold;
 341         background-color: #DDEEFF;
 342         margin-bottom: 1px;
 343         cursor:help;
 344 }
 345 .eventRA{
 346         font-size:12px;
 347         width:100%;
 348         font-weight:bold;
 349         text-align:right;
 350         background-color: #DDEEFF;
 351         margin-bottom: 1px;
 352         cursor:help;
 353 }
 354
 355 .eventExtDesc{
 356         color: #777;
 357         background-color: #FFF;
 358         font-size:12px;
 359         margin-bottom: 1px;
 360         width:100%;
 361 }
 362
 363 .bgMain{
 364         background-color: #FFF;
 365         width: 100%;
 366 }
 367 .sListHeader{
 368         font-size: 14px;
 369         font-weight: bold;
 370         color: #FFF;
 371         float:left;
 372         width:50%;
 373 }
 374 .sListSearch{
 375         font-size: 14px;
 376         float:left;
 377         width:50%;
 378         text-align: right;
 379 }
 380 form.sListSearch{
 381         text-align: right;
 382 }
 383 .sListSName{
 384         font-size: 14px;
 385         font-weight: bold;
 386         float:left;
 387         width:661px;
 388 }
 389
 390 a.sListSLink{
 391         display: block;
 392         width: 656px;
 393         height: 100%;
 394         text-decoration: none;
 395 }
 396
 397 a.sListSLink:hover{
 398         background-color: #DDD;
 399 }
 400
 401 .sListExt{
 402         border-left: 1px solid #CCC;
 403         float:left;
 404         width:90px;
 405         text-align: right;
 406 }
 407 .sListEPGTime{
 408         float:left;
 409         width:60px;
 410         text-align: left;
 411 }
 412 .sListEPGTitle{
 413         border-left: 1px solid #CCC;
 414         border-right: 1px solid #CCC;
 415         float: left;
 416         width:600px;
 417         text-align: left;
 418 }
 419 .sListEPGDuration{
 420         float:left;
 421         width:75px;
 422         text-align: right;
 423 }
 424 .tListSName{
 425 /*      float:left;*/
 426         width: 180px;
 427         text-align: left;
 428 }
 429 .tListTitle{
 430 /*      float:left;*/
 431         width: 150px;
 432         text-align: left;
 433 }
 434 .tListDescr{
 435 /*      float:left;*/
 436         width: 150px;
 437         text-align: left;
 438 }
 439 .tListRepeat{
 440 /*      float:left;*/
 441         width: 70px;
 442         text-align: left;
 443 }
 444 .tListDuration{
 445 /*      float:left;*/
 446         width: 70px;
 447         text-align: left;
 448 }
 449 .tListBegin{
 450 /*      float:left;*/
 451         width: 100px;
 452         text-align: left;
 453 }
 454 .tListEnd{
 455 /*      float:left;*/
 456         width: 100px;
 457         text-align: left;
 458 }
 459 .tListAfter{
 460 /*      float:left;*/
 461         width: 85px;
 462         text-align: left;
 463 }
 464 .tListOption{
 465 /*      float:left;*/
 466         width: 80px;
 467         text-align: center;
 468 }
 469 #TimerColor0 {
 470         color: #000000;
 471 }
 472 #TimerColor1 {
 473         color: #00BCBC;
 474         background-color: #DDD;
 475 }
 476 #TimerColor2 {
 477         color: #9F1919;
 478         background-color: #DDD;
 479 }
 480 #TimerColor3 {
 481         color: #00BCBC;
 482         background-color: #DDD;
 483 }
 484
 485 .pageHeader {
 486         width:100%;
 487         background-color: #0066CC;
 488         color: #FFF;
 489         font-weight:bold;
 490 }
 491
 492 .aboutHeader {
 493         width:100%;
 494         color:#444444;
 495         font-weight:bold;
 496         background-color:#DDEEFF;
 497 }
 498
 499 .about {
 500         border: 1px solid #AAA;
 501         width: 100%;
 502 }
 503
 504 .fullwidth {
 505         width: 100%;
 506 }
 507
 508 .aboutSection{
 509         width:100%;
 510 }
 511
 512 .aboutSectionLeft{
 513         width:50%;
 514         vertical-align: top;
 515 }
 516
 517 .aboutSectionRight{
 518         width:50%;
 519         vertical-align: top;
 520 }
 521
 522 .aboutElement{
 523         float: none;
 524 }
 525
 526 .aboutElementLeft{
 527         font-weight:bold;
 528         width: 45%;
 529         text-align: left;
 530 }
 531
 532 .aboutElementRight{
 533         width: 55%;
 534 }