about summary refs log tree commit diff stats
path: root/wiki/lib/tpl/dokuwiki/css/mobile.less
diff options
context:
space:
mode:
Diffstat (limited to 'wiki/lib/tpl/dokuwiki/css/mobile.less')
-rw-r--r--wiki/lib/tpl/dokuwiki/css/mobile.less332
1 files changed, 332 insertions, 0 deletions
diff --git a/wiki/lib/tpl/dokuwiki/css/mobile.less b/wiki/lib/tpl/dokuwiki/css/mobile.less
new file mode 100644
index 0000000..a52c723
--- /dev/null
+++ b/wiki/lib/tpl/dokuwiki/css/mobile.less
@@ -0,0 +1,332 @@
+/**
+ * This file provides styles for mobile devices
+ * and smaller screens (up to 480px and 768px width).
+ *
+ * @author Anika Henke <anika@selfthinker.org>
+ */
+
+/* for detecting media queries in JavaScript (see script.js): */
+#screen__mode {
+    position: relative;
+    z-index: 0;
+}
+
+/* for screen widths in the tablet range
+********************************************************************/
+@media only screen and (max-width: @ini_tablet_width) {
+
+#screen__mode {
+    z-index: 1; /* for detecting media queries in JavaScript (see script.js) */
+}
+
+/* structure */
+#dokuwiki__aside {
+    width: 100%;
+    float: none;
+    margin-bottom: 1.5em;
+}
+
+#dokuwiki__aside > .pad,
+[dir=rtl] #dokuwiki__aside > .pad {
+    margin: 0 0 .5em;
+    /* style like .page */
+    background: @ini_background;
+    color: inherit;
+    border: 1px solid #eee;
+    box-shadow: 0 0 .5em @ini_text_alt;
+    border-radius: 2px;
+    padding: 1em;
+    margin-bottom: .5em;
+}
+
+#dokuwiki__aside h3.toggle {
+    font-size: 1em;
+
+    &.closed {
+        margin-bottom: 0;
+        padding-bottom: 0;
+    }
+    &.open {
+        border-bottom: 1px solid @ini_border;
+    }
+}
+
+.showSidebar #dokuwiki__content {
+    float: none;
+    margin-left: 0;
+    width: 100%;
+
+    > .pad {
+        margin-left: 0;
+    }
+}
+
+[dir=rtl] .showSidebar #dokuwiki__content,
+[dir=rtl] .showSidebar #dokuwiki__content > .pad {
+    margin-right: 0;
+}
+
+/* preview */
+.dokuwiki.hasSidebar div.preview {
+    border-right: none;
+}
+
+[dir=rtl] .dokuwiki.hasSidebar div.preview {
+    border-left: none;
+}
+
+/* toc */
+#dw__toc {
+    float: none;
+    margin: 0 0 1em 0;
+    width: auto;
+    border-left-width: 0;
+    border-bottom: 1px solid @ini_border;
+}
+[dir=rtl] #dw__toc {
+    float: none;
+    margin: 0 0 1em 0;
+    border-right-width: 0;
+}
+
+.dokuwiki h3.toggle {
+    padding: 0 .5em .5em 0;
+}
+#dw__toc > div,
+#dokuwiki__aside div.content {
+    padding: .2em 0 .5em;
+}
+
+/* page */
+.dokuwiki div.page {
+    padding: 1em;
+}
+/* enable horizontal scrolling in media manager */
+.mode_media div.page {
+    overflow: auto;
+}
+
+/* push pagetools closer to content */
+#dokuwiki__pagetools {
+    top: 0;
+}
+.showSidebar #dokuwiki__pagetools {
+    top: 3.5em;
+}
+
+
+/* _edit */
+.dokuwiki div.section_highlight {
+    margin: 0 -1em;
+    padding: 0 .5em;
+    border-width: 0 .5em;
+}
+.dokuwiki div.preview {
+    margin: 0 -1em;
+    padding: 1em;
+}
+
+/* _recent */
+.dokuwiki form.changes ul {
+    padding-left: 0;
+}
+[dir=rtl] .dokuwiki form.changes ul {
+    padding-right: 0;
+}
+
+
+} /* /@media */
+
+
+/* for screen widths in the smartphone range
+********************************************************************/
+@media only screen and (max-width: @ini_phone_width) {
+
+#screen__mode {
+    z-index: 2; /* for detecting media queries in JavaScript (see script.js) */
+}
+
+body {
+    font-size: 100%;
+}
+
+/*____________ structure ____________*/
+
+#dokuwiki__site {
+    max-width: 100%;
+
+    > .site {
+        padding: 0 .5em;
+    }
+}
+
+#dokuwiki__aside {
+    margin-bottom: 0;
+}
+
+#dokuwiki__header {
+    padding: .5em 0;
+}
+
+
+/*____________ header ____________*/
+
+#dokuwiki__header ul.a11y.skip {
+    position: static !important;
+    left: 0 !important;
+    width: auto !important;
+    height: auto !important;
+    float: right;
+    font-size: 0.875em;
+    list-style: none;
+    padding-left: 0;
+    margin: 0;
+
+    li {
+        margin-left: .35em;
+        display: inline;
+    }
+}
+[dir=rtl] #dokuwiki__header ul.a11y.skip {
+    left: auto !important;
+    right: 0 !important;
+    float: left;
+    padding-right: 0;
+
+    li {
+        margin: 0 .35em 0 0;
+    }
+}
+
+#dokuwiki__header .headings,
+#dokuwiki__header .tools {
+    float: none;
+    text-align: left;
+    width: auto;
+    margin-bottom: .5em;
+}
+[dir=rtl] #dokuwiki__header .headings,
+[dir=rtl] #dokuwiki__header .tools {
+    float: none;
+    text-align: right;
+    width: auto;
+}
+#dokuwiki__sitetools {
+    text-align: left;
+}
+[dir=rtl] #dokuwiki__sitetools {
+    text-align: right;
+}
+#dokuwiki__usertools,
+#dokuwiki__sitetools ul,
+#dokuwiki__sitetools h3,
+#dokuwiki__pagetools,
+.dokuwiki div.breadcrumbs, /* @todo: maybe move breadcrumbs to the bottom? */
+.dokuwiki .pageId {
+    display: none;
+}
+
+/* search form */
+#dokuwiki__sitetools form.search {
+    float: left;
+    margin: 0 .2em .2em 0;
+    width: 49%;
+}
+[dir=rtl] #dokuwiki__sitetools form.search {
+    float: right;
+    margin: 0 0 .2em .2em;
+}
+
+#dokuwiki__sitetools form.search input {
+    width: 100% !important;
+}
+.dokuwiki form.search div.ajax_qsearch {
+    display: none !important;
+}
+
+/* action dropdown is alternative for all hidden tools */
+#dokuwiki__header .mobileTools {
+    display: block;
+    font-size: 0.875em;
+    margin: 0 0 .2em 0;
+    float: right;
+    width: 49%;
+}
+[dir=rtl] #dokuwiki__header .mobileTools {
+    float: left;
+}
+#dokuwiki__header .mobileTools select {
+    padding: .3em .1em;
+    width: 100% !important;
+}
+
+/* force same height on search input and tools select */
+#dokuwiki__sitetools form.search input,
+#dokuwiki__header .mobileTools select {
+    height: 2.1em;
+    line-height: 2.1em;
+    overflow: visible;
+}
+
+
+/*____________ content ____________*/
+
+#dokuwiki__aside > .pad,
+.dokuwiki div.page {
+    padding: .5em;
+}
+
+/* form elements */
+#config__manager fieldset td.value,
+#config__manager td .input,
+.dokuwiki fieldset,
+.dokuwiki input.edit,
+.dokuwiki textarea {
+    width: auto !important;
+    max-width: 100% !important;
+}
+.dokuwiki select {
+    max-width: 100% !important;
+}
+#config__manager fieldset {
+    margin-left: 0;
+    margin-right: 0;
+}
+
+.dokuwiki label.block {
+    text-align: left;
+
+    span {
+        display: block;
+    }
+}
+[dir=rtl] .dokuwiki label.block {
+    text-align: right;
+}
+
+/* _edit */
+.dokuwiki div.section_highlight {
+    margin: 0;
+    padding: 0;
+    border-width: 0;
+}
+.dokuwiki div.preview {
+    margin: 0 -.5em;
+    padding: .5em;
+}
+
+
+} /* /@media */
+
+
+/* for screen heights smaller than the pagetools permit
+********************************************************************/
+@media only screen and (max-height: 400px) {
+// 400px is only roughly the required value, this may be wrong under non-standard circumstances
+
+#dokuwiki__pagetools div.tools {
+    position: static;
+}
+
+
+} /* /@media */