dokuwiki-template-sprintdoc.../css/area_nav-pagetools.less
Jana Deutschländer 5e01750458 improve less formating - part 2 (template area and base modules)
- remove @author from comments
- adjust the spacing
2019-04-10 17:04:57 +02:00

193 lines
5.1 KiB
Text
Executable file

/**
* This file provides the design styles for the page specific tool bar.
*/
/*
FIXME
.pagetools-item(edit, 1);
.pagetools-item(create, 2);
.pagetools-item(show, 4);
.pagetools-item(source, 5);
.pagetools-item(draft, 3);
.pagetools-item(revs, 7, revisions);
.pagetools-item(backlink, 8, backlink);
.pagetools-item(top, 10);
.pagetools-item(revert, 6, revert);
.pagetools-item(subscribe, 9, subscribe);
.pagetools-item(mediaManager, 11);
.pagetools-item(back, 12);
.pagetools-item(img_backto, 12);
*/
#dokuwiki__aside {
@media @screen_max-md {
display: none !important;
}
}
nav#dokuwiki__pagetools {
@toolbox-size: 30px;
@page-tools_svg-size: 25px;
@page-tools_svg-space: (@toolbox-size - @page-tools_svg-size) / 2;
@item-width: (@page-tools_svg-size + @page-tools_svg-space + @page-tools_svg-space);
@item-height: (@page-tools_svg-size + @page-tools_svg-space);
top: 3.05rem;
position: absolute;
width: @item-width;
@media @screen_min-md {
right: -2.5rem;
}
@media @screen_max-md {
right: 8px;
}
@media @screen_max-xxs {
display: none;
}
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;
li {
padding: 0;
margin: 0;
list-style: none;
a {
display: inline-table;
/* add transparent border to prevent jumping when proper border is added on focus */
border: 1px solid transparent;
white-space: nowrap;
vertical-align: middle;
height: @item-height;
position: relative;
line-height: 20px;
font-size: @font-size-default;
padding: 2px 0 2px 2px;
@media @screen_min-md {
color: @ini_nav_menu_color;
}
@media @screen_max-md {
color: @ini_existing;
}
&::before {
display: none;
}
&:hover,
&:focus,
&:active {
background-color: transparent;
}
&:focus {
box-shadow: @box-shadow;
background-image: none;
background-color: @ini_background;
color: @ini_existing;
span {
position: relative;
display: inline;
width: auto;
height: auto;
}
svg {
fill: @ini_existing;
}
}
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;
border: solid 1px transparent;
margin: @page-tools_svg-space;
@media @screen_min-md {
fill: @ini_nav_menu_color;
}
@media @screen_max-md {
fill: @ini_existing;
}
}
&.top {
margin-top: 1em;
}
}
}
}
&:hover {
ul {
box-shadow: @box-shadow; // @box-shadow-offset;
background-color: @ini_background;
border-color: @wikiicons-border;
li {
color: @ini_existing;
a {
box-shadow: none;
background-image: none;
border-color: transparent;
color: inherit;
svg {
border: solid 1px transparent;
border-radius: @ini_default_border_radius;
fill: @ini_existing;
transition: @transition background-color, @transition border-color, @transition fill;
}
&:hover,
&:focus,
&:active {
svg {
background-color: @ini_existing;
border-color: @ini_existing;
fill: @ini_background;
}
}
span {
position: static;
width: auto;
height: auto;
margin: auto;
}
}
}
}
}
}