arco 0.1.1 → 0.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 860a024f04415c6e0d8650dbcd4cdb11413b5fdd0ae5097a1fd843d81c4bf92d
-  data.tar.gz: 245a865ff73a7b353aabd0cdb176a4d3191f82320f5d3843578dcfa8d3efbddd
+  metadata.gz: f309ed261570f257e221b24de154d9c7d9b0f2f443a73a25a88775ab4b83ef27
+  data.tar.gz: 871b1fcc3c148d04d37ccd2daee45430ec53c169cdf8cd4fcfbfe03e67d5a876
 SHA512:
-  metadata.gz: 984f567c79b653a1de26f90d8e81d32d68a7bd53361d899169bee115c45d992c39f2ad1b6fd9bd5d83b766e34fee25624628f2f9e96e51fbe3693420f6015e32
-  data.tar.gz: 3351f049130df6f552c283a1b3cc8e45342641ca54ebb39346a1207c7e139bf90eba472839c71d831e8e9fe5c490cd5ed7fb024ba21ede2f2f2ce7d32246516e
+  metadata.gz: 1174e51ab1b86d2c54ce1ca29cf2d2032a5249bcbb5f0bd133f894b1e4eca76b7d21c3df181a170e94773b4552c94ca202c7b8f839991df6c35db6e21803ccd4
+  data.tar.gz: 6a058386d888ec2ee6bc5f30deda5f863b662e66ab6165348fe03544d9e401c76b9153c41a801288196a432c3fad043b647efa54bd45ba1ee5e21c112516796e

data/README.md

