summaryrefslogtreecommitdiff
path: root/platform/www/lib/tpl/dokuwiki/css/pagetools.less
diff options
context:
space:
mode:
Diffstat (limited to 'platform/www/lib/tpl/dokuwiki/css/pagetools.less')
-rw-r--r--platform/www/lib/tpl/dokuwiki/css/pagetools.less124
1 files changed, 124 insertions, 0 deletions
diff --git a/platform/www/lib/tpl/dokuwiki/css/pagetools.less b/platform/www/lib/tpl/dokuwiki/css/pagetools.less
new file mode 100644
index 0000000..5473594
--- /dev/null
+++ b/platform/www/lib/tpl/dokuwiki/css/pagetools.less
@@ -0,0 +1,124 @@
+/**
+ * This file provides the styles for the page tools
+ * (fly out navigation beside the page to edit, etc).
+ *
+ * @author Anika Henke <anika@selfthinker.org>
+ * @author Andreas Gohr <andi@splitbrain.org>
+ */
+
+#dokuwiki__site > .site {
+ /* give space to the right so the tools won't disappear on smaller screens */
+ /* it's 40px because the 30px wide icons will have 5px more spacing to the left and right */
+ padding-right: 40px;
+ /* give the same space to the left to balance it out */
+ padding-left: 40px;
+}
+
+.dokuwiki div.page {
+ height: 190px;
+ min-height: 190px; /* 30 (= height of icons) x 6 (= maximum number of possible tools) + 2x5 */
+ height: auto;
+}
+
+#dokuwiki__pagetools {
+ @ico-width: 28px;
+ @ico-margin: 8px;
+ @item-width: (@ico-width + @ico-margin + @ico-margin);
+ @item-height: (@ico-width + @ico-margin);
+
+ position: absolute;
+ right: (-1 * @item-width);
+ /* on same vertical level as first headline, because .page has 2em padding */
+ top: 2em;
+ width: @item-width;
+
+ div.tools {
+ position: fixed;
+ width: @item-width;
+
+ ul {
+ position: absolute;
+ right: 0;
+ text-align: right;
+ margin: 0;
+ padding: 0;
+ /* add transparent border to prevent jumping when proper border is added on hover */
+ border: 1px solid transparent;
+ z-index: 10;
+
+ li {
+ padding: 0;
+ margin: 0;
+ list-style: none;
+ font-size: 0.875em;
+
+ a {
+
+ display: block;
+ /* add transparent border to prevent jumping when proper border is added on focus */
+ border: 1px solid transparent;
+ white-space: nowrap;
+ line-height: @item-height;
+ vertical-align: middle;
+ height: @item-height;
+
+ span {
+ display: none; // hide label until hover
+ margin: 0 @ico-margin;
+ }
+
+ svg {
+ width: @ico-width;
+ height: @ico-width;
+ margin: 0 @ico-margin;
+ display: inline-block;
+ vertical-align: middle;
+ fill: @ini_border;
+ }
+ }
+
+ // on interaction show the full item
+ a:active,
+ a:focus,
+ a:hover {
+ background-color: @ini_background_alt;
+
+ span {
+ display: inline-block;
+ }
+
+ svg {
+ fill: @ini_link;
+ }
+ }
+ }
+ }
+ }
+
+ [dir=rtl] & {
+ right: auto;
+ left: (-1 * @item-width);
+
+ div.tools {
+ ul {
+ right: auto;
+ left: 0;
+ text-align: left;
+ }
+ }
+ }
+}
+
+// on hover or focus show all items
+#dokuwiki__pagetools:hover, #dokuwiki__pagetools:focus-within {
+ div.tools ul {
+ background-color: @ini_background;
+ border-color: @ini_border;
+ border-radius: 2px;
+ box-shadow: 2px 2px 2px @ini_text_alt;
+
+ li a span {
+ display: inline-block;
+ }
+ }
+}