You are here

imce-content.css in IMCE 6

Same filename and directory in other branches
  1. 6.2 css/imce-content.css
  2. 7 css/imce-content.css
/*Main container*/
#imce-content {
  font-size: 11px;
  font-family: Verdana, Tahoma;
  margin: 0.1em;
  padding: 0.1em;
  text-align: left;
}

/*Main sections under imce-content*/
#ops-wrapper {}
#browse-wrapper {
  overflow: hidden;
  height: 24em;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-top: 1px solid #ccc;
  clear: both;
}
#browse-resizer {}
#log-prv-wrapper {
  height: 12em;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  overflow: hidden;
}
#content-resizer {}

/*columns of browse-wrapper*/
#navigation-wrapper {
  width: 12em;
  height: 100%;
  overflow: auto;
  float: left;
}
#navigation-resizer {
  height: 100%;
  float: left;
}
#sub-browse-wrapper {
  height: 100%;
  overflow: hidden;
}

/*columns of log-prv-wrapper*/
#log-wrapper {
  height: 100%;
  width: 50%;
  float: left;
  overflow: auto;
  background-color: #eee;
}
#log-resizer {
  height: 100%;
  float: left;
}
#preview-wrapper {
  height: 100%;
  overflow: auto;
}

/*rows of sub-browse wrapper*/
#file-header-wrapper {
  height: 2.2em;
  padding: 0px 22px 0px 1px;
}
#file-list-wrapper {
  height: 20.2em;
  overflow: auto;
  padding: 0px 11px 0px 1px;
}
#dir-stat {
  font-size: 0.9em;
  height: 1.8em;
  padding: 0em 0.5em;
  background-color: #f5f5f5;
}

/*Navigation tree (ul)*/
#navigation-tree {
  margin: 0.1em;
  padding: 0em;
}
#navigation-tree ul {
  margin: 0.1em 0em 0.1em 1.5em;
  padding: 0em;
}
#navigation-tree li {
  padding: 0.1em;
  margin: 0em;
  list-style-type: none;
  list-style-image: none;
  background: transparent url(collapsed.png) no-repeat 0.3em 0.6em;
  white-space: nowrap;
}
#navigation-tree li.expanded {
  background-image: url(expanded.png);
}
#navigation-tree li.leaf {
  background-image: url(leaf.png);
}
#navigation-tree li.loading {
  background-image: url(loading.gif);
  background-position: 0em 0.2em;
}
#navigation-tree li span.expander {
  font-size: 12px;
  cursor: pointer;
  margin-right: 0.1em;
}
#navigation-tree li a {
  display: inline;
}
#navigation-tree li a.folder {
  margin-left: 0.2em;
  padding-left: 18px;
  background: transparent url(folder.png) no-repeat 0em 0em;
}
#navigation-tree li a.active {
  font-weight: bold;
  background-image: url(folder-open.png);
}

/*File list and header. (Accessible by #file-list and #file-header. Both have the classname "files")*/
table.files {
  table-layout: fixed;
  width: 99%;
  margin: 0.1em 0em 0em 0em;
}
table.files td {
  overflow: hidden;
  border-top: 1px solid #cc9;
  border-bottom: 1px solid #cc9;
  padding: 0.1em 0.2em;
}
table.files td.name {
  min-width: 15em;
  white-space: nowrap;
}
table.files td.size {
  width: 6.5em;
  text-align: right;
}
table.files td.width {
  width: 4em;
  text-align: right;
}
table.files td.height {
  width: 4em;
}
table.files td.date {
  width: 12.5em;
  text-align: center;
}
table.files tr {
  border: none;
}
table.files tbody {
  border: none;
}
#file-header td {
  font-weight: bold;
  border: none;
}
#file-header td.asc {
  color: #f60;
}
#file-header td.desc {
  color: #f63;
}
#file-list tr:hover {
  background-color: #f5f5f5;
}
#file-list tr.selected {}
#file-list td.name img {
  vertical-align: middle;
  margin-right: 0.2em;
}


/*File operations*/
#op-items {
  min-height: 15px;
}
#op-contents {
  text-align: center;
}
ul#ops-list {/*has classes .secondary and .tabs)*/
  margin: 0.4em;
  padding: 0;
  float: none;
  text-align: center;
  border: none;
}
.op-content {
  width: 50%;
  min-width: 300px;
  margin: 0em auto;
  text-align: left;
  padding: 0.3em;
  display: none;
}
.op-content label, .op-content .form-checkboxes, .op-content .form-checkboxes .form-item {
  display: inline;
}
.op-content .form-submit, .op-content .form-item, .op-content form {
  margin: 0.2em !important;
}
.op-content input {
  font-size: 1em;
}
#ops-list li.loading a, .op-content input.loading {
  background-image: url(loading.gif);
  background-repeat: no-repeat;
  background-position: center right;
  padding-right: 18px;
}

