Merge branch 'master' into resume-pdf-2

Sample cover letter, letter submodule
Custom sitemap layout to hide letters.
2019-10-07 22:00:27 -04:00 · 2019-10-07 20:55:31 -04:00 · 2019-10-05 05:48:31 -04:00 · 2019-10-05 04:53:06 -04:00 · 2019-10-05 03:13:44 -04:00
17 changed files with 123 additions and 332 deletions
--- a/.gitmodules
+++ b/.gitmodules
@@ -1,7 +1,4 @@
 [submodule "content/letter"]
 	path = content/letter
 	url = ssh://git@git.kevin-mok.com:399/Kevin-Mok/cover-letters.git
-	branch = master
-[submodule "static/pdf"]
-	path = static/pdf
-	url = ssh://git@git.kevin-mok.com:399/Kevin-Mok/resume-pdf.git
+	branch = drafts
--- a/assets/sass/main.scss
+++ b/assets/sass/main.scss
@@ -2,14 +2,10 @@

 //  base colors {{{ // 

-$base00: #2d2d2d;
-$base01: #393939;
 $base02: #515151;
 $base03: #747369;
 $base04: #a09f93;
 $base05: #d3d0c8; 
-$base06: #e8e6df;
-$base07: #f2f0ec;
 $base-red: #f2777a;
 $base-orange: #f99157;
 $base-yellow: #ffcc66;
@@ -19,6 +15,13 @@ $base-blue: #6699cc;
 $base-violet: #cc99cc;
 $base-dark-orange: #d27b53;

+/* .base00 { color: #2d2d2d; }
+.base01 { color: #393939; }
+.base02 { color: #515151; }
+.base03 { color: #747369; }
+.base04 { color: #a09f93; }
+.base06 { color: #e8e6df; }
+.base07 { color: #f2f0ec; } */
 .base08 { color: $base-red; }
 .base09 { color: $base-orange; }
 .base0a { color: $base-yellow; }
@@ -35,7 +38,6 @@ $base-dark-orange: #d27b53;
 // $max-page-width: 52em;
 $max-page-width: 45em;
 $phone-width: 800px;
-$vert-phone-width: 500px;

@mixin side-padding-rem($n) {// {{{
  padding-left: $n * 1rem;
@@ -88,15 +90,6 @@ $vert-phone-width: 500px;
  }
 }// }}}

-@mixin a-no-underline() {// {{{
-  a {
-    text-decoration: none;
-    &:hover {
-      text-decoration: none;
-    }
-  }
-}// }}}
-
 //  }}} mixins // 

 //  general elements {{{ // 
@@ -112,9 +105,9 @@ body {
  color: $color;
  line-height: 1.5;
  // font-size: 100%;
-  font-size: 15px;
-  // font-size: 25px;
-  // font-family: 'Hack Nerd Font Mono', monospace;
+  // font-size: 15px;
+  font-size: 20px;
+  /* font-family: 'Source Code Pro', monospace; */
  font-family: 'Hack', monospace;
  display: flex;
  flex-direction: column;
@@ -215,17 +208,12 @@ footer {
        position: relative;
        padding-right: $side-padding;
        // padding-right: .9em;
-        @include a-no-underline();

        img {
          height: 1.5em;
          @include vert-margin-rem(.2);
          padding-left: .5em;
          opacity: .6;
-
-          &:hover {
-            opacity: 1;
-          }
        }
      }
    }
@@ -257,22 +245,22 @@ p {
  margin-bottom: 1rem;
 }

-h1 {
-  font-size: 2rem;
+// h1 {
+  // font-size: 2rem;

-  @media (max-width: $phone-width) {
-    font-size: 1.75rem;
-  }
-}
-h2 {
-  font-size: 1.5rem;
+  // @media (max-width: $phone-width) {
+    // font-size: 1.75rem;
+  // }
+// }
+// h2 {
+  // font-size: 1.5rem;

-  @media (max-width: $phone-width) {
-    font-size: 1.4rem;
-  }
-}
+  // @media (max-width: $phone-width) {
+    // font-size: 1.4rem;
+  // }
+// }
 h3 { font-size: 1.25rem }
-h4 { font-size: 1rem }
+// h4 { font-size: 1rem }
 h5 { font-size: .875rem }
 h6 { font-size: .75rem }

