Resume: fix paper size

assets/sass/main.scss

@@ -82,17 +82,18 @@ $phone-width: 800px;
 
 //  general elements {{{ // 
 
-$background-color: #2d2d2d;
-$color: #f2f0ec;
-// $background-color: white;
-// $color: black;
+// $background-color: #2d2d2d;
+// $color: #f2f0ec;
+$background-color: white;
+$color: black;
 
 body {
   margin: 0;
   background-color: $background-color;
   color: $color;
   line-height: 1.5;
-  font-size: 100%;
+  // font-size: 100%;
+  font-size: 1.1em;
   /* font-family: 'Source Code Pro', monospace; */
   font-family: 'Hack', monospace;
   display: flex;
@@ -414,6 +415,7 @@ footer {// {{{
 } */// }}}
 
 #print-icon {// {{{
+  display: none;
   float: right;
 
   img {
@@ -427,6 +429,7 @@ footer {// {{{
   @include vert-padding-rem(0.5);
   display: flex;
   align-content: center;
+  // font-size: 1.25em;
 
   div {
     flex-grow: 1;
@@ -446,7 +449,24 @@ footer {// {{{
   }
 }// }}}
 
+@page {
+  size: letter;
+}
+// @media print {
+  // @page {
+    // margin: 0;
+    // size: letter;
+  // }
+
+  // body {
+    // padding: 1in;
+  // }
+// }
+
 #resume {// {{{
+  // font-size: 1.1em;
+  // font-size: 1em;
+
   a {
     text-decoration: none;
     &:hover {
@@ -456,6 +476,8 @@ footer {// {{{
 
   h1 {
     color: $base-orange;
+    margin-top: .9em;
+    font-size: 1.75em;
   }
 
   .date {
@@ -469,6 +491,7 @@ footer {// {{{
     h2 {
       color: $base-sky-blue;
       display: inline;
+      font-size: 1.5em;
     }
 
     img {
@@ -493,9 +516,9 @@ footer {// {{{
       }
     }
 
-    // [id^="details-"] {
-      // margin-top: .5em;
-    // }
+    [id^="details-"] {
+      margin-top: .5em;
+    }
   }
 
 }// }}}
@@ -506,8 +529,8 @@ footer {// {{{
 
 h1.site-title {// {{{
   text-align: center;
-  /* font-size: 3.5em; */
-  font-size: 4.8em;
+  // font-size: 4.8em;
+  font-size: 5.5em;
   // color: #66cccc;
   color: $base05;
   margin-top: 1rem;
@@ -518,15 +541,13 @@ h1.site-title {// {{{
     text-decoration: none;
   }
 
-  @media (max-width: $max-page-width) {
-    font-size: 3em;
-  }
-
-  @media (max-width: $phone-width) {
+  // @media (max-width: $max-page-width) {
     // font-size: 3em;
-    // font-size: 2.5em;
-    font-size: 2em;
-  }
+  // }
+
+  // @media (max-width: $phone-width) {
+    // font-size: 2em;
+  // }
 }// }}}
 
 .hero-logo img {

content/resume/_index.md

@@ -32,37 +32,13 @@ url="https://github.com/Kevin-Mok/spotify-lib-vis" date="July 2018" show="true"
 
 <!--- Spotify Graphs }}} -->
 
-<!--- ParsaFood {{{ -->
-
-{{% resume/project name="ParsaFood" 
-url="https://github.com/Kevin-Mok/ParsaFood" date="Feb. 2018" 
-show="true" %}}
-
-- **Android** app that reads ingredient labels and detects any dietary 
-  restrictions/allergies. 
-- Made during a 24-hour [food-themed hackathon][Platterz Hackathon event]
-  in a group with two other members. Came in 2<sup>nd</sup> place and won
-  an [Oculus Rift][Oculus Rift Amazon].
-- Came up with the idea based on [personal experience][Parsafood motivation].
-
-[Parsafood repo]: https://github.com/Kevin-Mok/ParsaFood
-[Parsafood motivation]: https://github.com/Kevin-Mok/ParsaFood#motivation
-[Platterz Hackathon event]: https://www.eventbrite.com/e/platterz-hackathon-tickets-42682237722
-[Oculus Rift Amazon]: https://www.amazon.ca/Oculus-Rift-Windows-VR-Headset/dp/B00VF0IXEY/ref=sr_1_1_sspa?ie=UTF8&qid=1520422949&sr=8-1-spons&keywords=oculus+rift&psc=1
-
-{{% /resume/project %}}
-
-<!--- ParsaFood }}} -->
- 
 <!--- Grocery Finder {{{ -->
 
 {{% resume/project name="Grocery Finder" 
 url="https://github.com/Kevin-Mok/grocery-finder" date="April 2019" 
 show="true" %}}
 
-- Proof of concept for a web app that finds the best supermarket for 
-  your needs based on the total price of your cart items and distance 
-  form you.
+- Proof of concept for a web app that finds the best supermarket for your needs.
 - Responsive front-end using **Bootstrap**. Uses **Node.js** and 
   **MongoDB** for back-end.
 - Currently deployed on [**Heroku**][Grocery Finder Heroku].
@@ -76,6 +52,27 @@ show="true" %}}
 
 <!--- Grocery Finder }}} -->
 
+<!--- ParsaFood {{{ -->
+
+{{% resume/project name="ParsaFood" 
+url="https://github.com/Kevin-Mok/ParsaFood" date="Feb. 2018" 
+show="true" %}}
+
+- **Android** app that reads ingredient labels and detects any dietary 
+  restrictions/allergies. 
+- Made during a 24-hour [food-themed hackathon][Platterz Hackathon event]
+  in a group with two other members. Came in 2<sup>nd</sup> place and won
+  an [Oculus Rift][Oculus Rift Amazon].
+
+[Parsafood repo]: https://github.com/Kevin-Mok/ParsaFood
+[Parsafood motivation]: https://github.com/Kevin-Mok/ParsaFood#motivation
+[Platterz Hackathon event]: https://www.eventbrite.com/e/platterz-hackathon-tickets-42682237722
+[Oculus Rift Amazon]: https://www.amazon.ca/Oculus-Rift-Windows-VR-Headset/dp/B00VF0IXEY/ref=sr_1_1_sspa?ie=UTF8&qid=1520422949&sr=8-1-spons&keywords=oculus+rift&psc=1
+
+{{% /resume/project %}}
+
+<!--- ParsaFood }}} -->
+ 
 <!--- TrapBot {{{ -->
 
 {{% resume/project name="TrapBot"
@@ -83,31 +80,10 @@ url="https://github.com/Kevin-Mok/TrapBot" date="March 2018" %}}
 
 - reddit bot that looks for comments with song names and responds with 
   their respective SoundCloud links.
-- Received positive feedback from users who saw the bot's posts.
 - Uses __Python__ API wrappers for SoundCloud and reddit.
 
 {{% /resume/project %}}
 
-<!--- Grocery Finder }}} -->
-
-<!--- Super ADA Bros. {{{ -->
-
-{{% resume/project name="Super ADA Bros"
-url="https://github.com/Kevin-Mok/SuperADABros" date="May 2019" %}}
-
-- Clone of Super Mario Bros 1-1, but Mario is mobility-impaired and
-  uses ramps to get through the level.
-- Able to played using only head movement by getting input from a
-  face-tracking script (**OpenCV**).
-- Implemented in [**Godot**][Godot site], an open-source game engine.
-- Made during a 24-hour [accessibility-themed hackathon][PC Hacks event].
-
-[PC Hacks event]: https://pchacks19.devpost.com/
-[Godot site]: https://godotengine.org
-
-{{% /resume/project %}}
-
-
 <!--- Grocery Finder }}} -->
 
 {{% /resume/section %}}<!--- }}} -->

