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

SPR-768: Anpassungen - SprintMeeting 10.1.2017 - tabbox

Browse source
This commit is contained in:
Silke Pisulla 2017-01-11 15:18:39 +01:00
commit 527e72e79a
1 changed files with 87 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

110
css/area_nav-metabox.less
View file

@ -2,6 +2,7 @@
.tab-container { .tab-container {
display: table; display: table;
} }
.box-content { .box-content {
position: relative; position: relative;
height: 0; height: 0;
@ -9,38 +10,49 @@
} }
ul.meta-tabs { ul.meta-tabs {
border-bottom: 1px solid @color-border; //border-bottom: 1px solid @color-border;
background-color: @background_page-header; //background-color: @background_page-header;
margin: 0; margin: 0;
padding: 0; padding: 0;
list-style: none; list-style: none;
&::before, &::after {
&::before,
&::after {
display: table; display: table;
content: " "; content: " ";
box-sizing: border-box; box-sizing: border-box;
clear: both; clear: both;
} }
> li:first-child { > li:first-child {
> a { > a {
margin-left: 0; margin-left: 0;
} }
} }
> li:last-child {
> a {
margin-right: -1px;
}
}
> li { > li {
margin: 0 -1px -1px; margin: 0 0 -1px;
position: relative; position: relative;
display: inline-block; display: inline-block;
> a { > a {
font-size: .78rem; cursor: pointer;
margin-left: 4px;
line-height: 1.42857143;
position: relative; position: relative;
display: block; display: block;
padding: .56em 2em;
border: 1px solid @color-border;
background-color: @color-site-bg; background-color: @color-site-bg;
border-radius: 4px 4px 0 0; border: 1px solid @color-border;
border-radius: @fix_border-radius @fix_border-radius 0 0;
color: @color-nav; color: @color-nav;
cursor: pointer; font-size: .78rem;
line-height: 1.42857143;
padding: .3em 1rem .1em;
margin-left: 4px;
transition: @transition color, @transition background-color, @transition border-color; transition: @transition color, @transition background-color, @transition border-color;
* { * {
@ -53,12 +65,13 @@
position: relative; position: relative;
transition: @transition color; transition: @transition color;
} }
.num { .num {
position: absolute; position: absolute;
right: -.8rem; right: -.8rem;
top: -.4rem; top: -.2rem;
background-color: @color-border; background-color: @color-border;
border-radius: 2px; border-radius: @fix_border-radius;
color: @color-nav; color: @color-nav;
font-size: .56rem; font-size: .56rem;
font-weight: 400; font-weight: 400;
@ -66,56 +79,80 @@
line-height: 1; line-height: 1;
padding: .2em .2rem .1em; padding: .2em .2rem .1em;
transition: @transition color, @transition background-color; transition: @transition color, @transition background-color;
} }
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
background-color: @background_page-header; background-color: @color-content-bg;
border-color: @color-border; border-color: @color-link;
border-bottom-color: transparent; color: @color-link;
color: @button_background; text-decoration: none;
.prefix { .prefix {
color: @button_background; color: inherit;
} }
.num { .num {
background-color: @button_background; color: inherit;
color: @button_color;
} }
} }
} }
&.active > a {
&.active {
z-index: 1;
> a {
cursor: default; cursor: default;
tab-index: -1; tab-index: -1;
color: #555; background-color: @color-content-bg;
background-color: @background_page-header; border-color: @color-link;
border-color: transparent; border-bottom-color: @color-content-bg;
color: @color-link;
} }
} }
} }
}
.meta-content { .meta-content {
.tab-pane { .tab-pane {
border: 1px solid @color-border;
border-top-color: transparent;
background-color: @background_page-header;
display: none;
position: absolute; position: absolute;
top: 0;
display: none;
width: 100%; width: 100%;
background-color: @color-content-bg;
border: 1px solid @color-link;
border-top-color: transparent;
border-radius: 0 0 @fix_border-radius @fix_border-radius;
&::before {
content: '';
position: absolute;
top: -1px;
left: 0;
z-index: 0;
width: 100%;
height: 1px;
background-color: @color-link;
}
&.active { &.active {
display: block; display: block;
} }
> div { > div {
padding: .8rem .5rem .5rem; padding: .8rem .5rem .5rem;
p { p {
padding-left: 1em; padding-left: 1em;
} }
ul { ul {
list-style: none; list-style: none;
padding-left: 0; padding-left: 0;
li { li {
margin-left: 0; padding-left: 1em; margin-left: 0;
padding-left: 1em;
} }
} }
} }
@ -127,26 +164,34 @@
padding: .6rem .5rem .5rem .8rem; padding: .6rem .5rem .5rem .8rem;
background: transparent; background: transparent;
border: 0 none; border: 0 none;
h3 { h3 {
display: none; display: none;
} }
> div { > div {
padding: 0; padding: 0;
} }
> div ul.toc { > div ul.toc {
font-size: .78rem; font-size: .78rem;
padding-left: .5em; padding-left: .5em;
a { a {
font-size: .78rem; font-size: .78rem;
display: inline-block; display: inline-block;
padding-left: 10px; padding-left: 10px;
position: relative; position: relative;
} }
li { li {
} }
div.li { div.li {
position: relative; position: relative;
::before { padding: .15em 0;
&::before {
position: absolute; position: absolute;
top: .3em; top: .3em;
content: ""; content: "";
@ -157,15 +202,16 @@
overflow: hidden; overflow: hidden;
left: 0; left: 0;
} }
padding: .15em 0;
} }
} }
> div > ul.toc { > div > ul.toc {
padding: 0; padding: 0;
} }
} }
} }
} }
+ .msg-area + a { + .msg-area + a {
clear: right; clear: right;
margin-top: 20px; margin-top: 20px;