// Chapters
ul.chapters {
+ @scale: @menu-chapters-font-size/100;
list-style: none;
padding: 20px 0;
position: relative;
&[data-level="1"] + [data-level="0"] {
- margin-top: 15px;
+ margin-top: unit(15*@scale, px);
}
&[data-level="2"] + [data-level="1"] {
- margin-top: 10px;
+ margin-top: unit(10*@scale, px);
}
&[data-level="3"] + [data-level="2"] {
- margin-top: 5px;
+ margin-top: unit(5*@scale, px);
}
&.separator {
- height: 20px;
+ height: unit(20*@scale, px);
&:first-child {
height: 0;
}
a {
- font-size: 16px;
+ font-size: unit(16*@scale, px);
display: block;
text-align: left;
- padding: 5px 32px;
+ padding: unit(5*@scale, px) unit(32*@scale, px);
transition: background-color 250ms;
.rtl & {
font-weight: 400;
.right .puce {
- margin: 2px 0 0 0;
+ margin: unit(2*@scale, px) 0 0 0;
}
}
&.level1 {
- padding-left: 50px;
+ padding-left: unit(50*@scale, px);
.right {
- top: 6px;
+ top: unit(6*@scale, px);
}
.rtl & {
padding-left: 0;
- padding-right: 50px;
+ padding-right: unit(50*@scale, px);
}
}
&.level2 {
- padding-left: 80px;
+ padding-left: unit(80*@scale, px);
.rtl & {
padding-left: 0;
- padding-right: 80px;
+ padding-right: unit(80*@scale, px);
}
.right {
- top: 6px;
+ top: unit(6*@scale, px);
}
.right .puce {
- margin: -2px 0 0 0;
+ margin: unit(-2*@scale, px) 0 0 0;
}
}
.level3 {
- padding-left: 110px;
+ padding-left: unit(110*@scale, px);
.right {
- top: 6px;
+ top: unit(6*@scale, px);
}
.rtl & {
padding-left: 0;
- padding-right: 110px;
+ padding-right: unit(110*@scale, px);
}
}
li > a > span {
display: block;
- padding-right: 30px;
+ padding-right: unit(30*@scale, px);
.rtl & {
padding-right: 0;
- padding-left: 30px;
+ padding-left: unit(30*@scale, px);
}
}
.right {
- @size: 20px;
+ @size: unit(20*@scale, px);
- right: 32px;
- top: 4px;
+ right: unit(32*@scale, px);
+ top: unit(4*@scale, px);
position: absolute;
display: inline-block;
vertical-align: top;
.rtl & {
right: auto;
- left: 32px;
+ left: unit(32*@scale, px);
}
.puce {