SPR-837: page tools -> material design icons, default size - php from pullrequest included
|
@ -27,9 +27,8 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
nav#dokuwiki__pagetools {
|
||||
@toolbox-width: 32px;
|
||||
@toolbox-size: 30px;
|
||||
|
||||
top: 3.05rem;
|
||||
z-index: 100;
|
||||
|
@ -42,25 +41,65 @@ nav#dokuwiki__pagetools {
|
|||
right: 8px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
ul {
|
||||
li {
|
||||
a {
|
||||
box-shadow: none;
|
||||
background-image: none;
|
||||
border-color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
li {
|
||||
@page-tools_svg-size: 25px;
|
||||
@page-tools_svg-space: (@toolbox-size - @page-tools_svg-size) / 2;
|
||||
|
||||
* {
|
||||
font-size: @font-size-default;
|
||||
}
|
||||
|
||||
&.plugin_move_page {
|
||||
a {
|
||||
.fontello-double();
|
||||
|
||||
position: relative;
|
||||
height: auto;
|
||||
min-height: @toolbox-size; // for nav:hover
|
||||
width: @toolbox-size; // for nav:hover
|
||||
opacity: .6;
|
||||
color: @color-nav;
|
||||
font-size: @font-size-default;
|
||||
padding: 2px @toolbox-size 2px 2px;
|
||||
|
||||
* {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
&::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
opacity: 1;
|
||||
color: @color-nav-hover;
|
||||
background-color: #FFF;
|
||||
}
|
||||
|
||||
span {
|
||||
.sr-only();
|
||||
|
||||
padding-right: .5rem;
|
||||
padding-left: .3rem;
|
||||
}
|
||||
|
||||
svg {
|
||||
display: inline-block;
|
||||
width: @page-tools_svg-size;
|
||||
height: @page-tools_svg-size;
|
||||
vertical-align: middle;
|
||||
fill: @color-nav;
|
||||
margin: @page-tools_svg-space;
|
||||
}
|
||||
|
||||
&.top {
|
||||
margin-top: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
&.plugin_move_page {background-color: deeppink !important;
|
||||
a {
|
||||
opacity: .6;
|
||||
color: @color-nav;
|
||||
|
@ -78,136 +117,9 @@ nav#dokuwiki__pagetools {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
.fontello-double();
|
||||
|
||||
position: relative;
|
||||
min-height: @toolbox-width; // for nav:hover
|
||||
opacity: .6;
|
||||
color: @color-nav;
|
||||
font-size: @font-size-default;
|
||||
|
||||
* {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
&::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&::after {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: @toolbox-width;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
font-size: @font-size-big;
|
||||
margin: 0;
|
||||
padding-top: .2rem;
|
||||
|
||||
@media @screen_min-md {
|
||||
background-color: @color-site-bg;
|
||||
}
|
||||
|
||||
@media @screen_max-xlg {
|
||||
padding-top: .25rem;
|
||||
}
|
||||
|
||||
@media @screen_max-lg {
|
||||
padding-top: .4rem;
|
||||
}
|
||||
|
||||
@media @screen_max-md {
|
||||
background-color: #FFF;
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
opacity: 1;
|
||||
color: @color-nav-hover;
|
||||
background-color: #FFF;
|
||||
}
|
||||
|
||||
&.source {
|
||||
.icon-code();
|
||||
|
||||
&::after {
|
||||
@media @screen_min-xlg {
|
||||
padding-top: .25rem;
|
||||
}
|
||||
|
||||
@media @screen_max-xlg {
|
||||
padding-top: .35rem;
|
||||
}
|
||||
|
||||
@media @screen_max-md {
|
||||
padding-top: .05rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.edit {
|
||||
.icon-pencil();
|
||||
}
|
||||
|
||||
&.revs {
|
||||
.icon-revisions-history();
|
||||
}
|
||||
|
||||
&.backlink {
|
||||
.icon-link();
|
||||
}
|
||||
|
||||
&.top {
|
||||
.icon-up-bold();
|
||||
margin-top: 1em;
|
||||
|
||||
&::after {
|
||||
@media @screen_min-lg {
|
||||
padding-top: .15rem;
|
||||
}
|
||||
|
||||
@media @screen_max-lg {
|
||||
padding-top: .25rem;
|
||||
}
|
||||
|
||||
@media @screen_max-md {
|
||||
padding-top: .05rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.plugin_bookcreator_addtobook {
|
||||
.icon-book-open();
|
||||
}
|
||||
|
||||
&.export_pdf {
|
||||
.icon-file-pdf();
|
||||
}
|
||||
|
||||
&.show {
|
||||
.icon-file-text();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/*
|
||||
<ul>
|
||||
<li><a href="#" class="action edit" title="Diese Seite bearbeiten [E]">Diese Seite bearbeiten</a></li>
|
||||
<li><a href="#" class="action revs" title="Ältere Versionen [O]">Ältere Versionen</a></li>
|
||||
<li><a href="#" class="action backlink" title="Links hierher">Links hierher</a></li>
|
||||
<li><a href="#" class="action export_pdf" title="PDF exportieren"><span>PDF exportieren</span></a></li>
|
||||
<li><a href="#" class="action source" title="PDF exportieren"><span>source</span></a></li>
|
||||
<li><a href="#" class="action show" title="PDF exportieren"><span>show</span></a></li>
|
||||
<li><a href="#" class="action plugin_bookcreator_addtobook" title="PDF exportieren"><span>was auch immer</span></a></li>
|
||||
<li><a href="#" class="action top" title="Nach oben [T]">Nach oben</a></li>
|
||||
</ul>
|
||||
*/
|
||||
|
||||
&:hover {
|
||||
ul {
|
||||
background-color: #fff;
|
||||
|
@ -215,16 +127,27 @@ nav#dokuwiki__pagetools {
|
|||
|
||||
li {
|
||||
a {
|
||||
box-shadow: none;
|
||||
background-image: none;
|
||||
opacity: .8;
|
||||
|
||||
&::after {
|
||||
background-color: #FFF;
|
||||
}
|
||||
border-color: transparent;
|
||||
padding: 2px 0 2px 2px;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
opacity: 1;
|
||||
|
||||
svg {
|
||||
fill: @color-nav-hover;
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
position: static;
|
||||
width: auto;
|
||||
height: auto;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 20a8 8 0 0 1-8-8 8 8 0 0 1 8-8 8 8 0 0 1 8 8 8 8 0 0 1-8 8m0-18A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2z"/></svg>
|
After Width: | Height: | Size: 240 B |
1
images/tools/01-edit_pencil.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z"/></svg>
|
After Width: | Height: | Size: 240 B |
1
images/tools/02-create_pencil.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="24" width="24"><path d="M13.118 16.118h3v-3h2v3h3v2h-3v3h-2v-3h-3zM20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75z"/></svg>
|
After Width: | Height: | Size: 274 B |
1
images/tools/03-draft_android-studio.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M11 2h2v2h.5A1.5 1.5 0 0 1 15 5.5V9l-.44.44 1.64 2.84C17.31 11.19 18 9.68 18 8h2c0 2.42-1.07 4.59-2.77 6.06l3.14 5.44.13 2.22-1.87-1.22-3.07-5.33c-1.06.53-2.28.83-3.56.83-1.28 0-2.5-.3-3.56-.83L5.37 20.5 3.5 21.72l.13-2.22L9.44 9.44 9 9V5.5A1.5 1.5 0 0 1 10.5 4h.5V2M9.44 13.43c.78.37 1.65.57 2.56.57.91 0 1.78-.2 2.56-.57L13.1 10.9h-.01c-.62.6-1.56.6-2.18 0h-.01l-1.46 2.53M12 6a1 1 0 0 0-1 1 1 1 0 0 0 1 1 1 1 0 0 0 1-1 1 1 0 0 0-1-1z"/></svg>
|
After Width: | Height: | Size: 538 B |
1
images/tools/04-show_file-document.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M13 9h5.5L13 3.5V9M6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4c0-1.11.89-2 2-2m9 16v-2H6v2h9m3-4v-2H6v2h12z"/></svg>
|
After Width: | Height: | Size: 210 B |
1
images/tools/05-source_file-xml.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M13 9h5.5L13 3.5V9M6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4c0-1.11.89-2 2-2m.12 13.5l3.74 3.74 1.42-1.41-2.33-2.33 2.33-2.33-1.42-1.41-3.74 3.74m11.16 0l-3.74-3.74-1.42 1.41 2.33 2.33-2.33 2.33 1.42 1.41 3.74-3.74z"/></svg>
|
After Width: | Height: | Size: 320 B |
1
images/tools/06-revert_replay.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 5V1L7 6l5 5V7a6 6 0 0 1 6 6 6 6 0 0 1-6 6 6 6 0 0 1-6-6H4a8 8 0 0 0 8 8 8 8 0 0 0 8-8 8 8 0 0 0-8-8z"/></svg>
|
After Width: | Height: | Size: 206 B |
1
images/tools/07-revisions_history.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M11 7v5.11l4.71 2.79.79-1.28-4-2.37V7m0-5C8.97 2 5.91 3.92 4.27 6.77L2 4.5V11h6.5L5.75 8.25C6.96 5.73 9.5 4 12.5 4a7.5 7.5 0 0 1 7.5 7.5 7.5 7.5 0 0 1-7.5 7.5c-3.27 0-6.03-2.09-7.06-5h-2.1c1.1 4.03 4.77 7 9.16 7 5.24 0 9.5-4.25 9.5-9.5A9.5 9.5 0 0 0 12.5 2z"/></svg>
|
After Width: | Height: | Size: 359 B |
1
images/tools/08-backlink_link-variant.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10.59 13.41c.41.39.41 1.03 0 1.42-.39.39-1.03.39-1.42 0a5.003 5.003 0 0 1 0-7.07l3.54-3.54a5.003 5.003 0 0 1 7.07 0 5.003 5.003 0 0 1 0 7.07l-1.49 1.49c.01-.82-.12-1.64-.4-2.42l.47-.48a2.982 2.982 0 0 0 0-4.24 2.982 2.982 0 0 0-4.24 0l-3.53 3.53a2.982 2.982 0 0 0 0 4.24m2.82-4.24c.39-.39 1.03-.39 1.42 0a5.003 5.003 0 0 1 0 7.07l-3.54 3.54a5.003 5.003 0 0 1-7.07 0 5.003 5.003 0 0 1 0-7.07l1.49-1.49c-.01.82.12 1.64.4 2.43l-.47.47a2.982 2.982 0 0 0 0 4.24 2.982 2.982 0 0 0 4.24 0l3.53-3.53a2.982 2.982 0 0 0 0-4.24.973.973 0 0 1 0-1.42z"/></svg>
|
After Width: | Height: | Size: 641 B |
1
images/tools/09-subscribe_email-outline.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2m0 14H4V8l8 5 8-5v10m0-12l-8 5-8-5h16z"/></svg>
|
After Width: | Height: | Size: 211 B |
1
images/tools/10-top_arrow-up.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8v12z"/></svg>
|
After Width: | Height: | Size: 169 B |
1
images/tools/11-mediamanager_folder-image.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M5 17l4.5-6 3.5 4.5 2.5-3L19 17m1-11h-8l-2-2H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2z"/></svg>
|
After Width: | Height: | Size: 213 B |
1
images/tools/12-back_arrow-left.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11h12z"/></svg>
|
After Width: | Height: | Size: 166 B |
100
tpl.php
Normal file
|
@ -0,0 +1,100 @@
|
|||
<?php
|
||||
|
||||
namespace dokuwiki\template\sprintdoc;
|
||||
|
||||
/**
|
||||
* Class tpl
|
||||
*
|
||||
* Provides additional template functions for the dokuwiki template
|
||||
* @package dokuwiki\tpl\dokuwiki
|
||||
*/
|
||||
|
||||
class tpl {
|
||||
static $icons = array(
|
||||
'default' => '00-default_checkbox-blank-circle-outline.svg',
|
||||
'edit' => '01-edit_pencil.svg',
|
||||
'create' => '02-create_pencil.svg',
|
||||
'draft' => '03-draft_android-studio.svg',
|
||||
'show' => '04-show_file-document.svg',
|
||||
'source' => '05-source_file-xml.svg',
|
||||
'revert' => '06-revert_replay.svg',
|
||||
'revs' => '07-revisions_history.svg',
|
||||
'backlink' => '08-backlink_link-variant.svg',
|
||||
'subscribe' => '09-subscribe_email-outline.svg',
|
||||
'top' => '10-top_arrow-up.svg',
|
||||
'mediaManager' => '11-mediamanager_folder-image.svg',
|
||||
'img_backto' => '12-back_arrow-left.svg',
|
||||
);
|
||||
|
||||
/**
|
||||
* Return the HTML for one of the default actions
|
||||
*
|
||||
* Reimplements parts of tpl_actionlink
|
||||
*
|
||||
* @param string $action
|
||||
* @return string
|
||||
*/
|
||||
static public function pageToolAction($action) {
|
||||
$data = tpl_get_action($action);
|
||||
if(!is_array($data)) return '';
|
||||
global $lang;
|
||||
|
||||
if($data['id'][0] == '#') {
|
||||
$linktarget = $data['id'];
|
||||
} else {
|
||||
$linktarget = wl($data['id'], $data['params']);
|
||||
}
|
||||
$caption = $lang['btn_' . $data['type']];
|
||||
if(strpos($caption, '%s')) {
|
||||
$caption = sprintf($caption, $data['replacement']);
|
||||
}
|
||||
|
||||
$svg = __DIR__ . '/images/tools/' . self::$icons[$data['type']];
|
||||
|
||||
return self::pageToolItem(
|
||||
$linktarget,
|
||||
$caption,
|
||||
$svg,
|
||||
array('accesskey' => $data['accesskey'])
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Return the HTML for a page action
|
||||
*
|
||||
* Plugins may use this in TEMPLATE_PAGETOOLS_DISPLAY
|
||||
*
|
||||
* @param string $link The link
|
||||
* @param string $caption The label of the action
|
||||
* @param string $svg The icon to show
|
||||
* @param string[] $args HTML attributes for the item
|
||||
* @return string
|
||||
*/
|
||||
static public function pageToolItem($link, $caption, $svg, $args = array()) {
|
||||
if(blank($args['title'])) {
|
||||
$args['title'] = $caption;
|
||||
}
|
||||
|
||||
if(!blank($args['accesskey'])) {
|
||||
$args['title'] .= ' [' . strtoupper($args['accesskey']) . ']';
|
||||
}
|
||||
|
||||
if(blank($args['rel'])) {
|
||||
$args['rel'] = 'nofollow';
|
||||
}
|
||||
|
||||
$args['href'] = $link;
|
||||
|
||||
$svg = inlineSVG($svg);
|
||||
if(!$svg) $svg = inlineSVG(__DIR__ . '/images/tools/' . self::$icons['default']);
|
||||
|
||||
$attributes = buildAttributes($args, true);
|
||||
|
||||
$out = "<a $attributes>";
|
||||
$out .= '<span>' . hsc($caption) . '</span>';
|
||||
$out .= $svg;
|
||||
$out .= '</a>';
|
||||
|
||||
return $out;
|
||||
}
|
||||
}
|
|
@ -7,16 +7,32 @@
|
|||
<div class="tools">
|
||||
|
||||
<?php include('nav-status.php');?>
|
||||
<ul>
|
||||
<?php tpl_toolsevent('pagetools', array(
|
||||
'edit' => tpl_action('edit', 1, 'li', 1),
|
||||
'revisions' => tpl_action('revisions', 1, 'li', 1),
|
||||
'backlink' => tpl_action('backlink', 1, 'li', 1),
|
||||
'subscribe' => tpl_action('subscribe', 1, 'li', 1),
|
||||
'revert' => tpl_action('revert', 1, 'li', 1),
|
||||
'top' => tpl_action('top', 1, 'li', 1),
|
||||
)); ?>
|
||||
</ul>
|
||||
<ul>
|
||||
<?php
|
||||
$data = array(
|
||||
'view' => 'main-svg',
|
||||
'items' => array(
|
||||
'edit' => dokuwiki\template\sprintdoc\tpl::pageToolAction('edit'),
|
||||
'revert' => dokuwiki\template\sprintdoc\tpl::pageToolAction('revert'),
|
||||
'revisions' => dokuwiki\template\sprintdoc\tpl::pageToolAction('revisions'),
|
||||
'backlink' => dokuwiki\template\sprintdoc\tpl::pageToolAction('backlink'),
|
||||
'subscribe' => dokuwiki\template\sprintdoc\tpl::pageToolAction('subscribe'),
|
||||
'top' => dokuwiki\template\sprintdoc\tpl::pageToolAction('top'),
|
||||
)
|
||||
);
|
||||
|
||||
// the page tools can be amended through a custom plugin hook
|
||||
$evt = new Doku_Event('TEMPLATE_PAGETOOLS_DISPLAY', $data);
|
||||
if($evt->advise_before()){
|
||||
foreach($evt->data['items'] as $k => $html) {
|
||||
if($html)
|
||||
echo "<li>$html</li>";
|
||||
}
|
||||
}
|
||||
$evt->advise_after();
|
||||
unset($data);
|
||||
?>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<?php endif; ?>
|
||||
|
|