Print team ranking letter

assets/sass/main.scss

@@ -101,10 +101,10 @@ $vert-phone-width: 500px;
 
 //  general elements {{{ // 
 
-$background-color: #2d2d2d;
+// $background-color: #2d2d2d;
-$color: #f2f0ec;
+// $color: #f2f0ec;
-// $background-color: white;
+$background-color: white;
-// $color: black;
+$color: black;
 
 body {
   margin: 0;
@@ -112,9 +112,10 @@ body {
   color: $color;
   line-height: 1.5;
   // font-size: 100%;
-  font-size: 15px;
+  // font-size: 15px;
-  /* font-family: 'Source Code Pro', monospace; */
+  font-size: 25px;
-  font-family: 'Hack', monospace;
+  // font-family: 'Source Code Pro', monospace;
+  font-family: 'Hack Nerd Font Mono', monospace;
   display: flex;
   flex-direction: column;
   min-height: 100vh;
@@ -660,6 +661,7 @@ header {// {{{
 
   &.letter {
     margin-top: 2em;
+    font-size: 21px;
 
     img {
       height: 4.5em;
@@ -667,11 +669,22 @@ header {// {{{
 
     h2 {
       color: $base-red;
-      margin-top: 0em;
+      // margin-top: 0em;
+      // margin-top: 1.25em;
+      font-size: 30px;
+      // margin-top: .5em;
+      margin-bottom: 1em;
     }
 
+
     p {
-      margin-bottom: 1.5em;
+      // margin-bottom: 1.5em;
+      margin-bottom: 1em;
+    }
+    
+    ul {
+      // margin-bottom: 1.5em;
+      margin-bottom: 2em;
     }
     
     .no-line-spacing {
@@ -921,16 +934,16 @@ h1.site-title {// {{{
     font-size: 3em;
   }
 
-  @media (max-width: $phone-width) {
+  // @media (max-width: $phone-width) {
-    font-size: 3.5em;
+    // font-size: 3.5em;
-    @include vert-margin-rem(.3);
+    // @include vert-margin-rem(.3);
-    // font-size: 2.5em;
+    // // font-size: 2.5em;
-    // font-size: 2em;
+    // // font-size: 2em;
 
-    .surrounding {
+    // .surrounding {
-      display: none;
+      // display: none;
-    }
+    // }
-  }
+  // }
 }// }}}
 
 .hero-logo img {

config.yaml

@@ -36,9 +36,13 @@ menu:
     # url: /credits
     # weight: 20
     
-blackfriday:
+# blackfriday:
-  plainIDAnchors: true
+  # plainIDAnchors: true
-  hrefTargetBlank: true
+  # hrefTargetBlank: true
 
 disableKinds: ["RSS"]
 
+markup:
+  goldmark:
+    renderer:
+      unsafe: true

content/resume/_index.md

@@ -35,8 +35,9 @@ show="true" %}}
   into **PostgreSQL** database with **Django** backend.
 - Created and tested various relational database schemas to maximize 
   efficiency for use cases.
-- Produced bubble chart and (stacked) bar chart using [**d3**]
+- Produced bubble chart and (stacked) bar chart using 
-[d3 graph examples] to visualize the artists, genres and features of 
+  [**d3**][d3 graph examples] to visualize the artists, 
+  genres and features of 
 tracks in library.
 
 [d3 graph examples]: https://github.com/d3/d3/wiki/Gallery

content/resume/printable.txt

@@ -2,3 +2,7 @@
 - site title max width
 - switch project shortcode
 - rm details top margin
+
+
+{{% resume/letter-print type="team-rankings" code="8zOGK" %}}
+

layouts/shortcodes/resume/project.html

@@ -9,7 +9,6 @@
         aria-expanded="false" aria-controls="{{ .Get "name" | lower | urlize }}-details">
         <h2 class="project-title">
           {{ .Get "name" }}
-          <!-- <img class="down-triangle" src="{{ "img/resume/down-triangle.svg" | relURL }}" alt="link-icon"> -->
           <img class="down-triangle" src="{{ "img/resume/down-triangle.png" | relURL }}" alt="link-icon">
         </h2>
       </button>
@@ -17,9 +16,8 @@
     <div class="col-4 text-right date">{{ .Get "date" }}</div>
   </div>
   <div class="collapse{{ with .Get "show" }} show{{ end }}" id="{{ .Get "name" | lower | urlize }}-details">
-  <!-- <div class="show" id="{{ .Get "name" | lower | urlize }}-details"> -->
     <div>
       {{ .Inner }}
-    </div>
+</div>
   </div>
 </div>