Style pending divisions in landing page

… use color, italicization to help readers identify which divisions are available vs. those that haven’t yet been published

Author: joewiz

app/scss/_toc.scss

@@ -23,6 +23,23 @@
   > ul {
     margin-left: 0;
   }
+  li.pending {
+    font-style: italic;
+    
+      // Borrowed from .hsg-toc a:not(.hsg-current)
+      a {
+         color: $color-base;
+        
+         &:hover {
+           color: $color-primary-darker;
+         }
+    
+         &:focus {
+           //outline-offset: 0;
+           outline: 0.25rem solid $color-gray-light;
+         }
+      }
+  }
 }
 
 #toc,

modules/frus-toc-html.xqm

@@ -105,9 +105,12 @@ declare function toc:toc-div($model as map(*), $node as element(tei:div), $curre
     (: we only show certain divs :)
     for $node in $node[@xml:id != 'toc'][not(@type = ('document', 'document-pending'))]
     let $descendant-docs := $node//tei:div[@type = ('document', 'document-pending')]
+    let $is-pending := ends-with($node/@type, "-pending")
     return
         <li>
         {
+            if ($is-pending) then attribute class { 'pending' } else ()
+            ,
             let $href := attribute href { toc:href($node) }
             let $highlight := if ($node is $current) then 'highlight' else ()
             (: .toc-link would trigger an ajax call, so only use this if we're not showing a