@@ -487,25 +475,31 @@ header {// {{{

 #print-icon {// {{{
  float: right;
+  display: none;

  img {
-    height: 2em !important;
-    position: absolute;
+    height: 1.75em;
+    position: relative;
    top: 1em;
  }
 }// }}}

 #contact-info {// {{{
  @include side-margin-em(0);
-  @include side-padding-rem(0);
  // @include vert-padding-rem(0.5);
  @include a-color($base-sky-blue);
-  width: 100%;
-  // @media (min-width: 1200px) {
-      // .container{
-        // min-width: $max-page-width;
-      // }
-  // }
+  // min-width: $max-page-width;
+  @media (min-width: 1200px) {
+      .container{
+        min-width: $max-page-width;
+      }
+  }
+  a {// {{{
+    text-decoration: none;
+    &:hover {
+      text-decoration: none;
+    }
+  }// }}}

  font-size: .9em;

@@ -532,11 +526,11 @@ header {// {{{
    margin-left: 5px;
    // position: relative;
    // left: -8px;
-    @media (max-width: $phone-width) {
-      // display: none;
-      // font-size: 10px;
-      font-size: .8em;
-    }
+    // @media (max-width: $phone-width) {
+      // // display: none;
+      // // font-size: 10px;
+      // font-size: .8em;
+    // }
  }

 }// }}}
