streamline page attributes
Page attribute icons should now align better and all look the same.
This commit is contained in:
parent
1e03e2a55f
commit
b8adbb9e24
7 changed files with 37 additions and 160 deletions
|
@ -1,78 +1,54 @@
|
|||
/**
|
||||
* Page Attribute Icons in the breadcrumb bar
|
||||
*/
|
||||
|
||||
/* + + + + + icons in breadcrumb area + + + + + */
|
||||
.page-attributes {
|
||||
list-style: none;
|
||||
float: right;
|
||||
display: inline-block;
|
||||
max-width: 30%;
|
||||
margin: -.45em 0 0;
|
||||
margin: -.45em 0 0; // FIXME sourrounding CSS should be fixed so negative margin is not needed
|
||||
padding: 0;
|
||||
|
||||
@media @screen_max-xs {
|
||||
max-width: 90%;
|
||||
}
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
|
||||
> li {
|
||||
.btn-usertools-wrapper(); // uniform li
|
||||
.btn-usertools-num();
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 1px solid @wikiicons-border;
|
||||
border-radius: @ini_default_border_radius;
|
||||
position: relative;
|
||||
float: left;
|
||||
display: block;
|
||||
width: auto;
|
||||
min-height: @toggle-size;
|
||||
text-align: center;
|
||||
margin: 0 .25rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: @transition background-color, @transition border-color, @transition color;
|
||||
|
||||
strong {
|
||||
// override any plugin element styles
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
line-height: normal;
|
||||
display: block;
|
||||
min-height: 1.64rem;
|
||||
border: 1px solid @wikiicons-border;
|
||||
border-radius: @ini_default_border_radius;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
width: auto;
|
||||
min-height: 1.64rem;
|
||||
background-color: @ini_nav_menu_hover_bg;
|
||||
border: 1px solid @wikiicons-border;
|
||||
border-radius: @ini_default_border_radius;
|
||||
transition: @transition background-color, @transition border-color, @transition color;
|
||||
// number badge
|
||||
.btn-usertools-num();
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background-color: @ini_nav_menu_hover_color;
|
||||
border-color: @ini_nav_menu_hover_color;
|
||||
color: @ini_nav_menu_hover_bg;
|
||||
// icon
|
||||
svg {
|
||||
height: 1.5em;
|
||||
width: 1.5em;
|
||||
|
||||
span {
|
||||
fill: @ini_nav_menu_hover_bg;
|
||||
color: @ini_nav_menu_hover_bg;
|
||||
}
|
||||
path {
|
||||
fill: @ini_nav_menu_color;
|
||||
}
|
||||
}
|
||||
|
||||
.prefix {
|
||||
.btn-prefix(.26rem);
|
||||
.icon-clipboard();
|
||||
// adjust colors on hover
|
||||
&:hover {
|
||||
background-color: @ini_nav_menu_hover_color;
|
||||
border-color: @ini_nav_menu_hover_color;
|
||||
|
||||
display: block;
|
||||
font-size: 1.2rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.num {
|
||||
top: -.6em;
|
||||
font-size: @font-size-very-small;
|
||||
}
|
||||
|
||||
&:empty {
|
||||
display: none;
|
||||
svg path {
|
||||
fill: @ini_nav_menu_hover_bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,27 +2,6 @@
|
|||
* This file provides styles for do-task plugin
|
||||
*/
|
||||
|
||||
/* + + + + + global + + + + + */
|
||||
ul.page-attributes {
|
||||
.plugin_do_pagetasks {
|
||||
position: relative;
|
||||
border-radius: @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius
|
||||
|
||||
strong {
|
||||
overflow: hidden;
|
||||
background-color: @ini_background_site;
|
||||
border-color: @noopentasks-border;
|
||||
color: @ini_text_webframe;
|
||||
}
|
||||
|
||||
&.do_none {
|
||||
.num {
|
||||
background-color: @noopentasks-border; // fix
|
||||
color: @noopentasks-color; // fix
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* + + + + + usertool icon in header + + + + + */
|
||||
#dokuwiki__usertools.nav-usertools {
|
||||
|
|
|
@ -2,30 +2,6 @@
|
|||
* Styles for the QC plugin
|
||||
*/
|
||||
|
||||
/* + + + + + icon in breadcrumb + + + + + */
|
||||
.page-attributes .plugin_qc {
|
||||
.qc_icon {
|
||||
margin: 0;
|
||||
|
||||
svg {
|
||||
margin-top: .1em;
|
||||
width: 1.6em;
|
||||
height: 1.6em;
|
||||
font-size: (@font-size-small - .06);
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
svg path {
|
||||
fill: @ini_nav_menu_hover_bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* + + + + + slideout output + + + + + */
|
||||
.qc-output {
|
||||
position: relative;
|
||||
|
|
|
@ -1,24 +0,0 @@
|
|||
/**
|
||||
* This file provides styles for the quicksubscribe plugin
|
||||
*/
|
||||
|
||||
.page-attributes {
|
||||
li.plugin_quicksubscribe {
|
||||
a.plugin_qsub_subscribe {
|
||||
svg {
|
||||
width: 1.6em;
|
||||
height: 1.6em;
|
||||
font-size: 0.82rem;
|
||||
fill: @ini_nav_menu_hover_color;
|
||||
}
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus,
|
||||
a:active {
|
||||
svg {
|
||||
fill: @ini_nav_menu_hover_bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,43 +1,10 @@
|
|||
/**
|
||||
* This file provides styles for starred plugin
|
||||
*/
|
||||
|
||||
.page-attributes {
|
||||
li.plugin_starred {
|
||||
.starred {
|
||||
display: block;
|
||||
padding-top: .05rem;
|
||||
|
||||
svg {
|
||||
width: 1.6em;
|
||||
height: 1.6em;
|
||||
font-size: 0.82rem;
|
||||
fill: @ini_nav_menu_hover_color;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
max-height: @toggle-size;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus,
|
||||
a:active {
|
||||
.starred svg {
|
||||
fill: @ini_nav_menu_hover_bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
nav.nav-starred {
|
||||
ul {
|
||||
list-style: none;
|
||||
|
||||
&#sidebar-menu-starred {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-left: 0;
|
||||
|
||||
|
|
|
@ -113,7 +113,6 @@ css/plugins/extension__manager.less = all
|
|||
css/plugins/folded.less = all
|
||||
css/plugins/configmanager.less = all
|
||||
css/plugins/starred.less = all
|
||||
css/plugins/quicksubscribe.less = all
|
||||
css/plugins/sitemapnavi.less = all
|
||||
css/plugins/data.less = all
|
||||
css/plugins/fastwiki.less = all
|
||||
|
|
|
@ -39,9 +39,13 @@ if($doPlugin !== null) {
|
|||
$class = 'do_late';
|
||||
$title = sprintf(tpl_getLang('tasks_page_late'), $count['undone'], $count['late']);
|
||||
}
|
||||
$markup = "<li class=\"plugin_do_pagetasks $class\" title=\"$title\"><strong><span class=\"num\">{$count['undone']}</span><span class=\"prefix\">" . tpl_getLang('prefix_tasks_page') . " </span></strong></li>";
|
||||
|
||||
echo $markup;
|
||||
echo '<li class="plugin_do_pagetasks">';
|
||||
echo '<span title="'.$title.'" class="'.$class.'">';
|
||||
echo inlineSVG(DOKU_PLUGIN . 'do/pix/clipboard-text.svg');
|
||||
echo '</span>';
|
||||
echo '<span class="num">' . $count['undone'] . '</span>';
|
||||
echo '</li>';
|
||||
}
|
||||
|
||||
if($starredPlugin !== null) {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue