Update file formats for everything

kelyvin · Jan 11, 2021 · 07fc734 · 07fc734
1 parent 3ca9a1d
commit 07fc734
Show file tree

Hide file tree

Showing 39 changed files with 589 additions and 593 deletions.
diff --git a/README.md b/README.md
@@ -85,13 +85,13 @@ git update-index --no-assume-unchanged resume.json
 When you run `npm start` or choose to manually build the project using `gulp`, it will generate a `/public` folder. This folder will be created after running the appropritae gulp tasks against the `/app` folder. Essentially, the app folder is your development environment and the public folder will be what we deploy to production. The public folder is exactly the same as the public folder generated from the jsonresume-theme-boilerplate, thus, our `index.js` will still run agianst this folder.
 
 ## Exporting your resume
-To export your resume, you can run the following command below:
+To export your resume, you can run the following command below. This will automatically create a `resume.pdf` file within your current directory:
 
 ```
 npm run export
 ```
 
-This will automatically set up an npm link with this package to your globally installed npm dependencies and enable you to run the `resume export` command from `resume-cli`. This will automatically create a `resume.pdf` file within your current directory.
+Alternatively, you can also do a **print page** on the browser and save it as as PDF (by setting margins to none and removing header/footers.)
 
 ## Theme Overrides
 The theme provides will automatically render certain styles and icons depending on what you specify in the `resume.json` or what you choose to adjust within `variable.scss`. Some examples are listed below.

diff --git a/app/styles/base/_base.scss b/app/styles/base/_base.scss
@@ -1,123 +1,128 @@
 body {
-    @include lato();
+  @include lato();
 
-    background: $gray-lightest;
-    margin: 50px 0 100px;
-    letter-spacing: .3px;
-    color: $secondary-color;
+  background: $gray-lightest;
+  margin: 50px 0 100px;
+  letter-spacing: .3px;
+  color: $secondary-color;
 }
 