@@ -551,45 +545,44 @@ header {// {{{

  h1 {// {{{
    color: $base-orange;
-    margin-top: 1rem;
+    margin-top: 1.3rem;

-    @media (max-width: $phone-width) {
-      margin-top: .75rem;
-    }
+    // @media (max-width: $phone-width) {
+      // margin-top: .75rem;
+    // }
  }// }}}
  h2 {// {{{
    color: $base-orange;
    margin-top: .5rem;

-    @media (max-width: $phone-width) {
-      font-size: 1.2em;
-      margin-top: .75rem;
-    }
+    // @media (max-width: $phone-width) {
+      // font-size: 1.2em;
+      // margin-top: .75rem;
+    // }
  }// }}}
  h4 {// {{{
    color: $base-yellow;
    margin-top: .5rem;

-    @media (max-width: $phone-width) {
-      font-size: 1.2em;
-      margin-top: .75rem;
-    }
+    // @media (max-width: $phone-width) {
+      // font-size: 1.2em;
+      // margin-top: .75rem;
+    // }
  }// }}}

  .date {// {{{
-    padding-top: .8em;
    float: right;
    color: $base03;
    
-    @media (max-width: $phone-width) {
-      padding-top: 0em;
-    }
+    // @media (max-width: $phone-width) {
+      // padding-top: 0em;
+    // }
  }// }}}

  #projects {// {{{
-    h1 {
-      margin-bottom: 3px;
-    }
+    // // h1 {
+      // // margin-bottom: 3px;
+    // // }

    .project {// {{{
      @include vert-padding-rem(.2);
@@ -603,6 +596,10 @@ header {// {{{
        height: 1.2em;
      }

+      .project-header {
+        margin-bottom: .6em;
+      }
+
      .project-link {
        &:hover {
          text-decoration: none;
@@ -654,14 +651,13 @@ header {// {{{
    }
  }// }}}

-  @media (max-width: $phone-width) {
-    font-size: 14px;
-    // font-size: 1em;
-  }
+  // @media (max-width: $phone-width) {
+    // font-size: 14px;
+    // // font-size: 1em;
+  // }

  &.letter {
    margin-top: 2em;
-    // font-size: 21px;

    img {
      height: 4.5em;
@@ -669,33 +665,19 @@ header {// {{{

    h2 {
      color: $base-red;
-      // font-size: 30px;
-      // margin-top: 0em;
-      // margin-top: .5em;
-      // margin-top: 1.25em;
-      // margin-bottom: 1em;
+      margin-top: 0em;
    }

-
    p {
-      margin-bottom: 1.5em;
-      // margin-bottom: 1em;
-    }
-    
-    ul {
-      // margin-bottom: 1.5em;
-      margin-bottom: 2em;
+      margin-bottom: 1.25em;
    }
    
    .no-line-spacing {
      line-height: .5em;
-      margin-bottom: 2.15em;
+      margin-bottom: 2em;
      p {
        margin-bottom: 1em;
      }
-      strong {
-        line-height: 1.25em;
-      }
    }
  }
 }// }}}
@@ -750,168 +732,6 @@ header {// {{{
  }
 }// }}}

-#card {// {{{
-  @include vert-margin-rem(2);
-  align-items: center;
-  justify-content: center;
-  font-family: 'Oxygen Mono', monospace;
-
-  .container {// {{{
-    padding-left: 0;
-    padding-right: 0;
-
-    .row {
-      padding-top: 6rem;
-      padding-bottom: 8rem;
-      
-      @media (max-width: $phone-width) {
-        padding-top: 5rem;
-        padding-bottom: 6rem;
-      }
-    }
-  }// }}}
-
-  // $card-bg: #e8e6df;
-  $card-bg: $base07;
-  #presentational-container {// {{{
-    margin-top: 3em;
-    margin-bottom: 1em;
-    max-width: $max-page-width;
-    box-shadow: 2px 2px 10px 5px black;
-    // card bg
-    // background-color: #fff;
-    // background-color: #e5e5e5;
-    background-color: $card-bg;
-  }// }}}
-
-  #email-full {// {{{
-    font-size: 50px;
-    @media (max-width: $phone-width) {
-      font-size: 40px;
-    }
-    @media (max-width: $vert-phone-width) {
-      font-size: 33px;
-    }
-
-    @include vert-margin-rem(2);
-    height: 7em;
-
-    img {
-      height: .5em;
-      position: absolute;
-      left: -.8em;
-      bottom: -.15em;
-    }
-
-    p { // {{{
-      position: relative;
-      // color: grey;
-      color: #151515;
-      // color: #133337;
-
-      div {
-        display: inline;
-      }
-
-      .social {// {{{
-        // display: none;
-        display: inline;
-        white-space: nowrap;
-        position: absolute;
-        // left: 5.5rem;
-        left: 0rem;
-
-        .safari {
-          display: none;
-        }
-
-        @supports (-webkit-backdrop-filter: blur(1px)) {
-          left: .65rem;
-          .safari {
-            display: inline;
-          }
-        }
-
-        .link-text {
-          position: relative;
-          width: 100%;
-        }
-
-        $border-thickness: 8px;
-        @media (max-width: $vert-phone-width) {
-          $border-thickness: 5px;
-        }
-        .link {
-          position: absolute;
-          border-color: black;
-          border-style: solid;
-          border-width: 0 $border-thickness $border-thickness $border-thickness;
-          height: .45em;
-          width: 100%;
-          left: 0;
-          img {
-            position: absolute;
-            left: -1em;
-          }
-
-          &.link-top {
-            border-width: $border-thickness $border-thickness 0 $border-thickness;
-
-            img {
-              position: absolute;
-              top: -.2em;
-            }
-          }
-
-          &:hover {
-            opacity: .6;
-          }
-        }
-
-        $line-spacing: .65em;
-        #mastodon {
-          top: -$line-spacing * 1.1;
-          border-color: #3088d4;
-        }
-        .linkedin {
-          bottom: -$line-spacing * 1.1;
-          border-color: #0077b7;
-
-          &.linkedin-middle {
-            border-style: dotted;
-            border-width: 0 0 3.5px 0;
-          }
-        }
-        #github {
-          bottom: -$line-spacing * 2.7;
-        }
-        #site {
-          bottom: -$line-spacing * 4.25;
-          border-color: #ff7058;
-        }
-        #email {
-          top: -$line-spacing * 2.65;
-          border-color: #d1d0bf;
-        }
-      }// }}}
-
-      .spacing {
-        opacity: 0;
-      }
-    }// }}}
-  }// }}}
-}// }}}
-
-#letter-home {// {{{
-
-  #letter-instr {
-    text-align: center;
-    margin-top: 1.5em;
-    // margin-top: 25vh;
-    font-size: 1.4em;
-  }
-}// }}}
-
 // TODO: converted up to here

 //  hero {{{ // 
@@ -930,9 +750,9 @@ h1.site-title {// {{{
    text-decoration: none;
  }

-  @media (max-width: $max-page-width) {
-    font-size: 3em;
-  }
+  // @media (max-width: $phone-width) {
+    // font-size: 3em;
+  // }

  // @media (max-width: $phone-width) {
    // font-size: 3.5em;
--- a/config.yaml
+++ b/config.yaml
@@ -29,20 +29,16 @@ menu:
  - name: card
    url: /card
    weight: 15
-  # - name: letter
-    # url: /letter
-    # weight: 17
+  - name: letter
+    url: /letter
+    weight: 17
  # - name: credits
    # url: /credits
    # weight: 20
    
