bay_jekyll_theme 1.0.7 → 1.0.12

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 3e91fe54792daaea76b9b8eea7b92208ec895bad192d172fb2c725b46a55212c
-  data.tar.gz: c6f4d4f7b1c3e9e4257c1516abf35625fc51f218c97e11dfb142c5e01acde936
+  metadata.gz: 8b569c6203e2a1f7d8d731cbad82073cf5968c302c731e75de0522c43d168975
+  data.tar.gz: 9cb2b0bb20036436b5cacd3016b07ef0b5ea14333de25173dcfb1e5cbb42a853
 SHA512:
-  metadata.gz: 93835eb52a14af5bfc5f17b3283e937792ed268ed30b8c0e6fa0e6a82125ac13780a13fc9dd8e56f1d5a07c82e660444b4a04e5466bdb8c471202a8e1795f191
-  data.tar.gz: 3fed9acc9cb82711eccf1867fa2f4827c07576f4893459255db8e20435ea869aa86b1a067d5ae59e2422676b33f9302eeb4a7faf4c6aac8efa04b87b4b182ae9
+  metadata.gz: 98d0d2b1eeb1d6b5c8a9cfb945395f1fa2f34fa408c75853fc3c00c9a67f83b6dcce6ea70dced0393b7e5f3e975b3c089257c9f444ffc906d09d6c5bd1b4d761
+  data.tar.gz: 7c2f2db01ebf0381b2e45fe2db0e7739a9205c61fb4d862d66f1ac5a62952a1bfa7902e0f44bdb3503c9aa45f410f7a0a6ce68ef344298cfb37da439b4bc9b9c

data/LICENSE.md

@@ -0,0 +1,15 @@
+ISC License
+
+Copyright (c) 2019, Eliott Vincent
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

data/README.md

@@ -1,2 +1,132 @@
 # bay
