You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
120 lines
2.5 KiB
120 lines
2.5 KiB
//@format |
|
$toc_breakpoint: 768px; |
|
.toc { |
|
position: -webkit-sticky; /* Safari */ |
|
position: sticky; |
|
top: 100px; |
|
margin-top: 0 !important; |
|
margin-bottom: 0 !important; |
|
} |
|
.node .toc-tree { |
|
border: none; |
|
padding: 0; |
|
} |
|
.toc-block--mobile { |
|
@include breakpoint($desktop-up) { |
|
//display: none; |
|
} |
|
} |
|
.toc-block--wide { |
|
position: -webkit-sticky; /* Safari */ |
|
position: sticky; |
|
top: 100px; |
|
margin-top: 2rem; |
|
.toc--title { |
|
&[aria-expanded='true'] h2::after { |
|
//content: "\f146";//square |
|
content: '\f068'; |
|
} |
|
&[aria-expanded='false'] h2::after { |
|
//content: "\f0fe"; |
|
content: '\f067'; |
|
} |
|
h2::after { |
|
font-family: 'FontAwesome'; |
|
position: absolute; |
|
//top: 6px; |
|
right: 0; |
|
font-weight: 400; |
|
line-height: 20px; |
|
font-size: 2rem; |
|
background: #ccc; |
|
padding: 10px; |
|
//text-align: right; |
|
} |
|
h2 { |
|
text-align: left; |
|
border: 1px dotted #ccc; |
|
padding: 0px; |
|
padding-left: 10px; |
|
line-height: 40px; |
|
margin-bottom: 0px; |
|
background: #f5f3f3; |
|
} |
|
} |
|
.toc--list { |
|
border: 1px dotted #ccc; |
|
border-top: 0px; |
|
padding-top: 1rem; |
|
ol { |
|
list-style-type: none; |
|
padding-left: 0; |
|
|
|
font-family: $serif; |
|
font-size: 1.8rem; |
|
line-height: 1.8; |
|
} |
|
a { |
|
display: block; |
|
padding-left: 1rem; |
|
&:hover { |
|
background: #ccc; |
|
} |
|
} |
|
} |
|
} |
|
|
|
.region-sidebar-second { |
|
height: 1000px; |
|
} |
|
.node__main-content .toc-block--wide { |
|
@include breakpoint($desktop-up) { |
|
//display: none; |
|
} |
|
} |
|
.toc-container .toc-block--wide { |
|
@include breakpoint($desktop-up) { |
|
position: -webkit-sticky; /* Safari */ |
|
position: sticky; |
|
top: 300px; |
|
} |
|
} |
|
.toc-desktop { |
|
display: block !important; |
|
} |
|
.toc-mobile { |
|
display: none !important; |
|
} |
|
//.article-title-banner { |
|
//grid-area: header; |
|
//} |
|
//.node__main-content { |
|
//grid-area: main; |
|
//} |
|
//.toc-container { |
|
//grid-area: toc; |
|
//} |
|
//.node__container { |
|
//display: grid; |
|
//grid-template-columns: 70% 30%; |
|
//grid-template-rows: auto; |
|
//grid-template-areas: |
|
//'header header' |
|
//'toc toc' |
|
//'main main'; |
|
//@include breakpoint($desktop-up) { |
|
//grid-template-areas: |
|
//'header header' |
|
//'main toc'; |
|
//} |
|
//}
|
|
|