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
|
* Page Attribute Icons in the breadcrumb bar
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* + + + + + icons in breadcrumb area + + + + + */
|
|
||||||
.page-attributes {
|
.page-attributes {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
float: right;
|
float: right;
|
||||||
display: inline-block;
|
margin: -.45em 0 0; // FIXME sourrounding CSS should be fixed so negative margin is not needed
|
||||||
max-width: 30%;
|
|
||||||
margin: -.45em 0 0;
|
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
display: flex;
|
||||||
@media @screen_max-xs {
|
gap: 0.5rem;
|
||||||
max-width: 90%;
|
|
||||||
}
|
|
||||||
|
|
||||||
> li {
|
> li {
|
||||||
.btn-usertools-wrapper(); // uniform li
|
margin: 0;
|
||||||
.btn-usertools-num();
|
padding: 0;
|
||||||
|
border: 1px solid @wikiicons-border;
|
||||||
|
border-radius: @ini_default_border_radius;
|
||||||
position: relative;
|
position: relative;
|
||||||
float: left;
|
display: flex;
|
||||||
display: block;
|
align-items: center;
|
||||||
width: auto;
|
justify-content: center;
|
||||||
min-height: @toggle-size;
|
transition: @transition background-color, @transition border-color, @transition color;
|
||||||
text-align: center;
|
|
||||||
margin: 0 .25rem;
|
|
||||||
|
|
||||||
strong {
|
// override any plugin element styles
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
line-height: normal;
|
||||||
display: block;
|
display: block;
|
||||||
min-height: 1.64rem;
|
|
||||||
border: 1px solid @wikiicons-border;
|
|
||||||
border-radius: @ini_default_border_radius;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
// number badge
|
||||||
display: block;
|
.btn-usertools-num();
|
||||||
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;
|
|
||||||
|
|
||||||
&:hover,
|
// icon
|
||||||
&:focus,
|
svg {
|
||||||
&:active {
|
height: 1.5em;
|
||||||
background-color: @ini_nav_menu_hover_color;
|
width: 1.5em;
|
||||||
border-color: @ini_nav_menu_hover_color;
|
|
||||||
color: @ini_nav_menu_hover_bg;
|
|
||||||
|
|
||||||
span {
|
path {
|
||||||
fill: @ini_nav_menu_hover_bg;
|
fill: @ini_nav_menu_color;
|
||||||
color: @ini_nav_menu_hover_bg;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.prefix {
|
// adjust colors on hover
|
||||||
.btn-prefix(.26rem);
|
&:hover {
|
||||||
.icon-clipboard();
|
background-color: @ini_nav_menu_hover_color;
|
||||||
|
border-color: @ini_nav_menu_hover_color;
|
||||||
|
|
||||||
display: block;
|
svg path {
|
||||||
font-size: 1.2rem;
|
fill: @ini_nav_menu_hover_bg;
|
||||||
line-height: 1;
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.num {
|
|
||||||
top: -.6em;
|
|
||||||
font-size: @font-size-very-small;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:empty {
|
|
||||||
display: none;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -2,27 +2,6 @@
|
||||||
* This file provides styles for do-task plugin
|
* 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 + + + + + */
|
/* + + + + + usertool icon in header + + + + + */
|
||||||
#dokuwiki__usertools.nav-usertools {
|
#dokuwiki__usertools.nav-usertools {
|
||||||
|
|
|
@ -2,30 +2,6 @@
|
||||||
* Styles for the QC plugin
|
* 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 + + + + + */
|
/* + + + + + slideout output + + + + + */
|
||||||
.qc-output {
|
.qc-output {
|
||||||
position: relative;
|
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
|
* 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 {
|
nav.nav-starred {
|
||||||
ul {
|
ul {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
|
|
||||||
&#sidebar-menu-starred {
|
|
||||||
margin-left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
li {
|
li {
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
|
|
||||||
|
|
|
@ -113,7 +113,6 @@ css/plugins/extension__manager.less = all
|
||||||
css/plugins/folded.less = all
|
css/plugins/folded.less = all
|
||||||
css/plugins/configmanager.less = all
|
css/plugins/configmanager.less = all
|
||||||
css/plugins/starred.less = all
|
css/plugins/starred.less = all
|
||||||
css/plugins/quicksubscribe.less = all
|
|
||||||
css/plugins/sitemapnavi.less = all
|
css/plugins/sitemapnavi.less = all
|
||||||
css/plugins/data.less = all
|
css/plugins/data.less = all
|
||||||
css/plugins/fastwiki.less = all
|
css/plugins/fastwiki.less = all
|
||||||
|
|
|
@ -39,9 +39,13 @@ if($doPlugin !== null) {
|
||||||
$class = 'do_late';
|
$class = 'do_late';
|
||||||
$title = sprintf(tpl_getLang('tasks_page_late'), $count['undone'], $count['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) {
|
if($starredPlugin !== null) {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue