added styling and markup for blogroll

layouts/partials/sidebar.html

@@ -2,10 +2,12 @@
     <div class="sidebar-cell">
         <p>Recommendations</p>
         
-        {{ range .Site.Data.blogrolls.recommendations }}
-            <p>{{ .name }}</p>
-        {{ else }}
-            <p>No recommendations yet.</p>
-        {{ end }}
+        <ul class="blogroll">
+            {{ range .Site.Data.blogrolls.recommendations }}
+                <li><a href="{{ .url }}">{{ .name }}: <span>{{ (urls.Parse .url).Hostname }}</span></a></li>
+            {{ else }}
+                <p>No recommendations yet.</p>
+            {{ end }}
+        </ul>
     </div>
 </div>

static/sidebar.css

@@ -4,5 +4,10 @@ body {
 
 div.wrapper {
     display: grid;
-    grid-template-columns: auto 20em;       /* might be 15 */
+    grid-template-columns: auto 15em;
+    column-gap: 60px;
+}
+
+div.sidebar {
+    font-size: 0.8;
 }