interface/themes/tabs_style_full.css

   1 /**
   2  * Copyright (C) 2016 Kevin Yeh <kevin.y@integralemr.com>
   3  * Copyright (C) 2016 Brady Miller <brady.g.miller@gmail.com>
   4  *
   5  * LICENSE: This program is free software; you can redistribute it and/or
   6  * modify it under the terms of the GNU General Public License
   7  * as published by the Free Software Foundation; either version 3
   8  * of the License, or (at your option) any later version.
   9  * This program is distributed in the hope that it will be useful,
  10  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  11  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  12  * GNU General Public License for more details.
  13  * You should have received a copy of the GNU General Public License
  14  * along with this program. If not, see <http://opensource.org/licenses/gpl-license.php>;.
  15  *
  16  * @package OpenEMR
  17  * @author  Kevin Yeh <kevin.y@integralemr.com>
  18  * @author  Robert Down <robertdown@live.com>
  19  * @author  Brady Miller <brady.g.miller@gmail.com>
  20  * @link    http://www.open-emr.org
  21  */
  22
  23 html
  24 {
  25     margin: 0;
  26     padding: 0;
  27     border: 0;
  28     height: 100%;
  29     display: flex;
  30     flex-direction: column;
  31 }
  32 body
  33 {
  34     /*font-family: 'FontAwesome', Arial, Helvetica, sans-serif;*/
  35     flex: 1 0 auto;
  36     display: flex;
  37     flex-direction: column;
  38     margin: 0px;
  39     background-color: #f4f4f4;
  40 }
  41 #mainBox
  42 {
  43     display: flex;
  44     flex-direction: column;
  45     align-items: stretch;
  46     align-content: space-between;
  47     width: 100%;
  48     flex: 1 0 auto;
  49     margin: 0;
  50     padding: 0;
  51 }
  52
  53 #mainBox > div
  54 {
  55     flex: 0 1 auto;
  56     margin: 0;
  57 }
  58
  59 #mainBox > div.mainFrames
  60 {
  61     display: flex;
  62     flex: 1 0 auto;
  63     flex-direction: column;
  64     padding: 0;
  65     z-index: 3;
  66     margin: 0;
  67 }
  68
  69 #framesDisplay
  70 {
  71     flex: 1 0 auto;
  72     display: flex;
  73     flex-direction: row;
  74 }
  75
  76 #framesDisplay > div
  77 {
  78     flex: 1 0 auto;
  79     align-items: stretch;
  80     align-content:stretch;
  81     display: flex;
  82     flex-direction: column;
  83     margin: 0;
  84     padding: 0;
  85 }
  86
  87 #framesDisplay > div > iframe
  88 {
  89     flex: 1 0 auto;
  90     border: 0px solid black;
  91     width: 100%
  92 }
  93
  94 .tabControls
  95 {
  96     margin: 0px;
  97     padding: 0px;
  98     padding-top: 4px;
  99     display: flex;
 100     flex-direction: row;
 101     background: #f4f4f4;
 102     overflow: auto;
 103 }
 104
 105 .tabSpan
 106 {
 107     font-size: 0.9em;
 108     margin: 0px;
 109     padding: 8px 8px;
 110     border-top: 3pt solid #1976d2;
 111     border-left: 1px solid #1976d2;
 112     border-bottom: 0pt;
 113     border-right: 1px solid #1976d2;
 114     cursor: pointer;
 115     flex: 0 1 auto;
 116     white-space: nowrap;
 117     overflow: visible;
 118 }
 119 .tabSpan:last-child {
 120     /*border-right: 1pt solid #1976d2;*/
 121 }
 122
 123 .tabSpan .fa {
 124     color: #888888;
 125 }
 126
 127 .tabSpan:hover
 128 {
 129     /*color: red;*/
 130 }
 131 .tabHidden
 132 {
 133     color: #888888;
 134 }
 135 .tabNotchosen {
 136     background: transparent;
 137     border-top: 3pt solid transparent;
 138     border-left: none;
 139     border-right: none;
 140     border-bottom: 1pt solid #1976d2;
 141     display:block;
 142 }
 143 .tabNotchosen:hover {
 144     background: #e9e9e9;
 145 }
 146
 147 .tabsNoHover {
 148     background: transparent !important;
 149     border-top: 3pt solid transparent;
 150     border-left: none;
 151     border-right: none;
 152     border-bottom: 1pt solid #1976d2;
 153     display:block;
 154 }
 155
 156 #dialogDiv
 157 {
 158     margin: 0;
 159     padding:0;
 160     border:0;
 161     position:absolute;
 162
 163     width: 99%;
 164     height:99%;
 165
 166     background-color: #fff;
 167     z-index:1000;
 168     opacity: 0.65;
 169 }
 170
 171 #dialogDiv > div.container
 172 {
 173     display: table;
 174     /*background-color: gray;*/
 175     margin: auto auto;
 176     opacity: 1;
 177 }
 178
 179 .dialogIframe
 180 {
 181     position: absolute;
 182     top: 0;
 183     left: 0;
 184     margin: auto auto;
 185     opacity: 1;
 186     z-index: 10000;
 187     box-shadow: 0px 0px 30px rgba(0,0,0,0.2);
 188 }
 189
 190 div.closeDlgIframe {
 191     background: #ff5d5a;
 192     position: absolute;
 193     top: -12px;
 194     right: -12px;
 195     height: 30px;
 196     width: 30px;
 197     cursor: pointer;
 198     z-index: 10010;
 199 }
 200 div.closeDlgIframe:before {
 201     color: #fff;
 202     content: "\f00d";
 203     font-family: "FontAwesome";
 204     font-weight: bold;
 205     display: inline-block;
 206     width: 100%;
 207     text-align: center;
 208     margin: auto;
 209     line-height: 30px;
 210     height: 30px;
 211 }
 212
 213 .dialogIframe > iframe{
 214     border: none;
 215     border-radius: 10px;
 216     height:100%;
 217     width:100%;
 218 }
 219 #attendantData
 220 {
 221     background-color: #f4f4f4;
 222 }
 223 .patientInfo a {
 224     color: #333 !important;
 225 }
 226
 227 .patientInfo .patientPicture
 228 {
 229     margin-top: -1px;
 230     margin-right: 7px;
 231 }
 232
 233 .patientInfo .patientPicture img
 234 {
 235     height: 50px;
 236 }
 237
 238 .patientCurrentEncounter {
 239     display: inline;
 240 }
 241
 242 .patientCurrentEncounter a {
 243     color: #333 !important;
 244 }
 245
 246 .patientDataColumn
 247 {
 248     width: 33%;
 249     float: left;
 250     display: block;
 251 }
 252
 253 .messagesColumn
 254 {
 255     float: right;
 256     padding-right: 20px;
 257 }
 258
 259 .patientEncountersColumn
 260 {
 261 }
 262
 263 .patientEncounterList
 264 {
 265     position:fixed;
 266     overflow: hidden;
 267     border: 1px solid black;
 268     background: white;
 269     cursor: pointer;
 270     z-index:1;
 271 }
 272
 273 .patientEncounterList  table.encounters {
 274     display: none;
 275 }
 276
 277 .patientEncounterList:hover table.encounters {
 278     display: block;
 279 }
 280
 281 .patientEncounterList > div {
 282     padding: 2px;
 283 }
 284 .patientEncounterList:hover
 285 {
 286     overflow: visible;
 287     height: auto;
 288     z-index:4;
 289 }
 290
 291
 292 .patientEncounterList > div:hover
 293 {
 294     color: red;
 295 }
 296
 297 .patientEncounterList table.encounters td:hover
 298 {
 299     color:red;
 300 }
 301
 302 .patientEncounterList .review
 303 {
 304     padding: 2px;
 305     border: 1px solid black;
 306     background-color: lightgray;
 307     border-radius: 5px;
 308 }
 309
 310 #userData
 311 {
 312     position: relative;
 313     float: right;
 314 }
 315 .patientInfo
 316 {
 317     padding: 1px 1px 1px 10px;
 318 }
 319
 320 .patientInfo .clear:hover i {
 321     color: #ff5d5a;
 322 }
 323
 324 .top {
 325     vertical-align:top;
 326 }
 327
 328 .appMenu > span
 329 {
 330     float: left;
 331     padding: 0px;
 332     white-space: nowrap;
 333 }
 334
 335 .appMenu
 336 .appMenu > span:hover
 337 {
 338     color: #fff;
 339     text-decoration: none;
 340     background-color: #1C5ECF;
 341     text-shadow: none;
 342 }
 343 .appMenu ul
 344 {
 345     list-style:none;
 346     margin:0;
 347     padding: 1px 5px 2px 1px;
 348 }
 349
 350 .appMenu li:hover > .menuDisabled
 351  {
 352     background-color: transparent;
 353 }
 354 .menuSection{
 355     position: relative;
 356 }
 357 .menuSection:hover {
 358     background-color: #CCE3F8;
 359 }
 360 .menuSection > .menuEntries{
 361     background:#fff;
 362     display: none;
 363     position: absolute;
 364     top: 40px;
 365     z-index:1000;
 366     min-width: 175px;
 367     box-shadow: 0px 5px 5px #adadad;
 368     padding: 0px;
 369     whitespace: nowrap;
 370 }
 371
 372 .menuSection > .menuEntries .menuEntries {
 373     display: none;
 374     position: absolute;
 375     top: -3px;
 376     left: 161px;
 377 }
 378 .menuSection:hover > .menuEntries{
 379     display: block;
 380 }
 381
 382 /* Need separate styling for top level vs submenu items
 383  * This currently controls ALL links in menu, no bueno
 384  * --Robert Down */
 385 .menuLabel
 386 {
 387     font-size: 0.95em;
 388     color: #333;
 389     padding: 15px 10px;
 390     font-weight: 600;
 391 }
 392 .menuLabel:hover {
 393     background: #CCE3F8;
 394     color: #333;
 395 }
 396
 397 /** Only apply if not an actual link **/
 398 div.menuLabel:hover {
 399     cursor: default !important;
 400 }
 401
 402 /** Sub menu **/
 403 .menuEntries li .menuLabel {
 404     font-size: 0.9em;
 405     display: block;
 406     padding: 10px 20px;
 407 }
 408 .menuEntries li .menuLabel:hover {
 409     background-color: #CCE3F8;
 410     color: #333;
 411 }
 412
 413 .logo {
 414     padding: 10px 0px;
 415 }
 416
 417 .menuDisabled
 418 {
 419     color: #d7d7d7;
 420 }
 421 .menuDisabled:hover {
 422     color: #d7d7d7 !important;
 423     background-color: #f4f4f4 !important;
 424     cursor: not-allowed;
 425 }
 426
 427 #username
 428 {
 429     cursor: pointer;
 430 }
 431 .userSection
 432 {
 433     min-width: 200px;
 434     right:10px;
 435 }
 436
 437 /* Main menu bar */
 438 .body_top {
 439     background-color: #f4f4f4;
 440     color: #333;
 441     padding: 0px;
 442     margin: 0px;
 443     z-index: 10;
 444 }
 445 .body_title {
 446     color: black;
 447     background-color: #f4f4f4;
 448     padding:10px 0px 0px 0px;
 449 }
 450 #username:hover > .userfunctions
 451 {
 452     display: block;
 453     width:98%;
 454 }
 455
 456 #username > .userfunctions > div:hover
 457 {
 458     color: red;
 459 }
 460
 461 .acck {}
 462
 463 .menu_arrow {
 464     bottom:0px;
 465     margin:     7px 7px 2px 7px;
 466 }
 467 .topToolbarRight {
 468     border-top:0pt;
 469 }
 470
 471 .closeButton {
 472     display:inline-block;
 473     float:right;
 474     position:relative;
 475     top:6px;
 476     right:5px;
 477 }