content/resume/archived.txt

@@ -1,3 +1,17 @@
+<!--- TrapBot {{{ -->
+
+{{% resume/project name="TrapBot"
+url="https://github.com/Kevin-Mok/TrapBot" date="March 2018" %}}
+
+- reddit bot that looks for comments with song names and responds with 
+  their respective SoundCloud links.
+- Received positive feedback from users who saw the bot's posts.
+- Uses __Python__ API wrappers for SoundCloud and reddit.
+
+{{% /resume/project %}}
+
+<!--- Grocery Finder }}} -->
+
 <!--- Super ADA Bros. {{{ -->
 
 {{% resume/project name="Super ADA Bros"
@@ -5,7 +19,8 @@ url="https://github.com/Kevin-Mok/SuperADABros" date="May 2019" %}}
 
 - Clone of Super Mario Bros 1-1, but Mario is mobility-impaired and
   uses ramps to get through the level.
-- Able to played using only head movement by getting input from a
+- Able to be played using only head movement by getting input from 
+  a
   face-tracking script (**OpenCV**).
 - Implemented in [**Godot**][Godot site], an open-source game engine.
 - Made during a 24-hour [accessibility-themed hackathon][PC Hacks event].
@@ -15,6 +30,5 @@ url="https://github.com/Kevin-Mok/SuperADABros" date="May 2019" %}}
 
 {{% /resume/project %}}
 
-
-<!--- Grocery Finder }}} -->
+<!--- }}} -->
 

