EH22/dokuwiki-template-sprintdoc-modified
0
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

SPR-937: Alignment bei schmaler Sidebar

Browse source
This commit is contained in:
Silke Pisulla 2017-04-28 11:10:27 +02:00
commit 77ac3c62bc
3 changed files with 39 additions and 122 deletions
Download patch file Download diff file Expand all files Collapse all files

63
css/area_main-sidebar-content.less
View file

@ -1,63 +0,0 @@
/**
* This file provides the design styles the non-navigational elements in the sidebar
*/
#dokuwiki__aside {
ul,
ol {
margin-left: -.4rem;
padding-left: 0;
ul,
ol {
padding-left: 1.8rem;
@media @screen_md-lg {
padding-left: @menu-margin-lg;
}
li {
margin-left: 0;
}
}
}
}
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* max-width: 1023px */
@media @screen_max-md {
#dokuwiki__aside {
display: none;
}
body.show-mobile-sidebar {
#dokuwiki__aside {
display: block !important;
position: absolute;
left: 1.25rem; //left margin of content container
z-index: 200; // above all
box-shadow: @box-shadow-right-bottom;
min-width: 45%;
max-width: 90%;
height: auto;
&:after {
content: "";
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
width: 100%;
height: 100%;
background: @ini_background_site;
background: -webkit-linear-gradient(left, @ini_background_site, @ini_background);
background: linear-gradient(left, @ini_background_site, @ini_background);
z-index: 0;
}
}
}
}

97
css/area_main-sidebar-nav.less
View file

@ -10,6 +10,29 @@
@icon-size: @font-size-big;
@menu-margin: @icon-size + @margin-small * 2;
@media @screen_md-lg {
margin-left: -1.25rem;
}
@media @screen_max-md {
display: none;
}
> ul,
> ol,
> nav {
padding-left: 0;
ul,
ol {
padding-left: 0;
li {
margin-left: 0;
}
}
}
nav > p {
color: @ini_nav_menu_color;
@ -42,14 +65,6 @@
}
}
> * {
margin-left: @menu-margin; // moves *all* sidebar content to the right
@media @screen_md-lg {
margin-left: @menu-margin-lg;
}
}
a {
&:link,
&:visited {
@ -81,13 +96,9 @@
color: @ini_nav_menu_color;
font-size: @font-size-head6;
font-weight: normal;
margin: -1px 0 (@font-size-head6 / 2) -(@menu-margin - .4); // moves the toggles back to the left (.4 from li margin)
margin: -1px 0 (@font-size-head6 / 2); // moves the toggles back to the left (.4 from li margin)
transition: @transition color, @transition background-color, @transition border-color;
@media @screen_md-lg {
margin-left: -(@menu-margin-lg + .8);
}
span {
display: inline-block;
vertical-align: middle;
@ -146,16 +157,14 @@
&:hover,
&:focus,
&:active {
position: relative; // always show label, even with collapsed sidebar
z-index: 100;
width: 100%;
background-color: @ini_nav_menu_hover_bg;
border-color: @ini_nav_menu_hover_color;
color: @ini_nav_menu_hover_color;
text-decoration: none;
// always show label, even with collapsed sidebar
position: absolute;
z-index: 100;
width: 100%;
span.ico {
border-color: inherit;
@ -172,16 +181,6 @@
}
}
// without wrapping UL
nav > a.nav,
nav div.nav a{
margin-left: -3.5rem;
@media @screen_md-lg {
margin-left: -2.5rem;
}
}
/* + + + + + active + + + + + */
span.curid a {
@ -193,6 +192,7 @@
div.nav-panel {
display: none;
margin-top: .5rem;
margin-left: @menu-margin;
ul {
margin-bottom: 1rem;
@ -205,34 +205,6 @@
}
/* + + + + + + wide page content border-bottom between a.nav (short width) + + + + +
.wide-content {
#dokuwiki__aside {
a.nav {
position: relative;
&::after {
content: '';
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
height: 1px;
border-bottom: solid 1px @ini_border;
}
&:hover,
&:focus,
&:active {
&::after {
display: none;
}
}
}
}
} */
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* min-width: 1440px */
@ -283,6 +255,16 @@
@media @screen_max-md {
body.show-mobile-sidebar {
#dokuwiki__aside {
display: block !important;
position: absolute;
left: 1.25rem; // left margin of content container
z-index: 200; // above all
box-shadow: @box-shadow-right-bottom;
min-width: 45%;
max-width: 90%;
height: auto;
background: @ini_background_site;
> nav {
position: relative;
z-index: 2;
@ -298,7 +280,7 @@
border-left-width: 0;
}
.nav-panel,
div.nav-panel,
a.nav {
padding-right: .8em;
}
@ -324,4 +306,3 @@
}
}
}