@@ -0,0 +1,63 @@
+# arco
+
+Arco is a responsive fixed-sidebar layout with a two column masonry grid which also features a landing page, a 404 page and a simple permalink structure.
+
+## Installation
+
+Add this line to your Jekyll site's `Gemfile`:
+
+```ruby
+gem "arco"
+```
+
+And add this line to your Jekyll site's `_config.yml`:
+
+```yaml
+theme: arco
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install arco
+
+## Usage
+
+### Site configuration
+
+The following settings can be configured in your site's `_config.yml`
+
+```yaml
+title: Site title
+description: Site description
+image: /assets/image.png
+github_url: https://github.com/meebuhs
+resume: true | false
+```
+
+### Expected post frontmatter
+
+```
+---
+layout: post
+title: Post title
+summary: Post summary
+category: completed | ongoing
+permalink: /projects/post-title
+cover-image: /assets/image-for-front-page.png
+top-image: /assets/image-for-top-of-post.png 
+mathjax: true | false
+---
+```
+
+### Resume support
+
+To add a resume to the site, set `resume: true` in your `_config.yml`.
+Then create a folder called `_includes` at the root of your site and add your `resume.html` to it.
+
+## License
+
+The theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

data/_config.yml

@@ -1,2 +1,7 @@
+title: sitetitle
+description: sitedescription
+image: /assets/images/image.png
+github_url: https://github.com/meebuhs
+resume: true
 theme: arco
 highlighter: rouge

data/_includes/cover.html

@@ -1,9 +1,10 @@
 <section id="cover" class="cover"> 
     <div class="cover-text">
-      <h1><a href="{{ "/" | absolute_url }}">{{ site.title | default: site.github.repository_name }}</a></h1>
-      <h6>{{ site.description | default: site.github.project_tagline }}</h6>
+      {% if site.image %}<img class="site-image" src="{{ site.image }}" />{% endif %}
+      <h1>{{ site.title }}</a></h1>
+      <h6>{{ site.description }}</h6>
     </div>
     <div id="open-button-container" class="open-button-container">
-        <a href="/projects/" class="open-button">See my projects →</a>
+        <a href="/projects/" class="open-button">See my projects</a>
     </div>
 </section>

data/_includes/sidebar.html

@@ -1,8 +1,9 @@
 <section id="sidebar" class="sidebar"> 
     <svg id="sidebar-fader"></svg>
     <div class="sidebar-text">
-      <h1><a href="{{ "/projects/" | absolute_url }}" class="fade-onclick">{{ site.title | default: site.github.repository_name }}</a></h1>
-      <h6>{{ site.description | default: site.github.project_tagline }}</h6>
+        {% if site.image %}<img class="site-image" src="{{ site.image }}" />{% endif %}
+        <h1><a href="{{ "/projects/" }}" class="fade-onclick">{{ site.title }}</a></h1>
+        <h6>{{ site.description }}</h6>
     </div>
     <div class="sidebar-links">
         {% assign identifier = page.url | split: "/" | last %}
@@ -17,7 +18,6 @@
         {% else %}
             <a href="{{ "/projects/ongoing" }}" class="fade-onclick">ongoing</a>
         {% endif %}
-        / 
-        {% if site.github %}<a href="{{ site.github }}">github</a> {% endif %}{% if site.resume %} / <a href="{{ "/resume" }}" class="fade-onclick">resume</a> {% endif %}
+        {% if site.github_url %} / <a href="{{ site.github_url }}">github</a> {% endif %}{% if site.resume %} / <a href="{{ "/resume" }}" class="fade-onclick">resume</a> {% endif %}
     </div>
 </section>

data/_layouts/404.html

@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html lang="en-AU">
+  <head>
+    <meta charset="UTF-8">
+    <link rel="stylesheet" href="/assets/css/main.css">
+  </head>
+  <body>
+    {{ content }}
+  </body>
+</html>

data/_layouts/landing.html

@@ -7,5 +7,4 @@
   <body>
     {% include cover.html %}
   </body>
-  <script src="/assets/js/cover-transitions.js"></script>
 </html>

data/_sass/404.scss

@@ -0,0 +1,29 @@
+@import "constants";
+@import "fonts";
+
+.notfound-text {
+    h1 {
+        color: $primary-highlight;
+        margin: 0;
+    }
+    h6 {
+        text-transform: uppercase;
+        font-size: .9rem;
+        color: $text-colour-light;
+    }
+}
+
+.notfound {
+    height: 100%;
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    text-align: center;
+    justify-content: center;
+    top: 0;
+    position: fixed;
+    z-index: 9999;
+    background: $sidebar-colour;
+    color: $text-colour-light;
+    transition: all .25s ease;
+}

data/_sass/arco.scss

@@ -133,11 +133,15 @@ td, th {
   border-radius: 2px;
 }
 
-
 li, ul {
     line-height: 1.5em;
 }
 
+.site-image {
+  width: 200px;
+  border-radius: 50%;
+}
+
 .content {
     width: auto;
     height: auto;

data/_sass/cover.scss

@@ -3,10 +3,8 @@
 
 .cover-text {
     h1 {
+        color: $primary-highlight;
         margin: 0;
-        :hover {
-            color: lighten($primary-highlight, 14%);
-        }
     }
     h6 {
         text-transform: uppercase;
@@ -71,11 +69,6 @@
         display: flex;
         flex-direction: column;
     }
-
-    .slide {
-        height: $sidebar-height;
-        animation-name: slide-up;
-    }
 }
 
 /* horizontal layout */
@@ -85,29 +78,4 @@
         text-align: center;
         justify-content: center;
     }
-
-    .slide {
-        width: $sidebar-width;
-        animation-name: slide-left;
-    }
-}
-
-@keyframes slide-left {
-    from {
-        width: 100%;
-    }
-
-    to {
-        width: $sidebar-width;
-    }
-}
-
-@keyframes slide-up {
-    from {
-        height: 100%;
-    }
-
-    to {
-        height: $sidebar-height;
-    }
-}
+}

data/assets/css/main.scss

@@ -3,6 +3,7 @@
 
 @import "arco";
 @import "cover";
+@import "404";
 @import "sidebar";
 @import "footer";
 @import "post-list";

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: arco
 version: !ruby/object:Gem::Version
-  version: 0.1.1
+  version: 0.2.0
 platform: ruby
 authors:
 - meebuhs
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-06-26 00:00:00.000000000 Z
+date: 2020-06-27 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -26,22 +26,25 @@ dependencies:
         version: '4.1'
 description: 
 email:
-- alexeksharpe@gmail.com
+- meebuhs@gmail.com
 executables: []
 extensions: []
 extra_rdoc_files: []
 files:
 - LICENSE.txt
+- README.md
 - _config.yml
 - _includes/cover.html
 - _includes/footer.html
 - _includes/mathjax.html
 - _includes/sidebar.html
+- _layouts/404.html
 - _layouts/default.html
 - _layouts/landing.html
 - _layouts/post-list.html
 - _layouts/post.html
 - _layouts/resume.html
+- _sass/404.scss
 - _sass/arco.scss
 - _sass/constants.scss
 - _sass/cover.scss
@@ -65,7 +68,6 @@ files:
 - assets/fonts/roboto-mono/RobotoMono-BoldItalic.ttf
 - assets/fonts/roboto-mono/RobotoMono-Italic.ttf
 - assets/fonts/roboto-mono/RobotoMono-Regular.ttf
-- assets/js/cover-transitions.js
 - assets/js/fade-transitions.js
 - assets/js/post-grid-init.js
 - assets/js/sidebar.js

data/assets/js/cover-transitions.js

@@ -1,16 +0,0 @@
-document.addEventListener("DOMContentLoaded", function() {
-    let openButton = document.getElementsByClassName("open-button");
-    openButton[0].addEventListener("click", function(event) {
-        let cover = document.getElementById("cover"),
-            anchor = event.currentTarget;
-
-        let listener = function() {
-            window.location = anchor.href;
-            cover.removeEventListener("animationend", listener);
-        };
-        cover.addEventListener("animationend", listener);
-            
-        event.preventDefault();
-        cover.classList.add("slide");
-    });
-});