Fix styling on documentation sidebar (#1395)

* fix sidebar stling in docs theme

* don't display heading levels higher than 3 in sidebar

* update sitemap step for easier debugging

* add matrix so github doesn't get confused

.github/workflows/docs.yaml

@@ -22,6 +22,11 @@ jobs:
   accessibility:
     if: contains(toJson(github.event.commits), '[ci skip]') == false
     runs-on: ubuntu-latest
+    strategy:
+      fail-fast: true
+      matrix:
+        python-version: [ 3.9 ]
+        os: [ ubuntu-latest ]
 
     steps:
     - uses: actions/checkout@v2
@@ -29,7 +34,7 @@ jobs:
     - name: Set up Python
       uses: actions/setup-python@v2
       with:
-        python-version: 3.9
+        python-version: ${{ matrix.python-version }}
 
     - name: Setup Node.js environment
       uses: actions/setup-node@main
@@ -61,8 +66,16 @@ jobs:
       env:
         site_url: http://127.0.0.1:8000
       run: |
+        filename='sitemap.xml'
         select="{urls: [\"${site_url}/\", \"${site_url}/search.html?q=jrnl\", .urlset.url[].loc]}"
-        curl -s "$site_url/sitemap.xml" | poetry run xq "$select" > list.json
+
+        curl -s "${site_url}/${filename}" > $filename
+
+        echo "::group::${filename}"
+        cat $filename
+        echo '::endgroup::'
+
+        poetry run xq "$select" $filename > list.json
 
     - name: Accessibility testing (Pa11y)
       run: pa11y-ci -c list.json

docs_theme/assets/theme.css

@@ -79,13 +79,28 @@ div.rst-content {
   max-width: 54em;
 }
 
+
 .wy-side-nav-search,
 .wy-menu-vertical li.current,
-.wy-menu-vertical li.toctree-l1.current > a {
+.wy-menu-vertical li.toctree-l1.current > a,
+.wy-menu-vertical li.toctree-l2.current > a,
+.wy-menu-vertical li.toctree-l3.current > a {
   background-color: transparent;
   border: none;
 }
 
+.wy-menu-vertical li.toctree-l2.current li.toctree-l3,
+.wy-menu-vertical li.toctree-l2.current li.toctree-l3 > a {
+  background: transparent;
+}
+
+.wy-menu-vertical li.toctree-l4,
+.wy-menu-vertical li.toctree-l5,
+.wy-menu-vertical li.toctree-l6,
+.wy-menu-vertical li.toctree-l7 {
+  display: none;
+}
+
 .wy-nav-top {
   background-color: var(--mid-purple);
   background-image: linear-gradient(-211deg, var(--mid-purple) 0%, var(--dark-purple) 100%);
@@ -118,6 +133,7 @@ a.icon-home:before {
 }
 
 .wy-menu-vertical a:hover,
+.wy-menu-vertical li.toctree-l2.current li.toctree-l3 > a:hover,
 .wy-menu-vertical li.current a:hover {
   background-color: var(--black-shadow);
   color: var(--white);
@@ -130,14 +146,10 @@ a.icon-home:before {
   position: relative;
 }
 
-.wy-menu-vertical li.current > a.current {
+.wy-menu-vertical li.toctree-l1.current > a {
   background: var(--darkest-purple);
   border: none !important;
-}
+  pointer-events: none;
-
-.wy-menu-vertical li.current > a:hover {
-  background: var(--darkest-purple);
-  border: none;
 }
 
 .wy-menu-vertical li.on a,
@@ -146,7 +158,7 @@ a.icon-home:before {
 }
 
 .wy-menu-vertical li.on a,
-.wy-menu-vertical li.current>a:after {
+.wy-menu-vertical li > a.current:after {
   position: absolute;
   right: 0em;
   z-index: 999;
@@ -158,13 +170,6 @@ a.icon-home:before {
   border-right: 1em solid var(--white);
 }
 
-.wy-menu-vertical li.toctree-l2.current {
-  font-size: 50px;
-}
-
-.wy-menu-vertical li.toctree-l2.current > a{
-}
-
 .toctree-expand:before {
   display: none !important;
 }
@@ -192,7 +197,6 @@ a.icon-home:before {
 
 .wy-nav-side {
   background-color: var(--mid-purple);
-  background-image: linear-gradient(211deg, var(--mid-purple) 0%, var(--dark-purple) 100%);
   font-weight: 300;
   height: 100%;
 }
@@ -223,14 +227,8 @@ form .search-query::placeholder {
   background: transparent;
 }
 
-.toctree-l2 a:first-child {
-  display: block;
-}
-
 .wy-menu-vertical li.current ul {
   background-color: var(--mid-purple);
-  border-bottom: 1px solid var(--mid-purple);
-  border-top: 1px solid var(--dark-purple);
 }