-# blackfriday:
-  # plainIDAnchors: true
-  # hrefTargetBlank: true
+blackfriday:
+  plainIDAnchors: true
+  hrefTargetBlank: true

 disableKinds: ["RSS"]

-markup:
-  goldmark:
-    renderer:
-      unsafe: true
--- a/content/card/_index.md
+++ b/content/card/_index.md
@@ -1,5 +1,5 @@
 ---
 title: "Digital Card"
 date: 2019-02-11T07:50:51-05:00
-draft: false
+draft: true
 ---
--- a/content/config/_index.md
+++ b/content/config/_index.md
@@ -39,4 +39,5 @@ a single branch.

 [chezmoi]: https://github.com/twpayne/chezmoi

+
 <!---  }}} Setup --> 
--- a/content/letter
+++ b/content/letter
--- a/content/resume/_index.md
+++ b/content/resume/_index.md
@@ -3,10 +3,19 @@ title: "Resume"
 date: 2019-02-11T07:50:51-05:00
 draft: false
 ---
+{{% resume/section overview %}}<!--- {{{ -->
+
+3<sup>rd</sup> year CS student. Enthusiast of all things
+Linux and FOSS. Seeking 16-month internship for my PEY
+co-op program. Looking to gain industry-relevant experience in 
+full-stack web dev, DevOps or system administration.
+
+{{% /resume/section %}}<!--- }}} -->
+
 {{% resume/section skills %}}<!--- {{{ -->

 #### Languages
- **Bash**, **C**, **CSS**, C++, **Fish** (shell), Godot, **HTML5**, 
+- **Bash**, C, **CSS**, C++, **Fish** (shell), Godot, **HTML5**, 
  **Python**, Java, **Javascript** (ES6), **Sass**

 #### Frameworks
@@ -17,8 +26,8 @@ draft: false

 #### Tools
 - **Arch Linux**, Android Studio, **Debian**, **Command Line**, 
-  **Git**, IntelliJ IDEA, **Pycharm**, **NGINX**, npm/yarn, **SFTP**, 
-  **SSH**, **Vim**
+  **Git**, IntelliJ IDEA, **Pycharm**, **NGINX**, **SFTP**, **SSH**, 
+  **Vim**

 {{% /resume/section %}}<!--- }}} -->

@@ -35,9 +44,8 @@ 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**][d3 graph examples] to visualize the artists, 
-  genres and features of 
+- Produced bubble chart and (stacked) bar chart using [**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
@@ -124,27 +132,6 @@ url="https://kevin-mok.com/server/" date="Aug. 2019 — present" %}}

 <!--- DigitalOcean Droplet }}} -->

