1 2/*____________ Layout ____________*/ 3 4#mediamanager__page h1 { 5 margin: 0 0 .5em; 6} 7 8#mediamanager__page { 9 min-width: 800px; 10 width: 100%; 11 text-align: left; 12} 13 14#mediamanager__page .panel { 15 float: left; 16} 17 18#mediamanager__page .namespaces { 19 width: 15%; 20 min-width: 120px; 21} 22#mediamanager__page .filelist { 23 width: 50%; 24 min-width: 400px; 25} 26#mediamanager__page .file { 27 width: 35%; 28 min-width: 280px; 29} 30 31#mediamanager__page .panelHeader { 32 background-color: __background_alt__; 33 margin: 0 10px 10px 0; 34 padding: 10px 10px 8px; 35 text-align: left; 36 min-height: 20px; 37 overflow: hidden; 38} 39 40#mediamanager__page .panelContent { 41 overflow-y: auto; 42 overflow-x: hidden; 43 padding: 0; 44 margin: 0 10px 10px 0; 45 position: relative; 46} 47 48#mediamanager__page .file .panelHeader, 49#mediamanager__page .file .panelContent { 50 margin-right: 0; 51} 52 53#mediamanager__page .ui-resizable-e { 54 width: 6px; 55 right: 2px; 56 background: transparent url(images/resizecol.png) center center no-repeat; 57} 58#mediamanager__page .ui-resizable-e:hover { 59 background-color: __background_alt__; 60} 61 62/*____________ Namespaces tree ____________*/ 63 64#mediamanager__page .namespaces h2 { 65 font-size: 1em; 66 display: inline-block; 67 border-width: 0; 68 padding: .3em .8em; 69 margin: 0 .3em 0 0; 70 border-radius: .5em .5em 0 0; 71 font-weight: normal; 72 background-color: __background_alt__; 73 color: __text__; 74 line-height: 1.5em; 75} 76* html #mediamanager__page .namespaces h2, 77*+html #mediamanager__page .namespaces h2 { 78 display: inline; 79} 80 81#mediamanager__page .namespaces ul { 82 margin-left: .2em; 83 list-style: none; 84} 85#mediamanager__page .namespaces ul ul { 86 margin-left: 1em; 87} 88 89#mediamanager__page .namespaces ul .selected { 90 background-color: __highlight__; 91 font-weight: bold; 92} 93 94/*____________ Panel header ____________*/ 95 96#mediamanager__page .panelHeader h3 { 97 float: left; 98 font-weight: normal; 99 font-size: 1em; 100 padding: 0; 101 margin: 0 0 3px; 102} 103 104#mediamanager__page .panelHeader form.options { 105 float: right; 106 margin-top: -3px; 107} 108 109#mediamanager__page .panelHeader ul { 110 list-style: none; 111 margin: 0; 112 padding: 0; 113} 114#mediamanager__page .panelHeader ul li { 115 color: __text__; 116 float: left; 117 line-height: 1; 118 padding-left: 3px; 119} 120 121#mediamanager__page .panelHeader ul li.listType { 122 padding-left: 30px; 123 background: url('../../images/icon-list.png') 3px 1px no-repeat; 124} 125#mediamanager__page .panelHeader ul li.sortBy { 126 padding-left: 30px; 127 background: url('../../images/icon-sort.png') 3px 1px no-repeat; 128} 129 130#mediamanager__page .panelHeader form.options .ui-buttonset label{ 131 font-size: 90%; 132 margin-right: -0.4em; 133} 134#mediamanager__page .panelHeader form.options .ui-buttonset .ui-button-text { 135 padding: .4em .7em; 136 line-height: 1; 137} 138 139/*____________ File list ____________*/ 140 141#mediamanager__page .filelist ul { 142 padding: 0; 143 margin: 0; 144} 145 146#mediamanager__page .filelist .panelContent ul li:hover { 147 background-color: __background_alt__; 148} 149 150#mediamanager__page .filelist li dt a { 151 vertical-align: middle; 152 display: table-cell; 153 overflow: hidden; 154} 155* html #mediamanager__page .filelist .thumbs li dt a, 156*+html #mediamanager__page .filelist .thumbs li dt a { 157 display: block; 158} 159* html #mediamanager__page .filelist .rows li dt a, 160*+html #mediamanager__page .filelist .rows li dt a { 161 display: inline; 162} 163 164/* thumbs */ 165 166#mediamanager__page .filelist .thumbs li { 167 width: 100px; 168 min-height: 130px; 169 display: inline-block; 170 display: -moz-inline-stack; 171 /* the right margin should visually be 10px, but because of its inline-block nature the whitespace inbetween is about 4px more */ 172 margin: 0 6px 10px 0; 173 background-color: __background_neu__; 174 color: __text__; 175 padding: 5px; 176 vertical-align: top; 177 text-align: center; 178 position: relative; 179 line-height: 1.2; 180} 181* html #mediamanager__page .filelist .thumbs li, 182*+html #mediamanager__page .filelist .thumbs li { 183 display: inline; 184 zoom: 1; 185} 186 187#mediamanager__page .filelist .thumbs li dt a { 188 width: 100px; 189 height: 90px; 190} 191 192#mediamanager__page .filelist .thumbs li dt a img { 193 max-width: 90px; 194 max-height: 90px; 195} 196 197#mediamanager__page .filelist .thumbs li .name, 198#mediamanager__page .filelist .thumbs li .size, 199#mediamanager__page .filelist .thumbs li .filesize, 200#mediamanager__page .filelist .thumbs li .date { 201 display: block; 202 overflow: hidden; 203 width: 90px; 204 white-space: nowrap; 205} 206#mediamanager__page .filelist .thumbs li .name { 207 padding: 5px 0; 208 font-weight: bold; 209} 210#mediamanager__page .filelist .thumbs li .date { 211 font-style: italic; 212 white-space: normal; 213} 214 215/* rows */ 216 217#mediamanager__page .filelist .rows li { 218 list-style: none; 219 display: block; 220 position: relative; 221 max-height: 50px; 222 margin: 0; 223 margin-bottom: 3px; 224 background-color: __background__; 225 color: __text__; 226 overflow: hidden; 227} 228 229#mediamanager__page .filelist .rows li:nth-child(2n+1) { 230 background-color: __background_neu__; 231} 232 233#mediamanager__page .filelist .rows li dt { 234 float: left; 235 width: 10%; 236 height: 40px; 237 text-align: center; 238} 239 240#mediamanager__page .filelist .rows li dt a { 241 width: 100px; 242 height: 40px; 243} 244 245#mediamanager__page .filelist .rows li dt a img { 246 max-width: 40px; 247 max-height: 40px; 248} 249 250#mediamanager__page .filelist .rows li .name, 251#mediamanager__page .filelist .rows li .size, 252#mediamanager__page .filelist .rows li .filesize, 253#mediamanager__page .filelist .rows li .date { 254 overflow: hidden; 255 float: left; 256 margin-left: 1%; 257 white-space: nowrap; 258} 259 260#mediamanager__page .filelist .rows li .name { 261 width: 30%; 262 font-weight: bold; 263} 264#mediamanager__page .filelist .rows li .size, 265#mediamanager__page .filelist .rows li .filesize { 266 width: 15%; 267} 268#mediamanager__page .filelist .rows li .date { 269 width: 20%; 270 font-style: italic; 271 white-space: normal; 272} 273 274/*____________ Upload panel ____________*/ 275 276#mediamanager__page div.upload { 277 padding-bottom: 0.5em; 278} 279 280#media__content #mediamanager__uploader { 281 border-bottom: 1px solid __border__; 282 padding-bottom: 0.5em; 283} 284 285/*____________ File preview ____________*/ 286 287#mediamanager__page .file ul.actions { 288 text-align: center; 289 margin: 0 0 5px; 290 list-style: none; 291} 292#mediamanager__page .file ul.actions li { 293 display: inline; 294} 295 296#mediamanager__page .file div.image { 297 margin-bottom: 5px; 298 text-align: center; 299} 300 301#mediamanager__page .file div.image img { 302 width: 100%; 303} 304 305#mediamanager__page .file dl { 306} 307#mediamanager__page .file dl dt { 308 font-weight: bold; 309 display: block; 310 background-color: __background_alt__; 311} 312#mediamanager__page .file dl dd { 313 display: block; 314 background-color: __background_neu__; 315} 316 317 318/*____________ Meta data edit form ____________*/ 319 320#mediamanager__page form.meta div.row { 321 margin-bottom: 5px; 322} 323 324#mediamanager__page form.meta label span { 325 display: block; 326} 327 328#mediamanager__page form.meta input { 329 width: 50%; 330} 331 332#mediamanager__page form.meta input.button { 333 width: auto; 334} 335 336#mediamanager__page form.meta textarea.edit { 337 height: 6em; 338 width: 95%; 339 min-width: 95%; 340 max-width: 95%; 341} 342 343/*____________ Revisions form ____________*/ 344 345#mediamanager__page #page__revisions ul { 346 margin-left: 10px; 347 list-style-type: none; 348} 349 350#mediamanager__page #page__revisions ul li div.li div { 351 font-size: 90%; 352 color: __text_neu__; 353 padding-left: 18px; 354} 355 356#mediamanager__page #page__revisions ul li div.li input { 357 position: relative; 358 top: 1px; 359} 360 361/* File diff */ 362 363#mediamanager__diff table { 364 table-layout: fixed; 365} 366 367#mediamanager__diff td, 368#mediamanager__diff th { 369 width: 48%; 370 margin: 0 5px 10px 0; 371 padding: 0; 372 vertical-align: top; 373 text-align: left; 374} 375 376#mediamanager__diff th { 377 font-weight: normal; 378} 379#mediamanager__diff th a { 380 font-weight: bold; 381} 382#mediamanager__diff th span { 383 font-size: 90%; 384} 385 386#mediamanager__diff dl dd strong{ 387 background-color: __highlight__; 388 color: __text__; 389 font-weight: normal; 390} 391 392/* Image diff */ 393 394#mediamanager__page .file form.diffView { 395 margin-bottom: 10px; 396 display: block; 397} 398 399#mediamanager__diff div.slider { 400 margin: 10px; 401 width: 95%; 402} 403 404#mediamanager__diff .imageDiff { 405 position: relative; 406} 407#mediamanager__diff .imageDiff .image1, 408#mediamanager__diff .imageDiff .image2 { 409 position: absolute; 410 top: 0; 411 left: 0; 412 width: 97%; 413} 414 415#mediamanager__diff .imageDiff.opacity .image2 { 416 -moz-opacity: 0.5; 417 -khtml-opacity: 0.5; 418 opacity: 0.5; 419} 420 421#mediamanager__diff .imageDiff.portions .image2 { 422 border-right: 1px solid red; 423 overflow: hidden; 424} 425 426#mediamanager__diff .imageDiff img { 427 width: 100%; 428} 429 430