rt/share/static/css/mobile.css

   1 body {
   2     font-family: helvetica, arial, sans-serif;
   3     background-color: #ccf;
   4     margin: 0;
   5 }
   6
   7 h1 {
   8     font-size: 1.2em;
   9     padding-top: 0.5em;
  10     padding-left: 0.2em;
  11     display: block;
  12     background-color: #fff;
  13     margin: 0;
  14 }
  15
  16 div.buttons {
  17     text-align: right;
  18     padding-right: 0.5em;
  19     padding-bottom: 0.5em;
  20 }
  21
  22 .titlebox-title {
  23     font-size: 1.1em;
  24     margin-left: 0.5em;
  25     margin-top: -1.2em;
  26     top: -0.5em;
  27     padding: 0.5em;
  28     position: relative;
  29     display: inline-block;
  30     text-decoration: none;
  31     background-color: #fff;
  32     -moz-border-radius: 0.25em;
  33     -webkit-border-radius: 0.25em;
  34     border-radius: 0.25em;
  35     -webkit-box-shadow: #333 0px 0px 5px;
  36     -moz-box-shadow: #333 0px 0px 5px;
  37     box-shadow: #333 0px 0px 5px;
  38 }
  39
  40 ul.menu
  41 {
  42     text-align: left;
  43     list-style: none;
  44     padding: 0;
  45     margin: -0.6em;
  46     left: 0;
  47 }
  48
  49 ul.menu li
  50 {
  51     display: block;
  52     margin: 0;
  53     padding: 0;
  54     font-weight: bold;
  55 }
  56
  57 ul.ticketlist li:active, ul.ticketlist li:hover,
  58 ul.menu li:active, ul.menu li:hover {
  59     background-color: #eee;
  60 }
  61
  62
  63 ul.menu li
  64 {
  65     display: block;
  66     padding: 1em;
  67     margin: 0;
  68     border:0;
  69     border-top-width: 1px;
  70     border-top-color: #666;
  71     border-style: solid;
  72     text-decoration: none;
  73 }
  74
  75 ul.menu li:first-child{
  76     border: none;
  77 }
  78
  79 ul.menu li#active a
  80 {
  81     color: #800000;
  82 }
  83
  84 div.titlebox, #bpscredits, #logo, .ticket_menu{
  85     -moz-border-radius: 1em;
  86     -webkit-border-radius: 1em;
  87     border-radius: 1em;
  88     margin: 0.5em;
  89     background-color: #fff;
  90     padding-top: 1em;
  91     padding-bottom: 0.8em;
  92     margin-top: 1.25em;
  93     -webkit-box-shadow: #333 0px 0px 5px;
  94     -moz-box-shadow: #333 0px 0px 5px;
  95     box-shadow: #333 0px 0px 5px;
  96     margin-bottom: 1em;
  97 }
  98
  99 div .titlebox-content {
 100     padding-left: 0.5em;
 101     padding-right: 0.5em;
 102 }
 103
 104 hr.clear {
 105     display: none;
 106 }
 107
 108
 109 .label, .labeltop, .cflabel {
 110     font-weight: normal;
 111 }
 112 .value {
 113     font-weight: bold;
 114     display: inline-block;
 115 }
 116
 117 div.value {
 118     display: block;
 119 }
 120
 121 ul.ticketlist {
 122     list-style: none;
 123     padding-left: -0.5em;
 124     padding-right: -0.5em; /* to counteract the titlebox and get shading to the end*/
 125     margin-left: -0.5em;
 126     margin-right: -0.5em;
 127     padding: 0em;
 128     padding-bottom: 1em;
 129 }
 130
 131 ul.ticketlist li.ticket {
 132     padding: 0.5em;
 133     font-weight: bold;
 134     border-bottom: 1px solid #999;
 135
 136 }
 137 ul.ticketlist li.ticket:first-child {
 138     border-top: 1px solid #999;
 139 }
 140
 141 ul.ticketlist li.ticket a.ticket{
 142     display: inline-block;
 143     font-size: 1em;
 144     width: 100%;
 145     padding: 0.5em;
 146     padding-bottom: 5em;
 147     margin-bottom: -5em;
 148 }
 149 ul.ticketlist li.ticket div.metadata {
 150 }
 151
 152
 153 ul.ticketlist li.ticket div.metadata div {
 154     padding: 0.2em;
 155     font-size:0.8em;
 156     display: block;
 157 }
 158
 159 ul.ticketlist li.ticket div.metadata .label {
 160     display: inline-block;
 161     width: 6em;
 162     font-size: 0.8em;
 163     text-align: right;
 164     color: #666;
 165 }
 166
 167 div#paging {
 168     text-align: center;
 169 }
 170
 171 .ticket-reply .titlebox-title, .titlebox.search .titlebox-title, .titlebox.menu .titlebox-title, .ticket_menu .titlebox-title, .history .titlebox-title, #ticket-create-basics .titlebox-title{
 172     display: none;
 173 }
 174
 175 a {
 176     color: #000;
 177 }
 178
 179 .ticket_menu a, .menu a {
 180     text-decoration: none;
 181 }
 182
 183 ul.menu a {
 184     padding: 0.5em;
 185     margin-top: -0.5em;
 186     margin-bottom: -0.5em;
 187     display: inline-block;
 188     width: 100%;
 189 }
 190
 191 ul.menu a:after {
 192     color: #666;
 193     float: right;
 194     content: ">";
 195     font-size: 1.5em;
 196     padding: 0;
 197     margin: 0;
 198     padding-right: 1em;
 199
 200 }
 201
 202 ul.menu form {
 203     display: inline;
 204 }
 205
 206 ul.menu form * {
 207     display: inline;
 208 }
 209
 210
 211 ul.menu form input[type=text] {
 212     width: 7em;
 213 }
 214
 215 ul.menu form input{
 216
 217     width: auto;
 218     padding: 0.5em;
 219     margin: -0.5em;
 220     margin-left: 1em;
 221 }
 222
 223 .ticket_menu {
 224     text-align: center;
 225 }
 226
 227 .ticket_menu ul {
 228     display: block;
 229     margin: 0;
 230     padding: 0;
 231 }
 232
 233 .ticket_menu ul li {
 234
 235     display: inline-block;
 236     text-align: center;
 237     padding-bottom: 0.25em;
 238     padding-top: 0.25em;
 239     font-size: 1em;
 240     width: 28%;
 241     padding-right: 0.3em;
 242     padding-left: 0.2em;
 243     border-right: 1px solid #000;
 244 }
 245 .ticket_menu ul li:last-child {
 246     padding-right: 0;
 247     border-right: 0;
 248 }
 249
 250 .ticket-info-reminders table {
 251
 252     width: 100%;
 253 }
 254
 255 #ticket-create .label:after {
 256    content: ": ";
 257     padding-right: 0.25em;
 258
 259 }
 260
 261 #ticket-create .content-label {
 262     width: auto;
 263     display: block;
 264     text-align: left;
 265
 266 }
 267
 268 #ticket-show .label, .login-body .label {
 269     display: inline-block;
 270     text-align: right;
 271     width: 6em;
 272     padding-right: 0.25em;
 273     font-size: 0.8em;
 274 }
 275
 276 .login-body .value {
 277     width: auto;
 278 }
 279
 280 .history ul.history-list {
 281     padding: 0;
 282     margin: 0;
 283     padding-bottom: 2em;
 284 }
 285
 286
 287 .history ul.history-list li:first-child {
 288     border-top: 1px solid #ccc;
 289 }
 290
 291 .history ul.history-list li {
 292     list-style: none;
 293     border-bottom: 1px solid #ccc;
 294     padding: 0.5em;
 295 }
 296
 297 .history .age {
 298     display: inline-block;
 299     min-width: 8em;
 300     text-align: right;
 301
 302 }
 303
 304 div#login-box div.titlebox {
 305     width: 100%;
 306     margin-left:auto;
 307     margin-right: auto;
 308 }
 309
 310 div#login-box input[type=text], div#login-box input[type=password] {
 311     width: 100%;
 312 }
 313
 314 div#login-box div.login-help {
 315     text-align: center;
 316     /* don't be too close to the following "Not using a mobile ..." link */
 317     margin-bottom: 1em;
 318 }
 319
 320 #bpscredits {
 321     float: right;
 322     clear: right;
 323     text-align: right;
 324     width: auto;
 325     font-size: 0.8em;
 326     padding: 1em;
 327 }
 328
 329 #bpscredits #copyright {
 330     padding-top: 4em;
 331     background: white url(../../static/images/bpslogo.png) no-repeat top right;
 332 }
 333
 334
 335 :focus {
 336     background-color: #ffc;
 337     border-color: #000;
 338     border-weight: 3px;
 339 }
 340
 341 input[type=submit], input[type=button], button, #paging a {
 342     border: 2px outset;
 343     margin: 0.3em;
 344     padding: 0.3em;
 345     padding-left: 0.6em;
 346     padding-right: 0.6em;
 347     -moz-border-radius: 0.5em;
 348     -webkit-border-radius: 0.5em;
 349     border-radius: 0.5em;
 350     background-color: #006699;
 351     color: #fff;
 352 }
 353
 354 form {
 355
 356     margin:0;
 357 }
 358
 359 #gohome {
 360     position: absolute;
 361     top: 0;
 362     right: 0;
 363     border-left: 1px solid black;
 364     border-bottom: 1px solid black;
 365     -moz-border-radius-bottomleft: 1em;
 366     -webkit-border-bottom-left-radius: 1em;
 367     border-bottom-left-radius: 1em;
 368     padding: 0.5em;
 369     background-color: #fff;
 370 }
 371
 372 #gohome a {
 373     font-size: 1em;
 374     padding: 0.25em;
 375     color: #000;
 376 }
 377
 378 #logo {
 379     float: right;
 380     clear: right;
 381     text-align: center;
 382     padding: 1em;
 383     padding-bottom: 0.5em;
 384     margin: 0.25em 0.5em 0.25em 0.25em;
 385 }
 386
 387 #logo .rtname {
 388     display: block;
 389     font-size: 0.9em;
 390 }
 391
 392 #logo a img {
 393     border: 0;
 394     height: 2em;
 395     width: auto !important;
 396     padding-bottom: 0.5em;
 397 }
 398
 399 div.txn-content {
 400
 401     font-size:0.8em;
 402     padding-left:1em;
 403     padding-top:0.5em;
 404     margin-top: 0.5em;
 405     margin-left: 2em;
 406     padding-bottom: 0.5em;
 407     border-left: 5px solid #00c;
 408
 409 }
 410
 411 .label, .cflabel {
 412     text-align: left;
 413     width: 10em;
 414     color: #666;
 415     display: block;
 416     padding-bottom: 0.2em;
 417     padding-right: 0.2em;
 418
 419 }
 420
 421 div.entry, tr.input-row {
 422     margin-bottom: 0.25em;
 423     padding-bottom: 0.25em;
 424     border-bottom: 1px solid #ccc;
 425     display: block;
 426     width: 100%;
 427     min-height: 1em;
 428 }
 429
 430
 431 input[type=text], input[type=password], select {
 432     width: 100%;
 433 }
 434
 435 .timefield input {
 436     width: 5em;
 437 }
 438
 439 .timefield select {
 440     width: auto;
 441 }
 442
 443
 444 textarea {
 445     width: 100%;
 446 }
 447
 448 a#fullsite {
 449     padding-left: 1em;
 450 }
 451
 452 div.error .titlebox-title {
 453     background-color: #f00;
 454     color: #fff;
 455 }
 456
 457 div.error div.error {
 458     background-color: #fcc;
 459 }