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: 90%;
 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 .patientCurrentEncounter {
 228     display: inline;
 229 }
 230
 231 .patientCurrentEncounter a {
 232     color: #333 !important;
 233 }
 234
 235 .patientDataColumn
 236 {
 237     width: 33%;
 238     float: left;
 239     display: block;
 240 }
 241
 242 .messagesColumn
 243 {
 244     float: right;
 245     padding-right: 20px;
 246 }
 247
 248 .patientEncountersColumn
 249 {
 250 }
 251
 252 .patientEncounterList
 253 {
 254     position:fixed;
 255     overflow: hidden;
 256     border: 1px solid black;
 257     background: white;
 258     cursor: pointer;
 259     z-index:1;
 260 }
 261
 262 .patientEncounterList  table.encounters {
 263     display: none;
 264 }
 265
 266 .patientEncounterList:hover table.encounters {
 267     display: block;
 268 }
 269
 270 .patientEncounterList > div {
 271     padding: 2px;
 272 }
 273 .patientEncounterList:hover
 274 {
 275     overflow: visible;
 276     height: auto;
 277     z-index:4;
 278 }
 279
 280
 281 .patientEncounterList > div:hover
 282 {
 283     color: red;
 284 }
 285
 286 .patientEncounterList table.encounters td:hover
 287 {
 288     color:red;
 289 }
 290
 291 .patientEncounterList .review
 292 {
 293     padding: 2px;
 294     border: 1px solid black;
 295     background-color: lightgray;
 296     border-radius: 5px;
 297 }
 298
 299 #userData
 300 {
 301     position: relative;
 302     float: right;
 303 }
 304 .patientInfo
 305 {
 306     padding: 1px 1px 1px 10px;
 307 }
 308
 309 .patientInfo .clear:hover i {
 310     color: #ff5d5a;
 311 }
 312
 313 .top {
 314     vertical-align:top;
 315 }
 316
 317 .appMenu > span
 318 {
 319     float: left;
 320     padding: 0px;
 321     white-space: nowrap;
 322 }
 323
 324 .appMenu
 325 .appMenu > span:hover
 326 {
 327     color: #fff;
 328     text-decoration: none;
 329     background-color: #1C5ECF;
 330     text-shadow: none;
 331 }
 332 .appMenu ul
 333 {
 334     list-style:none;
 335     margin:0;
 336     padding: 1px 5px 2px 1px;
 337 }
 338
 339 .appMenu li:hover > .menuDisabled
 340  {
 341     background-color: transparent;
 342 }
 343 .menuSection{
 344     position: relative;
 345 }
 346 .menuSection:hover {
 347     background-color: #CCE3F8;
 348 }
 349 .menuSection > .menuEntries{
 350     background:#fff;
 351     display: none;
 352     position: absolute;
 353     top: 40px;
 354     z-index:1000;
 355     min-width: 175px;
 356     box-shadow: 0px 5px 5px #adadad;
 357     padding: 0px;
 358     whitespace: nowrap;
 359 }
 360
 361 .menuSection > .menuEntries .menuEntries {
 362     display: none;
 363     position: absolute;
 364     top: -3px;
 365     left: 161px;
 366 }
 367 .menuSection:hover > .menuEntries{
 368     display: block;
 369 }
 370
 371 /* Need separate styling for top level vs submenu items
 372  * This currently controls ALL links in menu, no bueno
 373  * --Robert Down */
 374 .menuLabel
 375 {
 376     font-size: 95%;
 377     color: #333;
 378     padding: 15px 10px;
 379     font-weight: 600;
 380 }
 381 .menuLabel:hover {
 382     background: #CCE3F8;
 383     color: #333;
 384 }
 385
 386 /** Only apply if not an actual link **/
 387 div.menuLabel:hover {
 388     cursor: default !important;
 389 }
 390
 391 /** Sub menu **/
 392 .menuEntries li .menuLabel {
 393     font-size: 90%;
 394     display: block;
 395     padding: 10px 20px;
 396 }
 397 .menuEntries li .menuLabel:hover {
 398     background-color: #CCE3F8;
 399     color: #333;
 400 }
 401
 402 .logo {
 403     padding: 10px 0px;
 404 }
 405
 406 .menuDisabled
 407 {
 408     color: #d7d7d7;
 409 }
 410 .menuDisabled:hover {
 411     color: #d7d7d7 !important;
 412     background-color: #f4f4f4 !important;
 413     cursor: not-allowed;
 414 }
 415
 416 #username
 417 {
 418     cursor: pointer;
 419 }
 420 .userSection
 421 {
 422     min-width: 200px;
 423     right:10px;
 424 }
 425
 426 /* Main menu bar */
 427 .body_top {
 428     background-color: #f4f4f4;
 429     color: #333;
 430     padding: 0px;
 431     margin: 0px;
 432     z-index: 10;
 433 }
 434 .body_title {
 435     color: black;
 436     background-color: #f4f4f4;
 437     padding:10px 0px 0px 0px;
 438 }
 439 #username:hover > .userfunctions
 440 {
 441     display: block;
 442     width:98%;
 443 }
 444
 445 #username > .userfunctions > div:hover
 446 {
 447     color: red;
 448 }
 449
 450 .acck {}
 451
 452 .menu_arrow {
 453     bottom:0px;
 454     margin:     7px 7px 2px 7px;
 455 }
 456 .topToolbarRight {
 457     border-top:0pt;
 458 }
 459
 460 .closeButton {
 461     display:inline-block;
 462     float:right;
 463     position:relative;
 464     top:6px;
 465     right:5px;
 466 }