/*Log messages*/
#log-wrapper div {
  padding: 0em;
  margin: 0.1em 0.5em;
  border: none;
  background: none;
}
#log-wrapper span.time {
  color: #444;
}
#log-wrapper .status {}
#log-wrapper .warning {}
#log-wrapper .error {}
a#log-clearer {
  font-size: 0.9em;
}

/*resizers*/
.y-resizer {
  height: 1px;
  cursor: n-resize;
  background: #d4d0c8 url(y-grippie.png) no-repeat center top;
}
.x-resizer {
  width: 1px;
  cursor: e-resize;
  background: #d4d0c8 url(x-grippie.png) no-repeat left center;
}

/*Help box*/
#help-box {
  position: absolute;
  text-decoration: none !important;
  color: #f36;
  overflow: hidden;
}
#help-box-content {
  display: none;
  color: #444;
  background-color: #f5f5f5;
  border: 1px dashed #000;
  padding: 5px;
}
#help-box:hover {
  overflow: visible;
}
#help-box:hover #help-box-content {
  display: block;
}

#file-preview {
  text-align: center;
}
.imce-hide, .js #forms-wrapper {
  display: none;
}

/*Standalone page*/
body.imce {
  padding: 0.1em 0.4em;
  background-image: none;
}
body.imce, body.imce #imce-content {
  color: #333;
  background-color: #fff;
}

File

