diff --git a/src/app.css b/src/app.css index 77cb4d0..0e0b033 100644 --- a/src/app.css +++ b/src/app.css @@ -1401,11 +1401,14 @@ footer section p:first-child { text-overflow: ellipsis; overflow: hidden; display: block; - width: 100%; + width: calc(100% + 1rem); + margin-left: -1rem; + padding-left: 1rem; position: relative; color: #b0b0b0; /* VOID style dark text */ - transition: color 0.2s; + transition: color 0.2s, background-color 0.2s; text-decoration: none; + box-sizing: border-box; } .TOC li a:hover, @@ -1416,35 +1419,16 @@ footer section p:first-child { .TOC li a.is-active-link { font-weight: 700; -} - -.TOC .is-active-link::before { - content: ''; background-color: rgba(0, 0, 0, 0.3); /* VOID style dark highlight */ - display: block; - height: 2.1rem; - left: -1rem; - top: 0; - position: absolute; - width: calc(100% + 1rem); border-left: 2px solid #419b38; - z-index: -1; - box-sizing: border-box; + padding-left: calc(1rem - 2px); /* adjust padding for the border */ } @media screen and (min-width: 1199.5px) { - .TOC .toc-link:hover::before { - content: ''; + .TOC li a:hover { background-color: rgba(0, 0, 0, 0.3); - display: block; - height: 2.1rem; - left: -1rem; - top: 0; - position: absolute; - width: calc(100% + 1rem); border-left: 2px solid #419b38; - z-index: -1; - box-sizing: border-box; + padding-left: calc(1rem - 2px); } }