content/resume/printable.txt

@@ -1,4 +1,7 @@
 - bg colors
 - site title max width
-- switch project shortcode
-- rm details top margin
+- font size
+  - resume
+- details top margin
+- print icon
+- project shortcode

ideas.md

@@ -1,13 +1,8 @@
 # Large
 - resume
-  - expand some projects by default
-  - repo link (GitHub icon) beside each section
-    - make links open in new tab
-    - picture/video links?
-  - printable white version
-    - upload PDF
-    - JS to change CSS?
   - make old proj's displayable
+    - change to km.com URL's
+      - change URL param to repo name
     - spv
       - screenshots
       - setup instructions

layouts/shortcodes/resume/project-site.html

@@ -0,0 +1,16 @@
+<div class="project">
+  <a class="project-link" href="{{ .Get "url" }}" target="_blank">
+    <img src="{{ "img/link.svg" | relURL }}" alt="link-icon">
+  </a>
+  <button class="btn" type="button" data-toggle="collapse"
+    data-target="#{{ .Get "name" | lower | urlize }}-details"
+    aria-expanded="false" aria-controls="{{ .Get "name" | lower | urlize }}-details">
+    <h2 class="project-title">{{ .Get "name" }} ⏷</h2>
+  </button>
+  <div class="date">{{ .Get "date" }}</div>
+  <div class="collapse{{ with .Get "show" }} show{{ end }}" id="{{ .Get "name" | lower | urlize }}-details">
+    <div>
+      {{ .Inner }}
+    </div>
+  </div>
+</div>

layouts/shortcodes/resume/project.html

@@ -1,14 +1,11 @@
 <div class="project">
-  <a class="project-link" href="{{ .Get "url" }}" target="_blank">
-    <img src="{{ "img/link.svg" | relURL }}" alt="link-icon">
+  <h2 class="project-title">
+    <a href="{{ .Get "url" }}" target="_blank">
+      {{ .Get "name" }}
     </a>
-  <button class="btn" type="button" data-toggle="collapse"
-    data-target="#{{ .Get "name" | lower | urlize }}-details"
-    aria-expanded="false" aria-controls="{{ .Get "name" | lower | urlize }}-details">
-    <h2 class="project-title">{{ .Get "name" }} ⏷</h2>
-  </button>
+  </h2>
   <div class="date">{{ .Get "date" }}</div>
-  <div class="collapse{{ with .Get "show" }} show{{ end }}" id="{{ .Get "name" | lower | urlize }}-details">
+  <div class="collapse show" id="details-{{ .Get "name" | lower | urlize }}">
     <div>
       {{ .Inner }}
     </div>