apps/workbench/app/assets/stylesheets/bootstrap-modal.css.scss

   1 /*!
   2 * Bootstrap Modal
   3 *
   4 * Copyright Jordan Schroter
   5 * Licensed under the Apache License v2.0
   6 * http://www.apache.org/licenses/LICENSE-2.0
   7 *
   8 */
   9
  10 body.modal-open,
  11 .modal-open .navbar-fixed-top,
  12 .modal-open .navbar-fixed-bottom {
  13   margin-right: 0;
  14 }
  15
  16 .modal {
  17   left: 50%;
  18   bottom: auto;
  19   right: auto;
  20   padding: 0;
  21   width: 500px;
  22   margin-left: -250px;
  23   background-color: #ffffff;
  24   border: 1px solid #999999;
  25   border: 1px solid rgba(0, 0, 0, 0.2);
  26   border-radius: 6px;
  27   -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  28   box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  29   background-clip: padding-box;
  30 }
  31
  32 .modal.container {
  33   max-width: none;
  34 }
  35
  36
  37 .modal-open {
  38 overflow: hidden;
  39 }
  40
  41
  42 /* add a scroll bar to stop page from jerking around */
  43 .modal-open.page-overflow .page-container,
  44 .modal-open.page-overflow .page-container .navbar-fixed-top,
  45 .modal-open.page-overflow .page-container .navbar-fixed-bottom,
  46 .modal-open.page-overflow .modal-scrollable {
  47 overflow-y: scroll;
  48 }
  49
  50 @media (max-width: 979px) {
  51 .modal-open.page-overflow .page-container .navbar-fixed-top,
  52 .modal-open.page-overflow .page-container .navbar-fixed-bottom {
  53 overflow-y: visible;
  54 }
  55 }
  56
  57
  58 .modal-scrollable {
  59 position: fixed;
  60 top: 0;
  61 bottom: 0;
  62 left: 0;
  63 right: 0;
  64 overflow: auto;
  65 }
  66
  67 .modal.fade {
  68 top: -100%;
  69 -webkit-transition: opacity 0.3s linear, top 0.3s ease-out, bottom 0.3s ease-out, margin-top 0.3s ease-out;
  70 -moz-transition: opacity 0.3s linear, top 0.3s ease-out, bottom 0.3s ease-out, margin-top 0.3s ease-out;
  71 -o-transition: opacity 0.3s linear, top 0.3s ease-out, bottom 0.3s ease-out, margin-top 0.3s ease-out;
  72 transition: opacity 0.3s linear, top 0.3s ease-out, bottom 0.3s ease-out, margin-top 0.3s ease-out;
  73 }
  74
  75 .modal.fade.in {
  76 top: 50%;
  77 }
  78
  79 .modal-body {
  80 max-height: none;
  81 overflow: visible;
  82 }
  83
  84 .modal.modal-absolute {
  85 position: absolute;
  86 z-index: 950;
  87 }
  88
  89 .modal .loading-mask {
  90 position: absolute;
  91 top: 0;
  92 bottom: 0;
  93 left: 0;
  94 right: 0;
  95 background: #fff;
  96 border-radius: 6px;
  97 }
  98
  99 .modal-backdrop.modal-absolute{
 100 position: absolute;
 101 z-index: 940;
 102 }
 103
 104 .modal-backdrop,
 105 .modal-backdrop.fade.in{
 106 opacity: 0.7;
 107 filter: alpha(opacity=70);
 108 background: #fff;
 109 }
 110
 111 /* Modal Overflow */
 112
 113 .modal-overflow.modal {
 114 top: 1%;
 115 }
 116
 117 .modal-overflow.modal.fade {
 118 top: -100%;
 119 }
 120
 121 .modal-overflow.modal.fade.in {
 122 top: 1%;
 123 }
 124
 125 .modal-overflow .modal-body {
 126 overflow: auto;
 127 -webkit-overflow-scrolling: touch;
 128 }
 129
 130 /* Responsive */
 131
 132 @media (min-width: 1200px) {
 133 .modal.container {
 134 width: 1170px;
 135 margin-left: -585px;
 136 }
 137 }
 138
 139 @media (max-width: 979px) {
 140 .modal,
 141 .modal.container,
 142 .modal.modal-overflow {
 143 top: 1%;
 144 right: 1%;
 145 left: 1%;
 146 bottom: auto;
 147 width: auto !important;
 148 height: auto !important;
 149 margin: 0 !important;
 150 padding: 0 !important;
 151 }
 152
 153 .modal.fade.in,
 154 .modal.container.fade.in,
 155 .modal.modal-overflow.fade.in {
 156 top: 1%;
 157 bottom: auto;
 158 }
 159
 160 .modal-body,
 161 .modal-overflow .modal-body {
 162 position: static;
 163 margin: 0;
 164 height: auto !important;
 165 max-height: none !important;
 166 overflow: visible !important;
 167 }
 168
 169 .modal-footer,
 170 .modal-overflow .modal-footer {
 171 position: static;
 172 }
 173 }
 174
 175 .loading-spinner {
 176 position: absolute;
 177 top: 50%;
 178 left: 50%;
 179 margin: -12px 0 0 -12px;
 180 }