git.roojs.org Git - roojs1/blob - old-css-bootstrap/document-manager.css

   1
   2 .roo-document-manager-selector { // it must use visibility, display is not working on old safari...
   3     visibility: hidden;
   4     height: 0px;
   5 }
   6
   7 .roo-document-manager-uploader,
   8 .roo-document-manager-loading,
   9 .roo-document-manager-preview {
  10     position: relative;
  11     float: left;
  12     width: 25%;
  13     padding-left: 5px;
  14     height: 100px;
  15     max-height: 100px;
  16     margin-top: 10px;
  17 }
  18
  19 .roo-document-manager-preview.wide {
  20     width: 50%;
  21 }
  22
  23 .roo-document-manager-thumb,
  24 .roo-document-manager-upload-btn {
  25     width : 100%;
  26     height: 100px;
  27     line-height: 100px;
  28     max-height: 100px;
  29     border: 1px solid #ccc;
  30     -webkit-box-shadow: 1px 0px 5px 0px rgba(128,128,128,0.75);
  31     -moz-box-shadow: 1px 0px 5px 0px rgba(128,128,128,0.75);
  32     box-shadow: 1px 0px 5px 0px rgba(128,128,128,0.75);
  33 }
  34
  35 .roo-document-manager-thumb > i.fa,
  36 .roo-document-manager-upload-btn > i.fa {
  37     width: 100%;
  38     line-height: 98px;
  39     text-align: center;
  40     vertical-align: middle;
  41     color: #808080;
  42     font-size: 2.5em;
  43 }
  44
  45 .roo-document-manager-thumb > i.fa {
  46     font-size: 2.5em;
  47 }
  48
  49 .roo-document-manager-thumb > img {
  50     width: 100%;
  51     max-height: 100%;
  52     text-align: center;
  53     vertical-align: middle;
  54 }
  55
  56 .roo-document-manager-preview > .close {
  57     position: absolute;
  58     top: 0px;
  59     right: 3px;
  60     font-size: 20px;
  61     opacity: 1;
  62 }
  63
  64 .roo-document-manager-preview > .close:hover {
  65     color: #333;
  66 }
  67
  68 /*
  69 * sm
  70 */
  71
  72 @media (min-width: 768px) {
  73     .roo-document-manager-uploader,
  74     .roo-document-manager-loading,
  75     .roo-document-manager-preview {
  76         height: 200px;
  77         max-height: 200px;
  78     }
  79
  80     .roo-document-manager-thumb,
  81     .roo-document-manager-upload-btn {
  82         line-height: 200px;
  83         height: 200px;
  84         max-height: 200px;
  85     }
  86
  87     .roo-document-manager-thumb > i.fa,
  88     .roo-document-manager-upload-btn > i.fa {
  89         line-height: 198px;
  90     }
  91
  92 }
  93
  94 /*
  95 * md
  96 */
  97
  98 @media (min-width: 992px) {
  99     .roo-document-manager-uploader,
 100     .roo-document-manager-loading,
 101     .roo-document-manager-preview {
 102         width: 8.33333333%;
 103         height: 80px;
 104         max-height: 80px;
 105     }
 106
 107     .roo-document-manager-preview.wide {
 108         width: 16.66666666%;
 109     }
 110
 111     .roo-document-manager-thumb,
 112     .roo-document-manager-upload-btn {
 113         line-height: 80px;
 114         height: 80px;
 115         max-height: 80px;
 116     }
 117
 118     .roo-document-manager-thumb > i.fa,
 119     .roo-document-manager-upload-btn > i.fa {
 120         line-height: 78px;
 121     }
 122
 123 }
 124
 125
 126 /*
 127 * lg
 128 */
 129
 130 @media (min-width: 1200px) {
 131     .roo-document-manager-uploader,
 132     .roo-document-manager-loading,
 133     .roo-document-manager-preview {
 134         width: 8.33333333%;
 135         height: 100px;
 136         max-height: 100px;
 137     }
 138
 139     .roo-document-manager-preview.wide {
 140         width: 16.66666666%;
 141     }
 142
 143     .roo-document-manager-thumb,
 144     .roo-document-manager-upload-btn {
 145         line-height: 100px;
 146         height: 100px;
 147         max-height: 100px;
 148     }
 149
 150     .roo-document-manager-thumb > i.fa,
 151     .roo-document-manager-upload-btn > i.fa {
 152         line-height: 98px;
 153     }
 154
 155 }