honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(aio): make the ToC left hand-side bar shorter (#17280) 

Make the ToC left hand-side bar shorter, so that it starts at the initial bullet
and ends at the final bullet.

Fixes #17221
This commit is contained in:
George Kalpakas 2017-06-08 10:56:00 +03:00 committed by Igor Minar
parent 33ba3e31ed
commit 8be2e4c325
1 changed files with 26 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
aio/src/styles/2-modules/_toc.scss
View File

@ -148,30 +148,43 @@ aio-toc {
a { a {
color: $blue; color: $blue;
font-weight: 500; font-weight: 500;
}
&:before { &:before {
content: ''; content: '';
border-radius: 50%; border-radius: 50%;
left: -4px; left: -3px;
top: 12px; top: 12px;
background: $blue; background: $blue;
position: absolute; position: absolute;
width: 6px; width: 6px;
height: 6px; height: 6px;
}
} }
} }
} }
&:not(.embedded) li { &:not(.embedded) li {
&.h1, &.h2, &.h3 { &:before {
border-left: 1px solid $lightgray; border-left: 1px solid $lightgray;
bottom: 0;
content: '';
left: 0;
position: absolute;
top: 0;
} }
&:not(.active):hover:before { &:first-child:before {
top: 13px;
}
&:last-child:before {
bottom: calc(100% - 14px);
}
&:not(.active):hover a:before {
content: ''; content: '';
border-radius: 50%; border-radius: 50%;
left: -4px; left: -3px;
top: 12px; top: 12px;
background: $lightgray; background: $lightgray;
position: absolute; position: absolute;