about summary refs log tree commit diff stats
path: root/wiki/lib/tpl/dokuwiki/css/_media_fullscreen.css
diff options
context:
space:
mode:
Diffstat (limited to 'wiki/lib/tpl/dokuwiki/css/_media_fullscreen.css')
-rw-r--r--wiki/lib/tpl/dokuwiki/css/_media_fullscreen.css541
1 files changed, 541 insertions, 0 deletions
diff --git a/wiki/lib/tpl/dokuwiki/css/_media_fullscreen.css b/wiki/lib/tpl/dokuwiki/css/_media_fullscreen.css
new file mode 100644
index 0000000..9a00d4d
--- /dev/null
+++ b/wiki/lib/tpl/dokuwiki/css/_media_fullscreen.css
@@ -0,0 +1,541 @@
+/**
+ * This file provides the styles for the fullscreen media manager
+ * (?do=media).
+ *
+ * What most templates would probably need to change (depending on
+ * their site width) are the 4 min-width's (search for @change).
+ */
+
+
+/*____________ structure ____________*/
+
+#mediamanager__page h1 {
+    margin-bottom: .5em;
+}
+
+#mediamanager__page {
+    /* min-width must be summary of all 3 panels' min-widths */
+    min-width: 50em; /* @change */
+    width: 100%;
+    text-align: left;
+}
+[dir=rtl] #mediamanager__page {
+    text-align: right;
+}
+#mediamanager__page .panel {
+    float: left;
+}
+[dir=rtl] #mediamanager__page .panel {
+    float: right;
+}
+
+#mediamanager__page .namespaces {
+    width: 20%;
+    min-width: 10em; /* @change */
+    left:0 !important; /* overrules jQuery UI resizable in rtl */
+}
+#mediamanager__page .filelist {
+    width: 50%;
+    min-width: 25em; /* @change */
+    left:0 !important; /* overrules jQuery UI resizable in rtl */
+}
+#mediamanager__page .file {
+    width: 30%;
+    min-width: 15em; /* @change */
+}
+
+#mediamanager__page .tabs li {
+    white-space: nowrap;
+}
+
+#mediamanager__page .panelHeader {
+    background-color: @ini_background_alt;
+    margin: 0 10px 10px 0;
+    padding: 10px 10px 8px;
+    text-align: left;
+    min-height: 20px;
+    overflow: hidden;
+}
+[dir=rtl] #mediamanager__page .panelHeader {
+    text-align: right;
+    margin: 0 0 10px 10px;
+}
+#mediamanager__page .panelContent {
+    overflow-y: auto;
+    overflow-x: hidden;
+    padding: 0;
+    margin: 0 10px 10px 0;
+    position: relative;
+}
+[dir=rtl] #mediamanager__page .panelContent {
+    text-align: right;
+    margin: 0 0 10px 10px;
+}
+
+#mediamanager__page .file .panelHeader,
+#mediamanager__page .file .panelContent {
+    margin-right: 0;
+}
+[dir=rtl] #mediamanager__page .file .panelHeader,
+[dir=rtl] #mediamanager__page .file .panelContent {
+    margin-left: 0;
+}
+
+#mediamanager__page .ui-resizable-e {
+    width: 6px;
+    right: 2px;
+    background: transparent url(../../images/resizecol.png) center center no-repeat;
+}
+#mediamanager__page .ui-resizable-e:hover {
+    background-color: @ini_background_alt;
+}
+[dir=rtl] #mediamanager__page .ui-resizable-w {
+    width: 6px;
+    left: 2px;
+    background: transparent url(../../images/resizecol.png) center center no-repeat;
+}
+[dir=rtl] #mediamanager__page .ui-resizable-w:hover {
+    background-color: @ini_background_alt;
+}
+
+
+#mediamanager__page dd {
+    margin: 0;
+}
+
+#mediamanager__page .panelHeader h3 {
+    float: left;
+    font-weight: normal;
+    font-size: 1em;
+    padding: 0;
+    margin: 0 0 3px;
+}
+[dir=rtl] #mediamanager__page .panelHeader h3 {
+    float : right
+}
+
+
+/*____________ namespaces panel ____________*/
+
+[dir=rtl] #mediamanager__page .namespaces {
+    text-align: right;
+}
+
+/* make it look like a tab (as in _tabs.css) */
+#mediamanager__page .namespaces h2 {
+    font-size: 1em;
+    display: inline-block;
+    padding: .3em .8em;
+    margin: 0 0 0 .3em;
+    border-radius: .5em .5em 0 0;
+    font-weight: normal;
+    background-color: @ini_background_alt;
+    color: @ini_text;
+    border: 1px solid @ini_border;
+    border-bottom-color: @ini_background_alt;
+    line-height: 1.4em;
+    position: relative;
+    bottom: -1px;
+    z-index: 2;
+}
+[dir=rtl] #mediamanager__page .namespaces h2 {
+    margin: 0 .3em 0 0;
+    position: relative;
+    right: 10px;
+}
+#mediamanager__page .namespaces .panelHeader {
+    border-top: 1px solid @ini_border;
+    z-index: 1;
+}
+
+#mediamanager__page .namespaces ul {
+    margin-left: .2em;
+    margin-bottom: 0;
+    padding: 0;
+    list-style: none;
+}
+[dir=rtl] #mediamanager__page .namespaces ul {
+    margin-left: 0;
+    margin-right: .2em;
+}
+#mediamanager__page .namespaces ul ul {
+    margin-left: 1em;
+}
+[dir=rtl] #mediamanager__page .namespaces ul ul {
+    margin-left: 0;
+    margin-right: 1em;
+}
+#mediamanager__page .namespaces ul ul li {
+    margin: 0;
+}
+
+#mediamanager__page .namespaces ul .selected {
+    background-color: __highlight__;
+    font-weight: bold;
+}
+
+
+/*____________ file list panel ____________*/
+
+/* file list header */
+
+#mediamanager__page .panelHeader form.options {
+    float: right;
+    margin-top: -3px;
+}
+[dir=rtl] #mediamanager__page .panelHeader form.options {
+    float : left
+}
+#mediamanager__page .panelHeader ul {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+#mediamanager__page .panelHeader ul li {
+    color: @ini_text;
+    float: left;
+    line-height: 1;
+    padding-left: 3px;
+}
+[dir=rtl] #mediamanager__page .panelHeader ul li {
+    padding-right: 3px;
+    padding-left: 0;
+    float: right;
+}
+
+#mediamanager__page .panelHeader ul li.ui-controlgroup-horizontal {
+    padding-left: 30px;
+    margin: 0 0 0 5px;
+}
+#mediamanager__page .panelHeader ul li.listType {
+    background: url('../../images/icon-list.png') 3px 1px no-repeat;
+}
+#mediamanager__page .panelHeader ul li.sortBy {
+    background: url('../../images/icon-sort.png') 3px 1px no-repeat;
+}
+[dir=rtl] #mediamanager__page .panelHeader ul li.ui-controlgroup-horizontal {
+    padding-left: 0;
+    padding-right: 30px;
+    margin: 0 5px 0 0;
+    background-position: right 1px;
+}
+
+#mediamanager__page .panelHeader form.options .ui-controlgroup-horizontal label{
+    font-size: 90%;
+    margin-right: -0.4em;
+    padding: .3em .5em;
+    line-height: 1;
+}
+
+/* file list content */
+
+#mediamanager__page .filelist ul {
+    padding: 0;
+    margin: 0 10px 0 0;
+}
+[dir=rtl] #mediamanager__page .filelist ul {
+    margin: 0 0 0 10px;
+}
+#mediamanager__page .filelist ul.rows {
+    margin: 0;
+}
+#mediamanager__page .filelist .panelContent ul li:hover {
+    background-color: @ini_background_alt;
+}
+
+#mediamanager__page .filelist li dt a {
+    vertical-align: middle;
+    display: table-cell;
+    overflow: hidden;
+}
+
+/* file list as thumbs */
+
+#mediamanager__page .filelist .thumbs li {
+    width: 100px;
+    min-height: 130px;
+    display: inline-block;
+    /* 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: @ini_background_neu;
+    color: @ini_text;
+    padding: 5px;
+    vertical-align: top;
+    text-align: center;
+    position: relative;
+    line-height: 1.2;
+}
+[dir=rtl] #mediamanager__page .filelist .thumbs li {
+    margin-right: 0;
+    margin-left: 6px;
+}
+
+#mediamanager__page .filelist .thumbs li dt a {
+    width: 100px;
+    height: 90px;
+}
+
+#mediamanager__page .filelist .thumbs li dt a img {
+    max-width: 90px;
+    max-height: 90px;
+}
+
+#mediamanager__page .filelist .thumbs li .name,
+#mediamanager__page .filelist .thumbs li .size,
+#mediamanager__page .filelist .thumbs li .filesize,
+#mediamanager__page .filelist .thumbs li .date {
+    display: block;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    width: 90px;
+    white-space: nowrap;
+}
+#mediamanager__page .filelist .thumbs li .name {
+    padding: 5px 0;
+    font-weight: bold;
+}
+#mediamanager__page .filelist .thumbs li .date {
+    font-style: italic;
+    white-space: normal;
+}
+
+/* file list as rows */
+
+#mediamanager__page .filelist .rows li {
+    list-style: none;
+    display: block;
+    position: relative;
+    max-height: 50px;
+    margin: 0 0 3px 0;
+    background-color: @ini_background;
+    color: @ini_text;
+    overflow: hidden;
+}
+
+#mediamanager__page .filelist .rows li:nth-child(2n+1) {
+    background-color: @ini_background_neu;
+}
+
+#mediamanager__page .filelist .rows li dt {
+    float: left;
+    width: 10%;
+    height: 40px;
+    text-align: center;
+}
+[dir=rtl] #mediamanager__page .filelist .rows li dt {
+    float: right;
+}
+#mediamanager__page .filelist .rows li dt a {
+    width: 100px;
+    height: 40px;
+}
+
+#mediamanager__page .filelist .rows li dt a img {
+    max-width: 40px;
+    max-height: 40px;
+}
+
+#mediamanager__page .filelist .rows li .name,
+#mediamanager__page .filelist .rows li .size,
+#mediamanager__page .filelist .rows li .filesize,
+#mediamanager__page .filelist .rows li .date {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    float: left;
+    margin-left: 1%;
+    white-space: nowrap;
+}
+[dir=rtl] #mediamanager__page .filelist .rows li .name,
+[dir=rtl] #mediamanager__page .filelist .rows li .size,
+[dir=rtl] #mediamanager__page .filelist .rows li .filesize,
+[dir=rtl] #mediamanager__page .filelist .rows li .date {
+    float: right;
+    margin-left: 0;
+    margin-right: 1%;
+}
+
+#mediamanager__page .filelist .rows li .name {
+    width: 30%;
+    font-weight: bold;
+}
+#mediamanager__page .filelist .rows li .size,
+#mediamanager__page .filelist .rows li .filesize {
+    width: 15%;
+}
+#mediamanager__page .filelist .rows li .date {
+    width: 20%;
+    font-style: italic;
+    white-space: normal;
+}
+
+/* upload form */
+
+#mediamanager__page div.upload {
+    padding-bottom: 0.5em;
+}
+
+/*____________ file panel ____________*/
+
+#mediamanager__page .file ul.actions {
+    text-align: center;
+    margin: 0 0 5px;
+    padding: 0;
+    list-style: none;
+}
+#mediamanager__page .file ul.actions li {
+    display: inline;
+    margin: 0;
+}
+
+#mediamanager__page .file div.image {
+    margin-bottom: 5px;
+    text-align: center;
+}
+
+#mediamanager__page .file div.image img {
+    width: 100%;
+}
+
+#mediamanager__page .file dl {
+    margin-bottom: 0;
+}
+#mediamanager__page .file dl dt {
+    font-weight: bold;
+    display: block;
+    background-color: @ini_background_alt;
+}
+#mediamanager__page .file dl dd {
+    display: block;
+    background-color: @ini_background_neu;
+}
+
+
+/* file meta data edit form */
+
+#mediamanager__page form.meta div.row {
+    margin-bottom: 5px;
+}
+
+#mediamanager__page form.meta label span {
+    display: block;
+}
+
+#mediamanager__page form.meta input {
+    width: 50%;
+}
+
+#mediamanager__page form.meta button {
+    width: auto;
+}
+
+#mediamanager__page form.meta textarea.edit {
+    height: 6em;
+    width: 95%;
+    min-width: 95%;
+    max-width: 95%;
+}
+
+/* file revisions form */
+
+#mediamanager__page form.changes ul {
+    margin-left: 10px;
+    padding: 0;
+    list-style-type: none;
+}
+[dir=rtl] #mediamanager__page form.changes ul {
+    margin-left: 0;
+    margin-right: 10px;
+}
+
+#mediamanager__page form.changes ul li div.li div {
+    font-size: 90%;
+    color: @ini_text_neu;
+    padding-left: 18px;
+}
+[dir=rtl] #mediamanager__page form.changes ul li div.li div {
+    padding-left: 0;
+    padding-right: 18px;
+}
+#mediamanager__page form.changes ul li div.li input {
+    position: relative;
+    top: 1px;
+}
+
+/* file diff view */
+
+#mediamanager__diff table {
+    table-layout: fixed;
+    border-width: 0;
+}
+
+#mediamanager__diff td,
+#mediamanager__diff th {
+    width: 48%;
+    margin: 0 5px 10px 0;
+    padding: 0;
+    vertical-align: top;
+    text-align: left;
+    border-color: @ini_background;
+}
+[dir=rtl] #mediamanager__diff td,
+[dir=rtl] #mediamanager__diff th {
+    margin: 0 0 10px 5px;
+    text-align: right;
+}
+
+#mediamanager__diff th {
+    font-weight: normal;
+    background-color: @ini_background;
+    line-height: 1.2;
+}
+#mediamanager__diff th a {
+    font-weight: bold;
+}
+#mediamanager__diff th span {
+    font-size: 90%;
+}
+
+#mediamanager__diff dl dd strong{
+    background-color: __highlight__;
+    color: @ini_text;
+    font-weight: normal;
+}
+
+/* image diff views */
+
+#mediamanager__page .file form.diffView {
+    margin-bottom: 10px;
+    display: block;
+}
+
+#mediamanager__diff div.slider {
+    margin: 10px;
+    width: 95%;
+}
+
+#mediamanager__diff .imageDiff {
+    position: relative;
+}
+#mediamanager__diff .imageDiff .image2 {
+    position: absolute;
+    top: 0;
+    left: 0;
+}
+
+#mediamanager__diff .imageDiff.opacity .image2 {
+    opacity: 0.5;
+}
+
+#mediamanager__diff .imageDiff.portions .image2 {
+    border-right: 1px solid red;
+    overflow: hidden;
+}
+
+#mediamanager__diff .imageDiff.portions img {
+    float: left;
+}
+
+#mediamanager__diff .imageDiff img {
+    width: 100%;
+    max-width: none;
+}