mediamanager.css

/* Layout */

#mediamanager__page {
    width: 100%;
    overflow-x: auto;
}

#mediamanager__page h1 {
    margin: 0 0 .5em;
}

#mediamanager__layout {
    min-width: 840px;
}

#mediamanager__layout .layout,
#mediamanager__layout .layout-resizable {
    float: left;
}

#mediamanager__layout .layout-resizable {
    margin-right: 10px;
    float: left;
}

#mediamanager__layout .scroll-container {
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0;
    margin: 0;
    text-align: left;
    position: relative;
}

#mediamanager__layout .background-container {
    background-color: __background_alt__;
    margin-bottom: 10px;
    padding: 10px 10px 8px;
    text-align: left;
    min-height: 20px;
}

#mediamanager__layout .background-container .icon {
    margin-right: 5px;
}

#mediamanager__layout_namespaces {
    width: 15%;
    min-width: 125px;
}

#mediamanager__layout_list {
    width: 45%;
    min-width: 375px;
}

#mediamanager__layout_detail {
    width: 35%;
    min-width: 290px;
}

.ui-resizable-e:hover {
    background-color: #dadada;
}

/* Namespaces tree */

#mediamanager__page ul.idx {
    margin-left: .2em;
}

#mediamanager__page ul.idx ul {
    margin-left: 1em;
}

.idx .selected {
    background-color: __highlight__;
    font-weight: bold;
}

/* Tabs */

.mediamanager-tabs a {
    font-weight: bold;
    display: block;
    float: left;
    padding: 10px;
    padding-bottom: 5px;
    padding-top: 5px;
    margin-right: 2px;
    -moz-border-radius-topright: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -webkit-border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}

.mediamanager-tabs .selected {
    background-color: __background_alt__;
}

.mediamanager-tabs a:hover {
    background-color: __background_alt__;
    opacity: 0.5;
}

/* Title links */

#mediamanager__files .namespace {
    float: left;
    font-weight: normal;
}

#mediamanager__tabs_list {
    float: left;
}

#mediamanager__link_thumbs,
#mediamanager__link_list {
    padding-left: 30px;
    display: inline-block;
    width: 0;
    overflow: hidden;
}

#mediamanager__link_thumbs {
    background: url('../../images/icon-thumb.png') 0 -4px no-repeat;
    margin-left: 10px;
}

#mediamanager__link_list {
    background: url('../../images/icon-list.png') 0 -4px no-repeat;
}

#mediamanager__link_thumbs:hover,
#mediamanager__link_list:hover {
    width: auto;
    margin-right: 10px;
}

#mediamanager__sort {
    background: url('../../images/icon-sort.png') 0 -4px no-repeat;
    padding-left: 30px;
    display: block;
    float: right;
}

* html #mediamanager__sort,
*+html #mediamanager__sort {
    position: relative;
    margin-top: -18px;
}

/* File list */

#mediamanager__file_list {
    padding: 0;
    margin: 0 !important;
}

#mediamanager__file_list li:hover {
    background-color: #dadada;
}

/* Files thumbs view */

.mediamanager-thumbs li {
    width: 100px;
    min-height: 130px;
    display: inline-block;
    display: -moz-inline-stack;
    /* the right margin should visually be 10px, but because of its inline-block nature the whitespace inbetween is about 4px more */
    margin: 0 6px 10px 0;
    background-color: __background_alt__;
    padding: 10px;
    vertical-align: top;
    text-align: center;
    zoom: 1;
    position: relative;
}

* html .mediamanager-thumbs li {
    display: inline;
}

*+html .mediamanager-thumbs li {
    display: inline;
}

.mediamanager-thumbs li .image,
.mediamanager-thumbs li .image0 {
    width: 100%;
    height: 90px;
    display: block;
    overflow: hidden;
}

.mediamanager-thumbs li .image1 {
    display: none;
}

.mediamanager-thumbs li .image span,
.mediamanager-thumbs li .image0 span {
    vertical-align: middle;
    display: table-cell;
    width: 100px;
    height: 90px;
}

.mediamanager-thumbs li .name,
.mediamanager-thumbs li .size,
.mediamanager-thumbs li .filesize,
.mediamanager-thumbs li .date {
    display: block;
    overflow: hidden;
    width: 90px;
    white-space: nowrap;
}