css/imce-content.css
View source
  1. /*Main container*/
  2. #imce-content {
  3. font-size: 11px;
  4. font-family: Verdana, Tahoma;
  5. margin: 0.1em;
  6. padding: 0.1em;
  7. text-align: left;
  8. }
  9. /*Main sections under imce-content*/
  10. #ops-wrapper {}
  11. #browse-wrapper {
  12. overflow: hidden;
  13. height: 24em;
  14. border-left: 1px solid #ccc;
  15. border-right: 1px solid #ccc;
  16. border-top: 1px solid #ccc;
  17. clear: both;
  18. }
  19. #browse-resizer {}
  20. #log-prv-wrapper {
  21. height: 12em;
  22. border-left: 1px solid #ccc;
  23. border-right: 1px solid #ccc;
  24. overflow: hidden;
  25. }
  26. #content-resizer {}
  27. /*columns of browse-wrapper*/
  28. #navigation-wrapper {
  29. width: 12em;
  30. height: 100%;
  31. overflow: auto;
  32. float: left;
  33. }
  34. #navigation-resizer {
  35. height: 100%;
  36. float: left;
  37. }
  38. #sub-browse-wrapper {
  39. height: 100%;
  40. overflow: hidden;
  41. }
  42. /*columns of log-prv-wrapper*/
  43. #log-wrapper {
  44. height: 100%;
  45. width: 50%;
  46. float: left;
  47. overflow: auto;
  48. background-color: #eee;
  49. }
  50. #log-resizer {
  51. height: 100%;
  52. float: left;
  53. }
  54. #preview-wrapper {
  55. height: 100%;
  56. overflow: auto;
  57. }
  58. /*rows of sub-browse wrapper*/
  59. #file-header-wrapper {
  60. height: 2.2em;
  61. padding: 0px 22px 0px 1px;
  62. }
  63. #file-list-wrapper {
  64. height: 20.2em;
  65. overflow: auto;
  66. padding: 0px 11px 0px 1px;
  67. }
  68. #dir-stat {
  69. font-size: 0.9em;
  70. height: 1.8em;
  71. padding: 0em 0.5em;
  72. background-color: #f5f5f5;
  73. }
  74. /*Navigation tree (ul)*/
  75. #navigation-tree {
  76. margin: 0.1em;
  77. padding: 0em;
  78. }
  79. #navigation-tree ul {
  80. margin: 0.1em 0em 0.1em 1.5em;
  81. padding: 0em;
  82. }
  83. #navigation-tree li {
  84. padding: 0.1em;
  85. margin: 0em;
  86. list-style-type: none;
  87. list-style-image: none;
  88. background: transparent url(collapsed.png) no-repeat 0.3em 0.6em;
  89. white-space: nowrap;
  90. }
  91. #navigation-tree li.expanded {
  92. background-image: url(expanded.png);
  93. }
  94. #navigation-tree li.leaf {
  95. background-image: url(leaf.png);
  96. }
  97. #navigation-tree li.loading {
  98. background-image: url(loading.gif);
  99. background-position: 0em 0.2em;
  100. }
  101. #navigation-tree li span.expander {
  102. font-size: 12px;
  103. cursor: pointer;
  104. margin-right: 0.1em;
  105. }
  106. #navigation-tree li a {
  107. display: inline;
  108. }
  109. #navigation-tree li a.folder {
  110. margin-left: 0.2em;
  111. padding-left: 18px;
  112. background: transparent url(folder.png) no-repeat 0em 0em;
  113. }
  114. #navigation-tree li a.active {
  115. font-weight: bold;
  116. background-image: url(folder-open.png);
  117. }
  118. /*File list and header. (Accessible by #file-list and #file-header. Both have the classname "files")*/
  119. table.files {
  120. table-layout: fixed;
  121. width: 99%;
  122. margin: 0.1em 0em 0em 0em;
  123. }
  124. table.files td {
  125. overflow: hidden;
  126. border-top: 1px solid #cc9;
  127. border-bottom: 1px solid #cc9;
  128. padding: 0.1em 0.2em;
  129. }
  130. table.files td.name {
  131. min-width: 15em;
  132. white-space: nowrap;
  133. }
  134. table.files td.size {
  135. width: 6.5em;
  136. text-align: right;
  137. }
  138. table.files td.width {
  139. width: 4em;
  140. text-align: right;
  141. }
  142. table.files td.height {
  143. width: 4em;
  144. }
  145. table.files td.date {
  146. width: 12.5em;
  147. text-align: center;
  148. }
  149. table.files tr {
  150. border: none;
  151. }
  152. table.files tbody {
  153. border: none;
  154. }
  155. #file-header td {
  156. font-weight: bold;
  157. border: none;
  158. }
  159. #file-header td.asc {
  160. color: #f60;
  161. }
  162. #file-header td.desc {
  163. color: #f63;
  164. }
  165. #file-list tr:hover {
  166. background-color: #f5f5f5;
  167. }
  168. #file-list tr.selected {}
  169. #file-list td.name img {
  170. vertical-align: middle;
  171. margin-right: 0.2em;
  172. }
  173. /*File operations*/
  174. #op-items {
  175. min-height: 15px;
  176. }
  177. #op-contents {
  178. text-align: center;
  179. }
  180. ul#ops-list {/*has classes .secondary and .tabs)*/
  181. margin: 0.4em;
  182. padding: 0;
  183. float: none;
  184. text-align: center;
  185. border: none;
  186. }
  187. .op-content {
  188. width: 50%;
  189. min-width: 300px;
  190. margin: 0em auto;
  191. text-align: left;
  192. padding: 0.3em;
  193. display: none;
  194. }
  195. .op-content label, .op-content .form-checkboxes, .op-content .form-checkboxes .form-item {
  196. display: inline;
  197. }
  198. .op-content .form-submit, .op-content .form-item, .op-content form {
  199. margin: 0.2em !important;
  200. }
  201. .op-content input {
  202. font-size: 1em;
  203. }
  204. #ops-list li.loading a, .op-content input.loading {
  205. background-image: url(loading.gif);
  206. background-repeat: no-repeat;
  207. background-position: center right;
  208. padding-right: 18px;
  209. }
  210. /*Log messages*/
  211. #log-wrapper div {
  212. padding: 0em;
  213. margin: 0.1em 0.5em;
  214. border: none;
  215. background: none;
  216. }
  217. #log-wrapper span.time {
  218. color: #444;
  219. }
  220. #log-wrapper .status {}
  221. #log-wrapper .warning {}
  222. #log-wrapper .error {}
  223. a#log-clearer {
  224. font-size: 0.9em;
  225. }
  226. /*resizers*/
  227. .y-resizer {
  228. height: 1px;
  229. cursor: n-resize;
  230. background: #d4d0c8 url(y-grippie.png) no-repeat center top;
  231. }
  232. .x-resizer {
  233. width: 1px;
  234. cursor: e-resize;
  235. background: #d4d0c8 url(x-grippie.png) no-repeat left center;
  236. }
  237. /*Help box*/
  238. #help-box {
  239. position: absolute;
  240. text-decoration: none !important;
  241. color: #f36;
  242. overflow: hidden;
  243. }
  244. #help-box-content {
  245. display: none;
  246. color: #444;
  247. background-color: #f5f5f5;
  248. border: 1px dashed #000;
  249. padding: 5px;
  250. }
  251. #help-box:hover {
  252. overflow: visible;
  253. }
  254. #help-box:hover #help-box-content {
  255. display: block;
  256. }
  257. #file-preview {
  258. text-align: center;
  259. }
  260. .imce-hide, .js #forms-wrapper {
  261. display: none;
  262. }
  263. /*Standalone page*/
  264. body.imce {
  265. padding: 0.1em 0.4em;
  266. background-image: none;
  267. }
  268. body.imce, body.imce #imce-content {
  269. color: #333;
  270. background-color: #fff;
  271. }