-h1, h2, h3, h4, h5, h6 {
-    text-transform: uppercase;
-    margin: 0;
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  text-transform: uppercase;
+  margin: 0;
 }
 
 h1 {
-    @include josefin(700);
-    @include font-size(10);
-    letter-spacing: 1px;
-    margin-bottom: 4px;
+  @include josefin(700);
+  @include font-size(10);
+  letter-spacing: 1px;
+  margin-bottom: spacing(1);
 }
 
 h2 {
-    @include josefin(300);
-    @include font-size(4);
-    letter-spacing: .5px;
+  @include josefin(300);
+  @include font-size(4);
+  letter-spacing: .5px;
 }
 
 h3 {
-    @include lato(300);
-    @include font-size(3.5);
-    letter-spacing: .4px;
+  @include lato(300);
+  @include font-size(3.5);
+  letter-spacing: .4px;
 
-    &.bold {
-        font-weight: 700;
-    }
+  &.bold {
+    font-weight: 700;
+  }
 }
 
 h4 {
-    @include lato(300);
-    @include font-size(3);
+  @include lato(300);
+  @include font-size(3);
 
-    &.bold {
-        font-weight: 700;
-    }
+  &.bold {
+    font-weight: 700;
+  }
 }
 
 h5 {
-    @include lato(300);
-    @include font-size(2.75);
+  @include lato(300);
+  @include font-size(2.75);
 
-    &.italic {
-        font-style: italic;
-    }
+  &.italic {
+    font-style: italic;
+  }
 }
 
 h6 {
-    @include lato();
-    @include font-size(2.5);
+  @include lato();
+  @include font-size(2.5);
 }
 
 a {
-    color: inherit;
-    text-decoration: inherit;
+  color: inherit;
+  text-decoration: inherit;
 
-    &:hover {
-        color: $link-color;
-    }
+  &:hover {
+    color: $link-color;
+  }
 
-    .fa-external-link {
-        font-size: 10px;
-        vertical-align: text-top;
-    }
+  .fa-external-link {
+    font-size: 10px;
+    vertical-align: text-top;
+  }
 }
 
 p,
 li {
-    @include font-size(2.75);
+  @include font-size(2.75);
 }
 
 blockquote {
-    @include font-size(2.75);
-    @include lato($isItalic: true);
+  @include font-size(2.75);
+  @include lato($isItalic: true);
 
-    margin: spacing(2) spacing(5);
+  margin: spacing(2) spacing(5);
 }
 
 em {
-    color: $gray-dark;
+  color: $gray-dark;
 }
 
 ul {
-    margin: spacing(2) 0 0;
-    -webkit-padding-start: spacing(5);
+  margin: spacing(2) 0 0;
+  -webkit-padding-start: spacing(5);
 
-    li {
-        padding-left: spacing(2);
-    }
+  li {
+    padding-left: spacing(2);
+  }
 
-    &.minimal {
-        list-style: none;
-        padding: 0;
+  &.minimal {
+    list-style: none;
+    padding: 0;
 
-        li {
-            margin-bottom: 3px;
-            padding-left: 0;
-        }
+    li {
+      margin-bottom: 3px;
+      padding-left: 0;
     }
+  }
 
-    &.two-column {
-        -webkit-column-count: 2;
-        -webkit-column-gap: spacing(5.6);
-        column-count: 2;
-        column-gap: spacing(5.6);
+  &.two-column {
+    -webkit-column-count: 2;
+    -webkit-column-gap: spacing(5.6);
+    column-count: 2;
+    column-gap: spacing(5.6);
 
-        li {
-            padding-left: 0;
-        }
+    li {
+      padding-left: 0;
     }
+  }
 }
 
 @page {
-    size: A4;
+  size: A4;
 }
diff --git a/app/styles/base/_fonts.scss b/app/styles/base/_fonts.scss
@@ -3,17 +3,17 @@
 // Font Mixins
 
 // Lato - 300, 400, 700; Italics
-@mixin lato($weight: 400, $isItalic: false){
-    font-family: $primary-font;
-    font-weight: $weight;
+@mixin lato($weight: 400, $isItalic: false) {
+  font-family: $primary-font;
+  font-weight: $weight;
 
-    @if $isItalic == true {
-        font-style: italic;
-    }
+  @if $isItalic==true {
+    font-style: italic;
+  }
 }
 
 // Josefin - 300, 400, 600, 700
-@mixin josefin($weight: 400){
-    font-family: $secondary-font;
-    font-weight: $weight;
-}
+@mixin josefin($weight: 400) {
+  font-family: $secondary-font;
+  font-weight: $weight;
+}
diff --git a/app/styles/base/_global.scss b/app/styles/base/_global.scss
@@ -1,37 +1,37 @@
 .container {
-    padding-top: spacing(4);
+  padding-top: spacing(4);
 }
 
 .keyline {
-    width: spacing(9);
-    margin: 8px 0 10px;
-    border-top: 1px solid $primary-color;
+  width: spacing(9);
+  margin: 8px 0 10px;
+  border-top: 1px solid $primary-color;
 }
 
 .pull-left {
-    float: left;
+  float: left;
 }
 
 .pull-right {
-    float: right;
+  float: right;
 }
 
 .clearfix {
-    @include clearfix();
+  @include clearfix();
 }
 
 .profile-pic {
-    margin-top: -5px;
-    margin-right: 18px;
+  margin-top: -5px;
+  margin-right: 18px;
 
-    img {
-        height: $profile-pic-size;
-        width: $profile-pic-size;
-        border-radius: 50%;
-        border: 2px solid $primary-color;
-    }
+  img {
+    height: $profile-pic-size;
+    width: $profile-pic-size;
+    border-radius: 50%;
+    border: 2px solid $primary-color;
+  }
 }
 
 .summary {
-    margin: spacing(1) 0 spacing(1);
-}
+  margin: spacing(1) 0 spacing(1);
+}
diff --git a/app/styles/components/_education.scss b/app/styles/components/_education.scss
@@ -1,11 +1,11 @@
 .education-container {
-    .location {
-        padding-bottom: 6px;
-        font-weight: 400;
-    }
-    .specialization {
-        text-transform: none;
-        font-style: italic;
-    }
-}
+  .location {
+    padding-bottom: 6px;
+    font-weight: 400;
+  }
 
+  .specialization {
+    text-transform: none;
+    font-style: italic;
+  }
+}
diff --git a/app/styles/components/_info-tag.scss b/app/styles/components/_info-tag.scss
@@ -1,40 +1,40 @@
 .info-tag-container {
-    margin-bottom: spacing(1);
+  margin-bottom: spacing(1);
 
-    .fa {
-        @include font-size(3.5);
-        width: 12px;
-        margin-right: spacing(1);
-        text-align: center;
-        vertical-align: middle;
+  .fa {
+    @include font-size(3.5);
+    width: 12px;
+    margin-right: spacing(1);
+    text-align: center;
+    vertical-align: middle;
 
-        &.fa-map-marker {
-            @include font-size(4);
-        }
-
-        &.fa-mobile {
-            @include font-size(4.5);
-        }
+    &.fa-map-marker {
+      @include font-size(4);
+    }
 
-        &.fa-envelope-o {
-            @include font-size(3);
-        }
+    &.fa-mobile {
+      @include font-size(4.5);
+    }
 
-        &.fa-desktop {
-            @include font-size(2.75);
-        }
+    &.fa-envelope-o {
+      @include font-size(3);
+    }
 
-        &.fa-external-link {
-            width: auto;
-            font-size: inherit;
-            vertical-align: text-top;
-        }
+    &.fa-desktop {
+      @include font-size(2.75);
     }
 
-    .info-text {
-        @include font-size(2.25);
-        display: inline-block;
-        vertical-align: middle;
-        width: $aside-width - $aside-margin - 1;
+    &.fa-external-link {
+      width: auto;
+      font-size: inherit;
+      vertical-align: text-top;
     }
-}
+  }
+
+  .info-text {
+    @include font-size(2.25);
+    display: inline-block;
+    vertical-align: middle;
+    width: $aside-width - $aside-margin - 1;
+  }
+}