From 211de8a54af91550eaacc8374af61da6d1356514 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Michael=20Gro=C3=9Fe?= Date: Mon, 24 Apr 2017 19:23:48 +0200 Subject: [PATCH 1/2] Use do-plugin's user task button w/ overlay Motivation ---------- Since we do not have a dashboard it would be useful to directly see one's task on click upon the respective icon. Also this is most likely the dominating reason of the dashboard-usage. Implementation Decisions ------------------------ * Use SVG: Since we move towards using SVG everywhere in DokuWiki, I decided to use a SVG icon here as well. This makes it compatible with other templates too, without introducing an icon-font there. * Using a `` instead of a ``: I do not see the semantic reason behind using a `` here. Other Changes ------------- * The styles related to the do-plugin have been moved from css/area_nav-usertools.less to css/plugins/do_tasks.less This needs the respective pull request merged from the do-plugin: https://github.com/cosmocode/do/pull/31 SPR-962 --- css/area_nav-usertools.less | 46 +++------------------------- css/plugins/do_tasks.less | 57 +++++++++++++++++++++++++++++++++++ lang/de/lang.php | 1 - lang/en/lang.php | 3 -- tpl/nav-usertools-buttons.php | 23 +++----------- 5 files changed, 67 insertions(+), 63 deletions(-) diff --git a/css/area_nav-usertools.less b/css/area_nav-usertools.less index 42666aa..7eaf629 100755 --- a/css/area_nav-usertools.less +++ b/css/area_nav-usertools.less @@ -46,7 +46,7 @@ margin-bottom: @headericons-margin-xxs; } - > strong, + > span, > a { display: block; width: auto; @@ -68,6 +68,10 @@ @media @screen_max-md { min-height: @toggle-size; } + + @media @screen_only-lg { + min-width: 2rem; + } } &.user { @@ -222,46 +226,6 @@ } } } // user - - &.user-task { - position: relative; - - a { - position: relative; - overflow: visible; - white-space: normal; - text-indent: 0; - - &::before { - content: ''; - position: absolute; - } - } - - .prefix { - .btn-prefix(); - .icon-clipboard(); - - display: block; - font-size: 1.2rem; - text-align: center; - margin-bottom: -1px; - } - } // user-task - - &.noopentasks { - strong { - background-color: @ini_background; - border-color: @noopentasks-border; - color: @ini_text_webframe; - } - - .num { - background-color: @noopentasks-border; // fix - color: @noopentasks-color; // fix - margin-top: 1px; - } - } } // li diff --git a/css/plugins/do_tasks.less b/css/plugins/do_tasks.less index b3aea69..f8236df 100755 --- a/css/plugins/do_tasks.less +++ b/css/plugins/do_tasks.less @@ -24,3 +24,60 @@ ul.page-attributes { } } } + +#dokuwiki__usertools.nav-usertools { + ul { + li { + &.user-task { + position: relative; + + a { + overflow: visible; + white-space: normal; // Is this still needed? + text-indent: 0; + + &::before { + content: ''; // remove when fontello is removed from usertools + } + } + + svg { + width: 20px; + margin-top: 2px; + + @media @screen_max-md { + margin-top: 4px; + } + } + + &:hover { + :not(.noopentasks) { + svg path { + fill: @ini_background; + } + } + } + + .noopentasks { + background-color: @ini_background; + border-color: @noopentasks-border; + color: @ini_text_webframe; + + .num { + background-color: @noopentasks-border; // fix + color: @noopentasks-color; // fix + margin-top: 1px; + } + } + + @media @screen_max-sm { + display: none; + } + } // user-task + } // li + } // ul +} + +.plugin__do_usertasks_list { + z-index: 5; +} diff --git a/lang/de/lang.php b/lang/de/lang.php index 723c3fe..01b70fd 100755 --- a/lang/de/lang.php +++ b/lang/de/lang.php @@ -35,7 +35,6 @@ $lang['tab_tags'] = 'Tags'; $lang['quality_trigger'] = 'Seitenanalyse ein- bzw. ausblenden'; $lang['prefix_tasks'] = 'offene Aufgaben: '; -$lang['prefix_tasks_user'] = 'Ihre offenen Aufgaben: '; $lang['prefix_tasks_page'] = 'offene Aufgaben auf dieser Seite: '; $lang['tasks_page_none'] = 'keine offenen Aufgaben für diese Seite'; diff --git a/lang/en/lang.php b/lang/en/lang.php index 679c2ba..9c7d137 100755 --- a/lang/en/lang.php +++ b/lang/en/lang.php @@ -37,13 +37,10 @@ $lang['tab_issues'] = 'Issues'; $lang['quality_trigger'] = 'toggle page analysis'; $lang['prefix_tasks'] = 'open tasks: '; -$lang['prefix_tasks_user'] = 'your open tasks: '; $lang['prefix_tasks_page'] = 'open tasks for this page: '; $lang['tasks_page_none'] = 'There are no open tasks for this page.'; $lang['tasks_page_intime'] = 'There are %1$d open tasks on this page.'; $lang['tasks_page_late'] = 'There are %1$d open tasks on this page, %2$d are late.'; -$lang['tasks_user_none'] = 'You have no open tasks.'; -$lang['tasks_user_intime'] = 'You have %1$d open tasks.'; $lang['discussion'] = 'Discussion'; $lang['back_to_article'] = 'Back to article'; diff --git a/tpl/nav-usertools-buttons.php b/tpl/nav-usertools-buttons.php index 278d3f4..c321a85 100755 --- a/tpl/nav-usertools-buttons.php +++ b/tpl/nav-usertools-buttons.php @@ -23,25 +23,12 @@ /** @var \helper_plugin_do $doplugin */ $doplugin = plugin_load('helper','do'); if ($doplugin !== null && isset($_SERVER['REMOTE_USER'])) { - $tasks = $doplugin->loadTasks(array('status' => array('undone'),'user' => $_SERVER['REMOTE_USER'])); - $num = count($tasks); - if ($num === 0) { - $title = tpl_getLang('tasks_user_none'); - } else { - $title = sprintf(tpl_getLang('tasks_user_intime'), $num); + $icon = $doplugin->tpl_getUserTasksIconHTML(); + if ($icon) { + echo '
  • ' . $icon . '
    • '; } - - $doInner = "".tpl_getLang('prefix_tasks_user')." ".count($tasks).""; - - $userpage = $doplugin->getConf('userpage'); - if ($userpage && $_SERVER['REMOTE_USER'] && $num > 0) { - $linktarget = sprintf($userpage, $_SERVER['REMOTE_USER']) . ':' . 'dashboard'; - $linktarget = str_replace('::', ':', $linktarget); - echo '
  • '.$doInner.'
    • '; - } else { - echo '
  • '.$doInner.'
    • '; - } - } ?> + } + ?> From 8221fa277b5ca4f2a9077bac1acdfefdd8ece490 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Michael=20Gro=C3=9Fe?= Date: Mon, 24 Apr 2017 19:47:56 +0200 Subject: [PATCH 2/2] Adjust less vars for compatibility In the dokuwiki standard template __background__ is the variable defining the background-color of the content. It is one of the guaranteed placeholder that every template must provide. Hence we should use it with the way it is used in the default template, so other plugins can rely on it and look consistently. Also some other base-dokuwiki styles still use it accordingly, for example the footnotes. SPR-954 --- css/area_footer.less | 2 +- css/area_header.less | 2 +- css/area_main-content.less | 2 +- css/area_main-sidebar-content.less | 6 +++--- css/area_nav-breadcrumb.less | 4 ++-- css/area_nav-metabox.less | 18 +++++++++--------- css/area_nav-pagetools.less | 4 ++-- css/area_nav-usertools.less | 4 ++-- css/area_recent.less | 8 ++++---- css/base.less | 6 +++--- css/base_design.less | 8 ++++---- css/plugins/data.less | 4 ++-- css/plugins/do_tasks.less | 2 +- css/plugins/edittable.less | 4 ++-- css/plugins/magic-matcher.less | 2 +- css/plugins/struct.less | 2 +- css/plugins/tabinclude.less | 4 ++-- css/template_admin.less | 6 +++--- css/template_detail.less | 2 +- lang/de/lang.php | 4 ++-- style.ini | 4 ++-- 21 files changed, 49 insertions(+), 49 deletions(-) diff --git a/css/area_footer.less b/css/area_footer.less index 94a951e..a76bb4b 100755 --- a/css/area_footer.less +++ b/css/area_footer.less @@ -40,7 +40,7 @@ position: relative; z-index: 2; box-sizing: border-box; - background-color: @ini_background; + background-color: @ini_background_site; } p { diff --git a/css/area_header.less b/css/area_header.less index 5fe8549..eedc601 100755 --- a/css/area_header.less +++ b/css/area_header.less @@ -92,7 +92,7 @@ /* + + + wiki title + + + */ p.title { - background-color: @ini_background; + background-color: @ini_background_site; opacity: @header-font-opacity; color: @ini_text_webframe; line-height: @line-height-default; diff --git a/css/area_main-content.less b/css/area_main-content.less index d5db8a5..da0ecd7 100755 --- a/css/area_main-content.less +++ b/css/area_main-content.less @@ -9,7 +9,7 @@ .level2 { p a.media { img { - border: 1px dotted @ini_background; + border: 1px dotted @ini_background_site; } &:hover, diff --git a/css/area_main-sidebar-content.less b/css/area_main-sidebar-content.less index 94cfa27..1797837 100644 --- a/css/area_main-sidebar-content.less +++ b/css/area_main-sidebar-content.less @@ -53,9 +53,9 @@ right: 0; width: 100%; height: 100%; - background: @ini_background; - background: -webkit-linear-gradient(left, @ini_background, @ini_background_content); - background: linear-gradient(left, @ini_background, @ini_background_content); + background: @ini_background_site; + background: -webkit-linear-gradient(left, @ini_background_site, @ini_background); + background: linear-gradient(left, @ini_background_site, @ini_background); z-index: 0; } } diff --git a/css/area_nav-breadcrumb.less b/css/area_nav-breadcrumb.less index bcbce80..1c3818c 100755 --- a/css/area_nav-breadcrumb.less +++ b/css/area_nav-breadcrumb.less @@ -9,7 +9,7 @@ position: relative; min-height: @page-header_height; box-sizing: border-box; - background-color: @ini_background_content; + background-color: @ini_background; border-bottom: 1px solid @ini_border_light; padding: 1rem 1.8rem .2rem; @@ -23,7 +23,7 @@ } @media @screen_xs-lg { - background-color: @ini_background_content; + background-color: @ini_background; } > p { diff --git a/css/area_nav-metabox.less b/css/area_nav-metabox.less index 165d831..211dea3 100755 --- a/css/area_nav-metabox.less +++ b/css/area_nav-metabox.less @@ -102,9 +102,9 @@ transition: @transition background-color, @transition border-color, @transition color; @media @screen_min-md { - background-color: @ini_background; + background-color: @ini_background_site; border: 1px solid @noopentasks-border; - border-bottom-color: @ini_background; + border-bottom-color: @ini_background_site; border-radius: @ini_default_border_radius @ini_default_border_radius 0 0; // @ini_default_border_radius vs. @fix_border-radius color: @ini_nav_menu_color; margin-left: 4px; @@ -137,15 +137,15 @@ text-decoration: none; @media @screen_min-md { - background-color: @ini_background_content; + background-color: @ini_background; border-color: @ini_existing; color: @ini_existing; } @media @screen_max-md { background-color: @ini_existing; - border-color: @ini_background_content; - color: @ini_background_content; + border-color: @ini_background; + color: @ini_background; } } } @@ -155,16 +155,16 @@ > a { cursor: default; - background-color: @ini_background_content; + background-color: @ini_background; border-color: @ini_existing; - border-bottom-color: @ini_background_content; + border-bottom-color: @ini_background; color: @ini_existing; @media @screen_max-md { background-color: @ini_existing; border-bottom-color: @ini_existing; border-radius: 0; - color: @ini_background_content; + color: @ini_background; } } } @@ -187,7 +187,7 @@ right: 0; display: none; width: 100%; - background-color: @ini_background_content; + background-color: @ini_background; border: 1px solid @ini_existing; @media @screen_min-xs { diff --git a/css/area_nav-pagetools.less b/css/area_nav-pagetools.less index 40d2b06..d86af60 100755 --- a/css/area_nav-pagetools.less +++ b/css/area_nav-pagetools.less @@ -116,7 +116,7 @@ nav#dokuwiki__pagetools { &:hover { ul { box-shadow: @box-shadow; // @box-shadow-offset; - background-color: @ini_background_content; + background-color: @ini_background; border-color: @wikiicons-border; li { @@ -142,7 +142,7 @@ nav#dokuwiki__pagetools { svg { background-color: @ini_existing; border-color: @ini_existing; - fill: @ini_background_content; + fill: @ini_background; } } diff --git a/css/area_nav-usertools.less b/css/area_nav-usertools.less index 42666aa..639df19 100755 --- a/css/area_nav-usertools.less +++ b/css/area_nav-usertools.less @@ -78,7 +78,7 @@ position: relative; display: table-cell; - background-color: @ini_background; + background-color: @ini_background_site; border: solid 1px @wikiicons-border; // @ini_border_light; border-radius: @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius color: @ini_text_webframe; @@ -251,7 +251,7 @@ &.noopentasks { strong { - background-color: @ini_background; + background-color: @ini_background_site; border-color: @noopentasks-border; color: @ini_text_webframe; } diff --git a/css/area_recent.less b/css/area_recent.less index a24ca63..0722639 100644 --- a/css/area_recent.less +++ b/css/area_recent.less @@ -71,8 +71,8 @@ .diffnav { a { - background-color: @ini_background; - border: solid 1px @ini_background; + background-color: @ini_background_site; + border: solid 1px @ini_background_site; border-radius: @ini_default_border_radius; color: @ini_nav_menu_color; transition: @transition background-color, @transition color, @transition border-color; @@ -88,7 +88,7 @@ &:active { background-color: @ini_nav_menu_color; border: solid 1px @ini_nav_menu_color; - color: @ini_background; + color: @ini_background_site; &::before { background-color: inherit; @@ -114,7 +114,7 @@ } th { - background-color: @ini_background_content; + background-color: @ini_background; color: @ini_text; padding-top: 10px; padding-bottom: 10px; diff --git a/css/base.less b/css/base.less index d6361c1..e757f62 100755 --- a/css/base.less +++ b/css/base.less @@ -12,7 +12,7 @@ @font_family_screen: arial, sans-serif; @font_family_print: "Times New Roman", serif; -@nav_direct_background: @ini_background_content; +@nav_direct_background: @ini_background; @nav_direct_color: @ini_existing; @ini_sidebar_width: (100 - @ini_site_width) - 4; @@ -72,12 +72,12 @@ /* edit mode */ -@highlight-odd-ini_text: fade(@ini_background_content, 95%); +@highlight-odd-ini_text: fade(@ini_background, 95%); @highlight-even-ini_text: fade(@ini_text, 5%); @color-editBox: #252525; // editmode for tables, revision states -//@nolinkedicon-ini_background: fade(@ini_background, 10%); +//@nolinkedicon-ini_background: fade(@ini_background_site, 10%); //@opacity-ini_nav_menu_color: fade(@ini_nav_menu_color, 40%); diff --git a/css/base_design.less b/css/base_design.less index 314d8d4..28155df 100755 --- a/css/base_design.less +++ b/css/base_design.less @@ -7,7 +7,7 @@ html, body { - background-color: @ini_background; + background-color: @ini_background_site; } @@ -45,7 +45,7 @@ html, body { font-size: @font-size-small; border: solid @ini_background_alt; border-width: 1px 1px 0; - background-color: @ini_background; + background-color: @ini_background_site; color: @ini_text_alt; padding: .1em .35em; border-top-left-radius: 2px; @@ -59,7 +59,7 @@ html, body { clear: both; overflow: hidden; word-wrap: break-word; - background: @ini_background_content; + background: @ini_background; color: inherit; padding: @page_padding-top @margin-default @margin-default; @@ -520,7 +520,7 @@ button img { hr { border-top: solid @ini_border; - border-bottom: solid @ini_background; + border-bottom: solid @ini_background_site; border-width: 1px 0; height: 0; text-align: center; diff --git a/css/plugins/data.less b/css/plugins/data.less index 08b4f11..56b264a 100644 --- a/css/plugins/data.less +++ b/css/plugins/data.less @@ -24,7 +24,7 @@ button { min-height: 1rem; height: 1.8em; - background-color: @ini_background_content; + background-color: @ini_background; border-top: solid 1px @ini_button_background; border-color: @ini_border; border-radius: 0 0 @fix_border-radius @fix_border-radius; @@ -41,7 +41,7 @@ &:active { background-color: @ini_existing; border-color: @ini_existing; - color: @ini_background_content; + color: @ini_background; } } } diff --git a/css/plugins/do_tasks.less b/css/plugins/do_tasks.less index b3aea69..afe8a54 100755 --- a/css/plugins/do_tasks.less +++ b/css/plugins/do_tasks.less @@ -11,7 +11,7 @@ ul.page-attributes { strong { overflow: hidden; - background-color: @ini_background; + background-color: @ini_background_site; border-color: @noopentasks-border; color: @ini_text_webframe; } diff --git a/css/plugins/edittable.less b/css/plugins/edittable.less index 8bcc048..ea979c7 100644 --- a/css/plugins/edittable.less +++ b/css/plugins/edittable.less @@ -16,7 +16,7 @@ button, input.button { min-height: 1rem; - background-color: @ini_background_content; + background-color: @ini_background; border-top: solid 1px @ini_button_background; border-color: @ini_border; border-radius: 0 0 @fix_border-radius @fix_border-radius; @@ -31,7 +31,7 @@ &:active { background-color: @ini_existing; border-color: @ini_existing; - color: @ini_background_content; + color: @ini_background; } } } diff --git a/css/plugins/magic-matcher.less b/css/plugins/magic-matcher.less index c7b22ab..3b1687e 100755 --- a/css/plugins/magic-matcher.less +++ b/css/plugins/magic-matcher.less @@ -49,7 +49,7 @@ min-height: @height-context-bar; box-sizing: border-box; box-shadow: @box-shadow; - background-color: @ini_background_content; + background-color: @ini_background; border-radius: 0 0 @ini_default_border_radius @ini_default_border_radius; font-size: @font-size-default; padding: .8em 1em .5em; diff --git a/css/plugins/struct.less b/css/plugins/struct.less index 61a694e..e6df066 100755 --- a/css/plugins/struct.less +++ b/css/plugins/struct.less @@ -65,7 +65,7 @@ background-color: @ini_existing; background-image: url("svg.php?svg=file-export.svg&f=background_content"); border-color: @ini_existing; - color: @ini_background_content; + color: @ini_background; text-decoration: none; } } diff --git a/css/plugins/tabinclude.less b/css/plugins/tabinclude.less index 8737ed4..c1f3b12 100644 --- a/css/plugins/tabinclude.less +++ b/css/plugins/tabinclude.less @@ -35,7 +35,7 @@ div#dwpl-ti-container { &.selected { position: relative; z-index: 1; - background-color: @ini_background_content; + background-color: @ini_background; color: @ini_text; } } @@ -48,7 +48,7 @@ div#dwpl-ti-container { z-index: 0; overflow: auto; box-shadow: @box-shadow; - background-color: @ini_background_content; + background-color: @ini_background; border: solid 1px @ini_border; border-radius: 0; margin-top: -1px; diff --git a/css/template_admin.less b/css/template_admin.less index 285962a..6f4659d 100644 --- a/css/template_admin.less +++ b/css/template_admin.less @@ -52,7 +52,7 @@ svg { width: 26px; height: 26px; - border: solid 1px @ini_background_content; + border: solid 1px @ini_background; border-radius: @ini_default_border_radius; fill: @ini_existing; transition: @transition background-color, @transition border-color, @transition fill; @@ -71,10 +71,10 @@ svg { background-color: @ini_existing; border-color: @ini_existing; - fill: @ini_background_content; + fill: @ini_background; path { - fill: @ini_background_content; + fill: @ini_background; } } } diff --git a/css/template_detail.less b/css/template_detail.less index ee9af44..d73eb28 100644 --- a/css/template_detail.less +++ b/css/template_detail.less @@ -36,7 +36,7 @@ img { margin: 0; display: block; - border: 1px dotted @ini_background; + border: 1px dotted @ini_background_site; position: relative; z-index: 1; } diff --git a/lang/de/lang.php b/lang/de/lang.php index 723c3fe..b46ffd5 100755 --- a/lang/de/lang.php +++ b/lang/de/lang.php @@ -55,14 +55,14 @@ $lang['image_detail'] = 'Detailinformationen zum Bild'; $lang['__site_width__'] = 'Content - Breite (in %)'; -$lang['__background__'] = 'Website - Hintergrundfarbe'; +$lang['__background_site__'] = 'Website - Hintergrundfarbe'; $lang['__text_webframe__'] = 'Website unverlinkt: Claim, Titel, Footer, Navigation - Schriftfarbe'; $lang['__nav_menu_color__'] = 'verlinkt: Navigation, Footer, Pagetools Icons, Tabbox - Schriftfarbe'; $lang['__nav_menu_hover_color__'] = 'verlinkt: Navigation (hover) - Schriftfarbe, Rahmenfarbe; Wiki Icons - Schriftfarbe; Wiki Icons (hover) - Hintergrundfarbe'; $lang['__nav_menu_hover_bg__'] = 'verlinkt: Navigation (hover) - Hintergrundfarbe; Wiki Icons - Hintergrundfarbe; Wiki Icons (hover) - Schriftfarbe'; -$lang['__background_content__'] = 'Content, Breadcrumb, Pagetools (hover) - Hintergrundfarbe'; +$lang['__background__'] = 'Content, Breadcrumb, Pagetools (hover) - Hintergrundfarbe'; $lang['__text__'] = 'Content: Text - Schriftfarbe'; $lang['__background_neu__'] = 'Content neutral (nicht zu unterschiedlich zum Content-Hintergrund) - Hintergrundfarbe'; diff --git a/style.ini b/style.ini index 24f3e23..f18bae7 100755 --- a/style.ini +++ b/style.ini @@ -135,7 +135,7 @@ __site_width__ = "73%" ; @ini_site_width ; alternative text and background colors -__background__ = "#ECECEC" ; @ini_background (guaranteed for every plugin) +__background_site__ = "#ECECEC" ; @ini_background_site __text_webframe__ = "#696969" ; @ini_text_webframe @@ -145,7 +145,7 @@ __nav_menu_color__ = "#696969" ; @ini_nav_menu_color __nav_menu_hover_color__ = "#286da8" ; @ini_nav_menu_hover_color __nav_menu_hover_bg__ = "#FFF" ; @ini_nav_menu_hover_bg -__background_content__ = "#FFF" ; @ini_background_content +__background __ = "#FFF" ; @ini_background (guaranteed for every plugin) __text__ = "#252525" ; @ini_text (guaranteed for every plugin) __background_neu__ = "#ffffff" ; @ini_background_neu (guaranteed for every plugin)