1/** 2 * @file 3 * Styles for menu placed in sidebar region. 4 */ 5 6@import "../../base/variables.pcss.css"; 7 8.menu--sidebar { 9 list-style: none; 10 11 & .menu { 12 list-style: none; 13 } 14 15 & .menu--level-1 { 16 margin: 0; 17 } 18 19 & .menu__link { 20 position: relative; 21 display: block; 22 padding-block: var(--sp0-75); 23 padding-inline-start: 0; 24 padding-inline-end: 0; 25 font-family: var(--font-serif); 26 font-size: 18px; 27 28 /* Bottom divider line. */ 29 &:after { 30 position: absolute; 31 inset-block-end: 0; 32 inset-inline-start: 0; 33 width: var(--sp4); 34 height: 0; 35 content: ""; 36 border-block-start: solid 2px var(--color--gray-80); 37 } 38 } 39 40 & .menu__link--link { 41 text-decoration: none; 42 color: var(--color--gray-0); 43 font-weight: 600; 44 45 &:hover { 46 color: var(--color--blue-50); 47 } 48 } 49 50 /* No bottom divider line for last menu item. */ 51 & .menu__item--level-1:last-child > .menu__link:last-child, 52 & .menu__item--level-1:last-child > .menu__item--level-2:last-child > .menu__link:last-child { 53 &:after { 54 content: none; 55 } 56 } 57} 58