testing/MCTXWeb/public_html/users/static/style.css

   1 /** Custom fonts **/\r
   2 @font-face {\r
   3   font-family: "Open Sans";\r
   4   src: url("OpenSans.ttf"),\r
   5     url("OpenSans.eot");\r
   6   font-weight: normal;\r
   7 }\r
   8 \r
   9 @font-face {\r
  10   font-family: "Open Sans";\r
  11   src: url("OpenSansBold.ttf");\r
  12   font-weight: bold;\r
  13 }\r
  14 \r
  15 body {\r
  16   font-family: "Open Sans", "Lucida Grande","Lucida Sans",Verdana,Arial;\r
  17   font-size: 13px;\r
  18   background-color: #F5F5F5;\r
  19   margin: 0;\r
  20   padding: 0;\r
  21 }\r
  22 \r
  23 hr {\r
  24   border: 0;\r
  25   border-bottom: 1px solid gray;\r
  26 }\r
  27 \r
  28 a {\r
  29   color: #1188DD;\r
  30 }\r
  31 \r
  32 a:active {\r
  33   color: #0066BB;\r
  34 }\r
  35 \r
  36 img {\r
  37   border: none;\r
  38 }\r
  39 \r
  40 .pass {\r
  41   color: #7AE309;\r
  42   font-weight: bold;\r
  43 }\r
  44 \r
  45 .fail {\r
  46   color: #E30909;\r
  47   font-weight: bold\r
  48 }\r
  49 \r
  50 div.centre, p.centre {\r
  51   text-align: center;\r
  52   margin: auto;\r
  53 }\r
  54 \r
  55 .bold {\r
  56   font-weight: bold;\r
  57 }\r
  58 \r
  59 .medium {\r
  60   font-size: 115% !important;\r
  61 }\r
  62 \r
  63 .large {\r
  64   font-size: 130% !important;\r
  65 }\r
  66 \r
  67 .normal {\r
  68   font-size: inherit !important;\r
  69 }\r
  70 \r
  71 .small {\r
  72   font-size: 80% !important;\r
  73 }\r
  74 \r
  75 /*\r
  76 table {\r
  77   border: none;\r
  78 }\r
  79 \r
  80 table.centre {\r
  81   margin: auto;\r
  82   text-align: center;\r
  83 }\r
  84 \r
  85 table.status, table.status tr, table.status td {\r
  86     padding: 0.2em 0.75em;\r
  87 }\r
  88 \r
  89 \r
  90 td {\r
  91   padding: 0 0.5em;\r
  92 }\r
  93 \r
  94 th {\r
  95   padding: inherit;\r
  96   border-bottom: 1px solid gray;\r
  97 }\r
  98 \r
  99 */\r
 100 \r
 101 table {\r
 102   border-radius: 3px;\r
 103   border-collapse: collapse;\r
 104   word-wrap: break-word;\r
 105   line-height: 1.3em;\r
 106   width: 100%;\r
 107   margin: 1em auto;\r
 108   vertical-align: middle;\r
 109 }\r
 110 \r
 111 td {\r
 112   padding: 0.2em 0.5em;\r
 113 }\r
 114 \r
 115 tr.pass {\r
 116   color: #000;\r
 117   background-color: #7AE309;\r
 118   font-weight: inherit;\r
 119 }\r
 120 \r
 121 tr.fail, tr.fail .fail {\r
 122   color: #000;\r
 123   background-color: #E30909;\r
 124   font-weight: inherit;\r
 125 }\r
 126 \r
 127 table.centre {\r
 128   margin: auto;\r
 129   text-align: center;\r
 130 }\r
 131 \r
 132 table.left {\r
 133   text-align: left;\r
 134 }\r
 135 \r
 136 table.lines td {\r
 137         border-right: 1px solid #ccc;\r
 138 }\r
 139 \r
 140 table.lines td:last-child {\r
 141         border-right: none;\r
 142 }\r
 143 \r
 144 table.lines tr:first-child {\r
 145         border-bottom: 1px solid #ccc;\r
 146 }\r
 147 \r
 148 table.horizontal {\r
 149   line-height: 1.6em;\r
 150 }\r
 151 \r
 152 table.horizontal th {\r
 153   text-align: left;\r
 154   border-bottom: 0;\r
 155   width: 15%;\r
 156   font-weight: normal;\r
 157 }\r
 158 \r
 159 table.horizontal.medium th {\r
 160   width: 22%;\r
 161 }\r
 162 \r
 163 img.centre {\r
 164   display: block;\r
 165   margin: auto;\r
 166 }\r
 167 \r
 168 input[type="button"], input[type="submit"] {\r
 169   background-color: #F5F5F5;\r
 170   border: 1px solid #A2A2A2;\r
 171   border-radius: 3px;\r
 172   box-shadow: 1px 1px 1px #BBBBBB;\r
 173   transition: all 0.13s ease 0s;\r
 174   padding: 0 0.5em;\r
 175   min-width: 55px;\r
 176   margin: 0.4em 0.1em;\r
 177 }\r
 178 \r
 179 input[type="button"]:active, input[type="submit"]:active {\r
 180   background-color: #E8E8E8;\r
 181 }\r
 182 \r
 183 \r
 184 input[type="text"], input[type="password"] {\r
 185   width: 100%; /* IE8 width bugfix */\r
 186   border-radius: 3px;\r
 187   border: 1px solid #CCCCCC;\r
 188   font-size: 16px;\r
 189 }\r
 190 \r
 191 input[type="text"]:focus, input[type="password"]:focus {\r
 192   box-shadow: 0 0 2px #BBBBBB;\r
 193 }\r
 194 \r
 195 form.nice {\r
 196   line-height: 1.8em;\r
 197 }\r
 198 \r
 199 form.nice p {\r
 200   margin: 0.25em auto;\r
 201 }\r
 202 \r
 203 form.nice input {\r
 204   font-size: 150%;\r
 205 }\r
 206 \r
 207 form.nice label {\r
 208   font-size: 110%;\r
 209 }\r
 210 \r
 211 form.nice input[type="submit"], form.nice input[type="button"] {\r
 212   font-size: inherit;\r
 213   padding: 0.4em 0.8em;\r
 214 }\r
 215 \r
 216 form.controls {\r
 217   background-color: #F9F9F9;\r
 218   border: 1px solid #808080;\r
 219   padding: 1em;\r
 220   margin: 1em auto;\r
 221 }\r
 222 \r
 223 #header-wrap {\r
 224   background-color: #2a2a2a;\r
 225   border-top: 0.3em solid #1188DD;\r
 226   color: #f2f2f2;\r
 227   margin-bottom: 1em;\r
 228   box-shadow: 0 0 0.5em #444444;\r
 229   transition: all 0.2s ease 0s;\r
 230 }\r
 231 \r
 232 #header {\r
 233   padding: 1.5em 2em;\r
 234   /*max-width: 1920px;*/\r
 235   margin: 0 auto;\r
 236 }\r
 237 \r
 238 #header input[type="button"], #header input[type="submit"] {\r
 239   background-color: #808080;\r
 240   border: 1px solid #808080;\r
 241   box-shadow: none;\r
 242   color: #f2f2f2;\r
 243   cursor: pointer;\r
 244 }\r
 245 \r
 246 #header input[type="button"]:hover, #header input[type="submit"]:hover {\r
 247   background-color: #606060;\r
 248   border: 1px solid #606060;\r
 249 }\r
 250 \r
 251 #header #leftnav {\r
 252   float: left;\r
 253   display: table;\r
 254 }\r
 255 \r
 256 #header #leftnav > div, #header #leftnav > span {\r
 257   display: table-cell;\r
 258   vertical-align: middle;\r
 259   padding-left: 1em;  \r
 260 }\r
 261 \r
 262 #header #leftnav a {\r
 263   color: #2a2a2a;\r
 264 }\r
 265 \r
 266 #title {\r
 267   font-size: 30px;\r
 268 }\r
 269 \r
 270 #header #rightnav {\r
 271   float: right;\r
 272   font-size: 15px;\r
 273   padding-top: 0.5em;\r
 274   text-align: right;\r
 275 }\r
 276 \r
 277 #header #rightnav span {\r
 278   margin-left: 1em;\r
 279 }\r
 280 \r
 281 #header #menu-container {\r
 282   margin-right: 1.5em;\r
 283   font-size: 15px;\r
 284   display: inline-block;\r
 285 }\r
 286 \r
 287 #header #logout-container {\r
 288   /* Hide until activated by JavaScript */\r
 289   display: none;\r
 290 }\r
 291 \r
 292 #header #date {\r
 293   font-size: 12px;\r
 294 }\r
 295 \r
 296 #content-wrap {\r
 297   padding: 1em 2em;\r
 298   /*max-width: 1920px;*/\r
 299   margin: 1em auto;\r
 300   transition: all 0.2s ease 0s;\r
 301 }\r
 302 \r
 303 #content  {\r
 304  \r
 305   /*display: none;  Enable in non-debug mode*/\r
 306 }\r
 307 \r
 308 #sidebar{\r
 309   float: left;\r
 310   width: 240px;\r
 311   transition: all 0.2s ease 0s;\r
 312 }\r
 313 \r
 314 #sidebar .title {\r
 315   font-size: 20px;\r
 316 }\r
 317 \r
 318 #sidebar-hide {\r
 319   border-bottom: 1px solid #CCCCCC;\r
 320   border-left: 1px solid #CCCCCC;\r
 321   cursor: pointer;\r
 322   float: right;\r
 323   height: 20px;\r
 324   margin-right: -1.25em;\r
 325   margin-top: -1em;\r
 326   text-align: center;\r
 327   width: 20px;\r
 328 }\r
 329 \r
 330 #sidebar-show {\r
 331   float: left;\r
 332   cursor: pointer;\r
 333   display: none;\r
 334 }\r
 335 \r
 336 .justify {\r
 337   text-align: justify;\r
 338 }\r
 339 \r
 340 #main {\r
 341   overflow: auto;\r
 342   padding-left: 2em;\r
 343   min-width: 400px;\r
 344 }\r
 345 \r
 346 #main .sub-title {\r
 347   font-size: 115%;\r
 348   font-weight: bold;\r
 349   margin-bottom: 0.25em;\r
 350 }\r
 351 \r
 352 /* Unused ?? */\r
 353 .sxs {\r
 354   display: table;\r
 355   table-layout: fixed;\r
 356   width: 100%;\r
 357   border-spacing: 0.5em;\r
 358 }\r
 359 \r
 360 .sxs div {\r
 361   display: table-cell;\r
 362 }\r
 363 \r
 364 .left {\r
 365   float: left;\r
 366 }\r
 367 \r
 368 .right {\r
 369   float: right;\r
 370 }\r
 371 \r
 372 .title {\r
 373   font-size: 24px;\r
 374   font-weight: bold;\r
 375   margin-bottom: 0.5em;\r
 376 }\r
 377 \r
 378 .graph {\r
 379   width: 100%;\r
 380   height: 200px;\r
 381 }\r
 382 \r
 383 .widget {\r
 384   background-color: #EBF4FA; /*#ffffff;*/ /*segment the gui*/\r
 385   margin: 0.25em 0.25em 1.5em;\r
 386   padding: 1em 1.25em;\r
 387   box-shadow: 0 0 3px #CCCCCC;\r
 388   border: 1px solid #CCCCCC;\r
 389   transition: all 0.2s ease 0s;\r
 390   overflow: auto;\r
 391 }\r
 392 \r
 393 .widget:hover {\r
 394   box-shadow: 0 0 0.25em #AAAAAA;\r
 395 }\r
 396 \r
 397 .plot {\r
 398         box-sizing: border-box;\r
 399         width: auto;\r
 400         height: 300px;\r
 401         padding: 20px 15px 15px 15px;\r
 402         margin: 15px auto 30px auto;\r
 403         border: 1px solid #ddd;\r
 404         font-size:20px;\r
 405 }\r
 406 \r
 407 /** For links on the data page **/\r
 408 .datalink {\r
 409         color: black;\r
 410         text-decoration:none;\r
 411 }\r
 412 \r
 413 .datalink:hover {\r
 414         color: blue;\r
 415         text-decoration:underline;\r
 416 }\r
 417 \r
 418 /** Hack **/\r
 419 .clear {\r
 420   clear: both;\r
 421 }\r
 422 \r
 423 #errorlog {\r
 424   overflow: auto;\r
 425   max-width: 100%;\r
 426   width: 100%;\r
 427   height: 6em;\r
 428   background-color: white;\r
 429   border: 1px solid #ccc;\r
 430 }\r
 431 \r
 432 /** For login.html **/\r
 433 #login-container {\r
 434   margin: 0 auto;\r
 435   width: 400px;\r
 436   padding: 1.8em 0 0;\r
 437   color: #606060;\r
 438   line-height: 1.8em;\r
 439 }\r
 440 \r
 441 #login-container form {\r
 442   padding: 1em 2em;\r
 443 }\r
 444 \r
 445 #login-container input {\r
 446   font-size: 24px;\r
 447 }\r
 448 \r
 449 #login-container label {\r
 450   font-size: 14px;\r
 451 }\r
 452 \r
 453 #login-container input[type=submit] {\r
 454   font-size: inherit;\r
 455   padding: 0.4em 0.8em;\r
 456 }\r
 457 \r
 458 #login-container #result {\r
 459   clear: both;\r
 460 }\r
 461 \r
 462 #experiment-stop {\r
 463   padding: 0.2em 0.4em;\r
 464   display: none;\r
 465 }\r
 466 \r
 467 #start-widget {\r
 468   display: none;\r
 469 }\r
 470 \r
 471 #pressure-widget {\r
 472   display: none;\r
 473 }