Compare commits

...

2 Commits

  1. 57
      assets/sass/main.scss
  2. 64
      content/resume/_index.md
  3. 20
      content/resume/archived.txt
  4. 7
      content/resume/printable.txt
  5. 9
      ideas.md
  6. 16
      layouts/shortcodes/resume/project-site.html
  7. 15
      layouts/shortcodes/resume/project.html

57
assets/sass/main.scss

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

64
content/resume/_index.md

@ -32,6 +32,26 @@ url="https://github.com/Kevin-Mok/spotify-lib-vis" date="July 2018" show="true"
<!--- Spotify Graphs }}} --> <!--- Spotify Graphs }}} -->
<!--- 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.
- Responsive front-end using **Bootstrap**. Uses **Node.js** and
**MongoDB** for back-end.
- Currently deployed on [**Heroku**][Grocery Finder Heroku].
- Took on role as project leader to prioritize and delegate tasks
while
also implementing a majority of the core features.
[Grocery Finder Heroku]: http://www.grocery-finder.ml
{{% /resume/project %}}
<!--- Grocery Finder }}} -->
<!--- ParsaFood {{{ --> <!--- ParsaFood {{{ -->
{{% resume/project name="ParsaFood" {{% resume/project name="ParsaFood"
@ -43,7 +63,6 @@ show="true" %}}
- Made during a 24-hour [food-themed hackathon][Platterz Hackathon event] - 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 in a group with two other members. Came in 2<sup>nd</sup> place and won
an [Oculus Rift][Oculus Rift Amazon]. 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 repo]: https://github.com/Kevin-Mok/ParsaFood
[Parsafood motivation]: https://github.com/Kevin-Mok/ParsaFood#motivation [Parsafood motivation]: https://github.com/Kevin-Mok/ParsaFood#motivation
@ -54,28 +73,6 @@ show="true" %}}
<!--- ParsaFood }}} --> <!--- 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.
- Responsive front-end using **Bootstrap**. Uses **Node.js** and
**MongoDB** for back-end.
- Currently deployed on [**Heroku**][Grocery Finder Heroku].
- Took on role as project leader to prioritize and delegate tasks
while
also implementing a majority of the core features.
[Grocery Finder Heroku]: http://www.grocery-finder.ml
{{% /resume/project %}}
<!--- Grocery Finder }}} -->
<!--- TrapBot {{{ --> <!--- TrapBot {{{ -->
{{% resume/project name="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 - reddit bot that looks for comments with song names and responds with
their respective SoundCloud links. their respective SoundCloud links.
- Received positive feedback from users who saw the bot's posts.
- Uses __Python__ API wrappers for SoundCloud and reddit. - Uses __Python__ API wrappers for SoundCloud and reddit.
{{% /resume/project %}} {{% /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 }}} --> <!--- Grocery Finder }}} -->
{{% /resume/section %}}<!--- }}} --> {{% /resume/section %}}<!--- }}} -->

20
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. {{{ --> <!--- Super ADA Bros. {{{ -->
{{% resume/project name="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 - Clone of Super Mario Bros 1-1, but Mario is mobility-impaired and
uses ramps to get through the level. 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**). face-tracking script (**OpenCV**).
- Implemented in [**Godot**][Godot site], an open-source game engine. - Implemented in [**Godot**][Godot site], an open-source game engine.
- Made during a 24-hour [accessibility-themed hackathon][PC Hacks event]. - 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 %}} {{% /resume/project %}}
<!--- Grocery Finder }}} -->
<!--- }}} -->

7
content/resume/printable.txt

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

9
ideas.md

@ -1,13 +1,8 @@
# Large # Large
- resume - 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 - make old proj's displayable
- change to km.com URL's
- change URL param to repo name
- spv - spv
- screenshots - screenshots
- setup instructions - setup instructions

16
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>

15
layouts/shortcodes/resume/project.html

@ -1,14 +1,11 @@
<div class="project"> <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>
<h2 class="project-title">
<a href="{{ .Get "url" }}" target="_blank">
{{ .Get "name" }}
</a>
</h2>
<div class="date">{{ .Get "date" }}</div> <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> <div>
{{ .Inner }} {{ .Inner }}
</div> </div>

Loading…
Cancel
Save