-<!--- Super ADA Bros. {{{ -->
-
-{{% resume/project name="Super ADA Bros"
-url="https://github.com/Kevin-Mok/SuperADABros" date="May 2019" %}}
-
- Designed clone of Super Mario Bros 1-1, but Mario is mobility-impaired and
-  uses ramps to get through the level.
- Uses **OpenCV** to track player's head movement which is then translated to 
-  in-game movement. [Video Demo]
- 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
-[Video Demo]: https://youtu.be/vRdENLGrBqM
-
-{{% /resume/project %}}
-
-
-<!--- Grocery Finder }}} -->
-
 {{% /resume/section %}}<!--- }}} -->

 {{% resume/section "Work Experience" %}}<!--- {{{ -->
--- a/content/resume/printable.txt
+++ b/content/resume/printable.txt
@@ -1,12 +1,13 @@
-// vim: ft=markdown
-
+# Base
 - bg colors
- 
-# Resume
- site title max width
- switch project shortcode
- rm details top margin
+- increase font size
+- all phone width blocks
+- reset header sizes
+- comment out font CSS stylesheet
+- hide print icon
+- right margin for social icons

-# Letter
- letter font size
- h2 
+# Project
+- remove expand icon and link
+- rm ADA Bros.
+- show all sections by default 
--- a/layouts/letter/single.html
+++ b/layouts/letter/single.html
@@ -1,5 +1,7 @@
 {{ partial "base/header.html" . }}

+{{ partial "resume/print-icon.html" . }}
+
 {{ partial "base/site-title.html" . }}

 {{ partial "resume/contact-info.html" . }}
--- a/layouts/partials/base/header.html
+++ b/layouts/partials/base/header.html
@@ -18,7 +18,7 @@
 <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
 <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
 <!-- <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Code+Pro:400,700" type="text/css"> -->
-<link rel='stylesheet' href='//cdn.jsdelivr.net/npm/hack-font@3.3.0/build/web/hack-subset.css'>
+<!-- <link rel='stylesheet' href='//cdn.jsdelivr.net/npm/hack-font@3.3.0/build/web/hack-subset.css'> -->
 <!-- <link rel="stylesheet" href="https://meyerweb.com/eric/tools/css/reset/reset.css" type="text/css" media="all" /> -->
 <link rel="stylesheet" href="{{ "css/style.css" | relURL }}" type="text/css">
 {{ $main_sass := resources.Get "sass/main.scss" }}
--- a/layouts/partials/home/about.html
+++ b/layouts/partials/home/about.html
@@ -1,7 +1,7 @@
 <div id="about">
 <h2>Welcome to my site!</h2>
 <p>
-  I'm Kevin Mok - a Computer Science
+  I'm Kevin Mok - a 3<sup>rd</sup> year Computer Science
  student at the University of Toronto, and I'm greatly interested in all things Linux and 
  <a href="https://www.gnu.org/philosophy/floss-and-foss.en.html"
    target="_blank">FOSS/FLOSS</a>.
--- a/layouts/partials/resume/print-icon.html
+++ b/layouts/partials/resume/print-icon.html
@@ -1,5 +1,5 @@
 <div id="print-icon">
-  <a href="{{ "pdf/kevin-mok-resume.pdf" | relURL }}" target="_blank">
+  <a href="{{ "kevin-mok-resume.pdf" | relURL }}" target="_blank">
    <img src="{{ "img/resume/printer.svg" | relURL }}" alt="printer-icon">
  </a>
 </div>
--- a/layouts/shortcodes/resume/letter-print.html
+++ b/layouts/shortcodes/resume/letter-print.html
@@ -1,8 +0,0 @@
-<div id="print-icon">
-  {{ $type := .Get "type"  }}
-  {{ $code := .Get "code"  }}
-  {{ $pdfName := print "pdf/kevin-mok-" $type "-" $code ".pdf"  }}
-  <a href="{{ $pdfName | relURL }}" target="_blank">
-    <img src="{{ "img/resume/printer.svg" | relURL }}" alt="printer-icon">
-  </a>
-</div>
--- a/layouts/shortcodes/resume/project.html
+++ b/layouts/shortcodes/resume/project.html
@@ -1,23 +1,22 @@
 <div class="project">
  <div class="row project-header">
    <div class="col-8 text-left">
+      <!-- <a class="project-link" href="{{ .Get "url" }}" target="_blank"> -->
+        <!-- <img src="{{ "img/resume/link.svg" | relURL }}" alt="link-icon"> -->
+      <!-- </a> -->
      <a class="project-link" href="{{ .Get "url" }}" target="_blank">
-        <img src="{{ "img/resume/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" }}
-          <img class="down-triangle" src="{{ "img/resume/down-triangle.png" | relURL }}" alt="link-icon">
+          <!-- <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>
+      </a>
    </div>
    <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>
--- a/static/kevin-mok-resume.pdf
+++ b/static/kevin-mok-resume.pdf
--- a/static/pdf
+++ b/static/pdf
--- a/static/server-table.js
+++ b/static/server-table.js
@@ -38,9 +38,6 @@ const generateTable = (table, data) => {
          aElem.textContent = elem['shortUrl']
          cell.appendChild(aElem)
          break
-        case 'description':
-          cell.innerHTML = elem[key]
-          break
        case 'repo':
          aElem.href = elem['repoUrl']
          aElem.textContent = elem[key]
Author	SHA1	Message	Date
Kevin Mok	162d3d7c25	Merge branch 'master' into resume-pdf-2	2019-10-07 22:00:27 -04:00
Kevin Mok	7f6743f8d9	Sample cover letter, letter submodule Custom sitemap layout to hide letters.	2019-10-07 20:55:31 -04:00
Kevin Mok	e9ce8bd5d1	Resume: PDF, update printable	2019-10-05 05:48:31 -04:00
Kevin Mok	2bedc77f1b	Add skills, improve project descriptions	2019-10-05 04:53:06 -04:00
Kevin Mok	6553a1bfa1	Reduce font size across site - add LinkedIn to resume - fix Unicode expand icon not showing on mobile - change footer background to line above	2019-10-05 03:13:44 -04:00