.mediamanager-thumbs li .date {
    font-style: italic;
    white-space: normal;
}

.mediamanager-thumbs li input[type=checkbox] {
    display: none;
    float: left;
    margin: 3px;
}

.mediamanager-thumbs li:hover input[type=checkbox],
.mediamanager-thumbs li input[type=checkbox]:checked {
    display: block;
}

/* Files list view */

.mediamanager-list li {
    list-style: none;
    display: block;
    position: relative;
    max-height: 50px;
    margin: 0;
    margin-bottom: 3px;
}

.mediamanager-list li:nth-child(2n+1) {
    background-color: __background_neu__;
}

.mediamanager-list li .image,
.mediamanager-list li .image1 {
    width: 10%;
    display: block;
    overflow: hidden;
    float: left;
    height: 40px;
    text-align: center;
}

.mediamanager-list li .image0 {
    display: none;
}

.mediamanager-list li .name,
.mediamanager-list li .size,
.mediamanager-list li .filesize,
.mediamanager-list li .date {
    overflow: hidden;
    float: left;
    width: 19%;
    margin-left: 1%;
    white-space: nowrap;
}

.mediamanager-list li .date {
    font-style: italic;
    white-space: normal;
}

.mediamanager-list .icon {
    max-width: 16px;
    max-height: 16px;
}

.mediamanager-list li .image span,
.mediamanager-list li .image1 span {
    vertical-align: middle;
    text-align: center;
    display: table-cell;
    width: 100px;
    height: 40px;
}

.mediamanager-list li input[type=checkbox] {
    display: none;
    float: left;
    margin: 3px;
}

.mediamanager-list li:hover input[type=checkbox],
.mediamanager-list li input[type=checkbox]:checked {
    display: block;
}

/* Upload panel */

#mediamanager__layout div.upload {
    padding-bottom: 0.5em;
}

#media__content #mediamanager__uploader {
    border-bottom: 1px solid __border__;
    padding-bottom: 0.5em;
}

/* File preview */

.mediamanager__preview,
.mediamanager__preview_buttons {
    text-align: center;
    margin-bottom: 5px;
}

.mediamanager__preview img {
    width: 99%;
}

/* Meta data edit form */

form.meta textarea.edit {
    height: 8em;
    width: 95%;
    min-width: 95%;
    max-width: 95%;
}

/* Revisions form */

#mediamanager__details #page__revisions ul {
    margin-left: 10px;
    list-style-type: none;
}

#mediamanager__details #page__revisions ul li div.li div {
    font-size: 90%;
    color: __text_neu__;
    padding-left: 18px;
}

#mediamanager__details #page__revisions ul li div.li input {
    position: relative;
    top: 1px;
}

/* File diff */

#mediamanager__diff {
    margin-top: 10px;
}

#mediamanager__diff_table {
    padding: 0;
    margin: 0;
    margin-top: 10px;
}

#mediamanager__diff_table li {
    width: 48%;
    display: inline-block;
    margin: 0;
    margin-bottom: 10px;
    padding: 2px;
    vertical-align: top;
    zoom: 1;
    color: __text__;
}

* html #mediamanager__diff_table li {
    display: inline;
}

*+html #mediamanager__diff_table li {
    display: inline;
}

/* For IE7 */
*:first-child+html #mediamanager__diff_table li {
    width: 45%;
}

/* Image diff */

#mediamanager__layout dl.img_tags dd.highlighted{
    background-color: __highlight__;
}

#mediamanager__form_diffview {
    margin-bottom: 10px;
}

#mediamanager__diff_layout {
    position: relative;
}

#mediamanager__diff_layout div {
    position: absolute;
    top: 0;
    left: 0;
}

#mediamanager__diff_opacity_image1,
#mediamanager__diff_portions_image1 {
    width: 97%;
}

#mediamanager__diff_layout div img {
    width: 100%;
}

#mediamanager__diff_opacity_image2 {
    width: 97%;
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
}

#mediamanager__diff_portions_image2 {
    width: 97%;
    border-right: 1px solid red;
    overflow: hidden;
}

#mediamanager__opacity_slider,
#mediamanager__portions_slider {
    margin: 10px;
    width: 95%;
}