-A simple theme for Jekyll. Inspired by http://dangrover.com/
+
+Bay is a simple theme for Jekyll. [[view live]](https://eliottvincent.github.io/bay)
+
+Inspired by [dangrover.com](http://dangrover.com/). Current theme used at [eliottvincent.com](http://eliottvincent.com/).
+
+![](/screenshot.png)
+
+### Installation
+
+Create a new Jekyll website:
+```
+jekyll new mysite
+```
+
+Open `Gemfile` and replace the line:
+```
+gem "minima"
+```
+with:
+```
+gem "bay_jekyll_theme"
+```
+
+Open `_config.yml` and replace the line:
+```
+theme: minima
+```
+with:
+```
+theme: bay_jekyll_theme
+```
+
+Finally, install the dependencies:
+```
+bundle install
+```
+
+and build the website!
+```
+jekyll serve
+```
+
+
+The website will look somewhat empty at first. That's normal. Follow the next instructions to complete the header and footer components, and the home and blog pages.
+
+### Header
+Open the `_config.yml` file and add the following:
+```yml
+header:
+  pages:
+    - name: Home
+      slug: /     # <-- index.md
+    - name: Blog  # <-- blog.md
+    - name: Whatever  # <-- whatever.md
+```
+Re-run `jekyll serve` to see the header updated.
+
+### Footer
+Open the `_config.yml` file and add the following:
+```yml
+footer:
+  show_powered_by: true
+  contact:
+    - name: Email
+      value: yourmail@domain.com
+      link: mailto:yourmail@domain.com
+    - name: WeChat
+      value: YourWeChatUsername
+      link: "#"
+  follow:
+    - name: Twitter
+      link: http://twitter.com/YourTwitterUsername
+      username: "@YourTwitterUsername"
+    - name: Facebook
+      link: http://facebook.com/YourFacebookUsername
+    - name: LinkedIn
+      link: http://linkedin.com/in/YourLinkedInUsername
+    - name: GitHub
+      link: http://github.com/YourGitHubUsername
+    - name: Weibo
+      link: http://weibo.com/u/YourWeiboUsername
+```
+Re-run `jekyll serve` to see the footer updated.
+
+### Home page
+Create (or edit) the `index.markdown` file and add the following:
+```yml
+---
+layout: home
+profile_picture:
+  src: /assets/img/profile-pic.jpg
+  alt: website picture
+---
+
+<p>
+  Welcome to mysite!
+</p>
+```
+
+### Blog page
+Create `blog.markdown` file and add the following:
+```yml
+---
+layout: blog
+title: Blog
+slug: /blog
+---
+
+This is an example of a "Blog" page, displaying a list of posts.
+<br />
+```
+
+
+Your website is ready!
+
+
+### Development
+
+#### Run development instance (with hot-reload)
+```sh
+bundle exec jekyll serve
+```
+
+#### Build and publish the gem
+```sh
+gem build bay_jekyll_theme.gemspec
+```
+
+```sh
+gem push bay_jekyll_theme-1.x.x.gem
+```

data/_includes/foot.html

@@ -1,3 +1,3 @@
-<script type="text/javascript" src="/assets/js/vendor/retina-1.3.0.min.js"></script>
-<script type="text/javascript" src="/assets/js/vendor/cash-4.1.5.min.js"></script>
-<script type="text/javascript" src="/assets/js/site.js?{{ site.version }}"></script>
+<script type="text/javascript" src="{{ "/assets/js/vendor/retina-1.3.0.min.js" | absolute_url }}"></script>
+<script type="text/javascript" src="{{ "/assets/js/vendor/cash-4.1.5.min.js" | absolute_url }}"></script>
+<script type="text/javascript" src="{{ "/assets/js/site.js" | absolute_url }}"></script>

data/_includes/footer.html

@@ -5,8 +5,10 @@
         <h4>CONTACT</h4>
 
         {% for contact in site.footer.contact %}
+
+          {% assign contact_icon_path = "/assets/img/icons/" | append: contact.name | downcase | append: ".png" | absolute_url %}
           <img
-            src="/assets/img/icons/{{ contact.name | downcase }}.png"
+            src="{{ contact_icon_path }}"
             alt="{{ contact.name | downcase }}"
           />
           <a href="{{ contact.link }}" id="{{ contact.name | downcase }}-link">
@@ -26,8 +28,10 @@
 
         {% for follow in site.footer.follow %}
           <span class="wrap-link">
+
+            {% assign follow_icon_path = "/assets/img/icons/" | append: follow.name | downcase | append: ".png" | absolute_url %}
             <img
-              src="/assets/img/icons/{{ follow.name | downcase }}.png"
+              src="{{ follow_icon_path }}"
               alt="{{ follow.name | downcase }}"
             />
             <a href="{{ follow.link }}">
@@ -49,7 +53,7 @@
       {% if site.footer.show_powered_by == true %}
         <div class="footer-col footer-col-3 powered-by">
           <p>
-            powered by <a href="https://github.com/eliottvincent/bay">Bay</a> | 2019
+            powered by <a href="https://github.com/eliottvincent/bay">Bay</a> | {{ 'now' | date: "%Y" }}
           </p>
         </div>
       {% endif %}

data/_includes/head.html

@@ -60,9 +60,9 @@
     <meta property="twitter:site" content="{{ twitter_username }}"/>
   {% endif %}
 
-  <link rel="stylesheet" href="/assets/css/main.css?v={{ site.version }}"/>
+  <link rel="stylesheet" href="{{ "/assets/css/main.css" | absolute_url }}"/>
   <link rel="canonical" href="{{ page_url }}"/>
-  <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/>
+  <link rel="shortcut icon" href="{{ "/favicon.ico" | absolute_url }}" type="image/x-icon"/>
 
   <!-- Google Analytics -->
   <script>

data/_includes/header.html

@@ -1,20 +1,20 @@
 <header class="site-header">
   <div class="wrapper">
-    <a class="site-title" href="{{ site.baseurl }}/">
-      <img src="/assets/img/title.png" alt="{{ site.title }}" />
+    <a class="site-title" href="{{ "" | prepend: site.baseurl | prepend: site.url }}/">
+      <img src="{{ "/assets/img/title.png" | absolute_url }}" alt="{{ site.title }}" />
     </a>
 
     <nav class="site-nav">
       <a href="#" class="menu-icon"></a>
 
-      <div class="trigger">
+      <div class="menu">
         {% for page in site.header.pages %}
           {% if page.slug and page.slug != "" and page.slug != nil %}
             {% assign page_link = page.slug %}
           {% else %}
-            {% assign page_link = "/" | append: page.name | downcase | append: "/" %}
+            {% assign page_link = "/" | append: page.name | downcase %}
           {% endif %}
-          {% assign page_link = page_link | prepend: site.baseurl | prepend: site.url %}
+          {% assign page_link = page_link | absolute_url %}
           <a class="page-link" href="{{ page_link }}">
             {{ page.name }}
           </a>

data/_includes/wechat-widget.html

@@ -1,12 +1,16 @@
-<div id="wechat-widget">
-  <p>
-    {% for contact in site.footer.contact %}
-      {% if contact.name == 'WeChat' %}
-        Find me on WeChat with the ID <strong>{{ contact.value }}</strong>,
-        {% break %}
-      {% endif %}
-    {% endfor %}
-    or scan my QR code:
-  </p>
-  <img src="/assets/img/wechat-qr-code.png" alt="QR code" id="qr-code" />
-</div>
+{% for contact in site.footer.contact %}
+  {% if contact.name == 'WeChat' %}
+    {% assign wechat_username = contact.value %}
+    {% break %}
+  {% endif %}
+{% endfor %}
+
+{% if wechat_username %}
+  <div id="wechat-widget">
+    <p>
+      Find me on WeChat with the ID <strong>{{ wechat_username }}</strong>, or scan my QR code:
+    </p>
+
+    <img src="{{ "/assets/img/wechat-qr-code.png" | absolute_url }}" alt="QR code" id="qr-code" />
+  </div>
+{% endif %}

data/_layouts/home.html

@@ -9,7 +9,7 @@
       <div class="wrapper">
         <div class="home">
           <img
-            src="{{ page.profile_picture.src }}"
+            src="{{ page.profile_picture.src | absolute_url }}"
             alt="{{ page.profile_picture.alt }}"
             class="profilepic"
           />

data/_layouts/work.html

@@ -12,16 +12,18 @@
           {{ content }}
 
           {% for item in page.items %}
-          <p class="work-item">
+          <div class="work-item">
             <img
-              src="{{ item.image.src }}"
+              src="{{ item.image.src | absolute_url }}"
               alt="{{ item.image.alt }}"
               class="work-bubble"
             />
-            <strong>{{ item.title }}</strong>
-            &mdash;
-            {{ item.description }}
-          </p>
+            <span class="work-text">
+              <strong>{{ item.title }}</strong>
+              &mdash;
+              {{ item.description }}
+            </span>
+          </div>
           {% endfor %}
         </div>
       </div>

data/_sass/_base.scss

@@ -113,7 +113,7 @@ h4 {
 a {
   color: $brand-color;
   text-decoration: none;
-  // 
+  //
   // &:visited {
   //   color: darken($brand-color, 15%);
   // }

data/_sass/_blog.scss

@@ -5,7 +5,7 @@
     display: block;
     float: left;
 
-    @include media-query($on-palm) {
+    @include media-query($on-mobile) {
       display: block;
       float: none;
       color: #333;

data/_sass/_layout.scss

@@ -8,7 +8,7 @@
   padding-top: 10px;
   padding-bottom: 10px;
 
-  @include media-query($on-palm) {
+  @include media-query($on-mobile) {
     padding-top: 0;
     padding-bottom: 0;
   }
@@ -34,6 +34,7 @@
  * Site nav
  */
 .site-nav {
+  z-index: 10;
   float: right;
   line-height: 56px;
 
@@ -51,7 +52,7 @@
     }
   }
 
-  @include media-query($on-palm) {
+  @include media-query($on-mobile) {
     position: absolute;
     top: 12px;
     right: 24px;
@@ -69,20 +70,15 @@
       padding-top: 4px;
       text-align: center;
 
-      background: #ffffff url(/assets/img/menu.png) 6px 4px no-repeat;
+      background: #ffffff url($base-url + '/assets/img/menu.png') 6px 4px no-repeat;
     }
 
-    .trigger {
+    .menu {
       clear: both;
       display: none;
       background-color: #ffffff;
       min-width: 10em;
-    }
-
-    &:hover .trigger {
-      display: block;
       padding-bottom: 5px;
-      background-color: #ffffff;
     }
 
     .page-link {
@@ -100,7 +96,7 @@
   border-top: 1px solid $grey-color-light;
   padding: $spacing-unit 0;
 
-  @include media-query($on-palm) {
+  @include media-query($on-mobile) {
     padding-top: 10px;
   }
 }
@@ -141,7 +137,7 @@
   color: $grey-color;
 }
 
-@include media-query($on-palm) {
+@include media-query($on-mobile) {
   .footer-col {
     float: none;
     width: 100%;

data/_sass/_post.scss

@@ -9,7 +9,7 @@
 
   font-family: $base-font-family;
 
-  @include media-query($on-palm) {
+  @include media-query($on-mobile) {
     font-size: 34px;
   }
 }
@@ -24,7 +24,7 @@
   position: relative;
   top: -0.3em;
 
-  @include media-query($on-palm) {
+  @include media-query($on-mobile) {
     font-size: 24px;
   }
 }
@@ -40,7 +40,7 @@
   h2 {
     font-size: 32px;
 
-    @include media-query($on-palm) {
+    @include media-query($on-mobile) {
       font-size: 28px;
     }
   }
@@ -48,7 +48,7 @@
   h3 {
     font-size: 26px;
 
-    @include media-query($on-palm) {
+    @include media-query($on-mobile) {
       font-size: 22px;
     }
   }
@@ -56,7 +56,7 @@
   h4 {
     font-size: 20px;
 
-    @include media-query($on-palm) {
+    @include media-query($on-mobile) {
       font-size: 18px;
     }
   }

data/_sass/_site.scss

@@ -3,7 +3,7 @@
   border: #ccc 1px solid;
   margin-left: 20px;
 
-  @include media-query($on-palm) {
+  @include media-query($on-mobile) {
     float: none;
     margin-bottom: 20px;
     margin-left: 0px;
@@ -14,7 +14,7 @@
   font-size: 12px;
   line-height: 30px;
 
-  @include media-query($on-palm) {
+  @include media-query($on-mobile) {
     font-size: 14px;
     line-height: 38px;
   }

data/_sass/_work.scss

@@ -1,11 +1,12 @@
+.work-item {
+  clear: both;
+  overflow: hidden;
+  padding-bottom: 3em;
+}
+
 .work-bubble {
   float: left;
   padding-right: 20px;
   width: 100px;
   height: 100px;
 }
-
-.work-item {
-  clear: both;
-  padding-bottom: 3em;
-}

data/assets/css/main.scss

@@ -5,6 +5,8 @@
 @charset "utf-8";
 
 // Our variables
+$base-url: "{{ site.baseurl }}";
+
 $base-font-family: Charter, Georgia, Helvetica, Arial, sans-serif;
 $base-font-size: 14px;
 $small-font-size: $base-font-size * 0.875;
@@ -20,7 +22,7 @@ $grey-color: #828282;
 $grey-color-light: lighten($grey-color, 40%);
 $grey-color-dark: darken($grey-color, 25%);
 
-$on-palm: 500px;
+$on-mobile: 500px;
 $on-laptop: 800px;
 
 @mixin media-query($device) {

data/assets/js/site.js

@@ -1,11 +1,28 @@
+/**
+ * Menu
+ */
+ $("a.menu-icon").on("click", function(event) {
+   var w = $(".menu");
+
+   w.css({
+     display: w.css("display") === "none"
+      ? "block"
+      : "none"
+   });
+ });
+
+/**
+ * Wechat widget
+ */
 function moveWidget(event) {
-  var w = $("#wechat-widget");
-  w.css({ left: event.pageX - 25, top: event.pageY - w.height() - 60 });
+  $("#wechat-widget").css({
+    left: event.pageX - 25,
+    top: event.pageY - w.height() - 60
+  });
 }
 
 $("a#wechat-link").on("mouseenter", function(event) {
-  var w = $("#wechat-widget");
-  w.css({ display: "block" });
+  $("#wechat-widget").css({ display: "block" });
   moveWidget(event);
 });
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: bay_jekyll_theme
 version: !ruby/object:Gem::Version
-  version: 1.0.7
+  version: 1.0.12
 platform: ruby
 authors:
 - Eliott Vincent
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-10-27 00:00:00.000000000 Z
+date: 2020-08-05 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -45,6 +45,7 @@ executables: []
 extensions: []
 extra_rdoc_files: []
 files:
+- LICENSE.md
 - README.md
 - _includes/draft-banner.html
 - _includes/foot.html
@@ -92,6 +93,7 @@ files:
 - assets/img/title.png
 - assets/img/title@2x.png
 - assets/img/wechat-qr-code.png
+- assets/img/wechat-qr-code@2x.png
 - assets/img/work/sand.png
 - assets/img/work/sand@2x.png
 - assets/img/work/water.png