dokuwiki-template-sprintdoc.../css/area_nav-breadcrumb.less

223 lines
5.4 KiB
Text
Executable file

/**
* This file provides the design styles for the direct / menu jump links.
*
* @author Jana Deutschlaender <deutschlaender@cosmocode.de>
*/
.breadcrumbs {
position: relative;
border-bottom: 1px solid @color-border-light;
padding: 1rem 1.8rem .2rem;
min-height: @page-header_height;
box-sizing: border-box;
> p {
font-size: @font-size-small;
margin: 0;
@media @screen_max-xs{
width: 1px;
position: relative;
overflow: hidden;
height: 1.6rem;
}
* {
font-size: @font-size-small;
}
.bchead {
.sr-only();
}
span.home {
margin-left: -.2rem; // reverse spacing in home icon --> content text and home icon aligned
.wide-content & {
margin-left: .4rem; //toggle link has position absolute, hover on home icon needs more space than left padding of breadcrumb
}
a {
.fontello();
.hide-text-show-before();
.icon-home();
min-height: 1.8em;
min-width: 1.9em;
width: auto;
box-sizing: border-box;
border: solid 1px transparent;
border-radius: @border-radius;
vertical-align: middle;
text-decoration: none;
margin-top: -.2em;
transition: @transition border-color;
&:before {
font-size: @font-size-default + (@font-scale-factor * 2);
margin-top: .17rem;
}
&:hover,
&:focus,
&:active {
border-color: @color-link;
}
}
}
bdi {
padding: .1em .1em 0;
}
}
/* + + + + + icon list + + + + + */
.page-attributes {
list-style: none;
float: right;
display: inline-block;
max-width: 30%;
margin: -.45em 0 0;
padding: 0;
@media @screen_max-xs{
max-width: 90%;
}
> li {
.btn-usertools-wrapper(); // uniform li
.btn-usertools-num();
float: left;
> strong,
> a {
display: block;
width: auto;
min-height: @toggle-size;
border: 1px solid @color-border;
border-radius: @border-radius;
color: @color-nav;
text-align: center;
margin: 0;
}
.prefix {
.btn-prefix ();
.icon-clipboard();
display: block;
font-size: 1.2rem;
line-height: 1;
}
/* check !!! */
&.do_none {
position: relative;
strong {
background-color: @color-site-bg;
}
.num {
background-color: @color-border;
color: @color-nav;
}
}
/* end check !!! */
&.plugin__qc {
display: inline-block;
overflow: visible;
position: static;
}
} // li
a {
transition: @transition color, @transition background-color, @transition border-color;
&[aria-expanded="false"] + #plugin__qc__wrapper {
display: none;
}
&:hover,
&:active,
&:focus {
background-color: @button_color;
border-color: @button_background;
color: @button_background;
.prefix {
color: @button_background;
}
}
}
#plugin__qc__wrapper {
position: absolute;
right: 0;
width: auto;
border: 0 none;
background: @background_page-header;
background: -webkit-linear-gradient(top, @background_page-header, @color-content-bg);
background: linear-gradient(top, @background_page-header, @color-content-bg);
box-shadow: @box-shadow-bottom;
z-index: 2000;
#plugin__qc__out{
h1 {
font-size: @font-size-head3;
}
h2 {
margin-top: 1.6em;
font-size: @font-size-head5;
}
> h1,
> h2,
> p,
> dl,
> div {
padding-left: 1rem;
margin-left: 0;
}
> div p {
padding-left: 0;
margin-left: 0;
}
}
&[aria-hidden="false"] {
margin-top: .5rem;
}
}
#plugin__qc__icon {
display: none;
}
#plugin__qc__link {
position: relative;
.prefix {
.icon-emo-happy();
width: 100%;
font-size: @font-size-default;
&::before {
width: 100%;
margin: 0;
}
}
}
}
}
/* + + + + + ? + + + + + */
.mode_admin {
}