First pass at the design of the website

README.md

@@ -3,9 +3,11 @@
 
 ## License
 
-This project is licensed under either of
+This project is licensed under either of:
 
  * Apache License, Version 2.0, ([LICENSE-APACHE](LICENSE-APACHE) or
    http://www.apache.org/licenses/LICENSE-2.0)
  * MIT license ([LICENSE-MIT](LICENSE-MIT) or
    http://opensource.org/licenses/MIT)
+
+With the exception of the [Font Awesome](https://fontawesome.com) social icons, which are used under a [Creative Commons Attribution 4.0 International](https://creativecommons.org/licenses/by/4.0/) license.

_config.yml

@@ -1,8 +1,7 @@
 title: Rust Game Development Working Group
 #author: GitHub User
 #email: your-email@domain.com
-#description: > # this means to ignore newlines until "show_excerpts:"
-#  Stay up to date with the progress and recent developments in the Rust Game Development Working Group.
+description: Stay up to date with the progress and recent developments in the Rust Game Development Working Group.
 url: "https://rust-gamedev.github.io"
 show_excerpts: false # set to true to show excerpts on the homepage
 
@@ -12,10 +11,11 @@ minima:
   date_format: "%b %-d, %Y"
 
   # generate social links in footer
-  # social_links:
+  social_links:
     # twitter: jekyllrb
-    # github:  jekyll
-    # rss: rss
+    github: rust-gamedev
+    discord: j6QJsMd
+    rss: RSS
     # dribbble: jekyll
     # facebook: jekyll
     # flickr:   jekyll

_includes/footer.html

@@ -5,24 +5,23 @@
 
     <div class="footer-col-wrapper">
       <div class="footer-col one-half">
-      <h2 class="footer-heading">{{ site.title | escape }}</h2>
-        <ul class="contact-list">
-          <li class="p-name">
-            {%- if site.author -%}
-              {{ site.author | escape }}
-            {%- endif -%}
-            </li>
-            {%- if site.email -%}
-            <li><a class="u-email" href="mailto:{{ site.email }}">{{ site.email }}</a></li>
-            {%- endif -%}
-        </ul>
-      </div>
-
-      <div class="footer-col one-half">
+        <h2 class="footer-heading">{{ site.title | escape }}</h2>
+        {%- if site.author || site.email -%}
+          <ul class="contact-list">
+            <li class="p-name">
+              {%- if site.author -%}
+                {{ site.author | escape }}
+              {%- endif -%}
+              </li>
+              {%- if site.email -%}
+              <li><a class="u-email" href="mailto:{{ site.email }}">{{ site.email }}</a></li>
+              {%- endif -%}
+          </ul>
+        {%- endif -%}
         <p>{{- site.description | escape -}}</p>
       </div>
 
-      <div class="social-links">
+      <div class="footer-col one-half">
         {%- include social.html -%}
       </div>
     </div>

_includes/header.html

@@ -4,7 +4,10 @@
     {%- assign default_paths = site.pages | map: "path" -%}
     {%- assign page_paths = site.header_pages | default: default_paths -%}
     {%- assign titles_size = site.pages | map: 'title' | join: '' | size -%}
-    <a class="site-title" rel="author" href="{{ "/" | relative_url }}">{{ site.title | escape }}</a>
+    <a class="site-title" rel="author" href="{{ "/" | relative_url }}">
+      <img src="{{ '/assets/logo_small.png' | relative_url }}" width="48" height="48" alt="" />
+      {{ site.title | escape }}
+    </a>
 
     {%- if titles_size > 0 -%}
       <nav class="site-nav">

_includes/social.html

@@ -1,10 +1,10 @@
 {%- assign social = site.minima.social_links -%}
 
-<ul class="social-media-list">
+<ul class="social-links">
   {%- if social.dribbble -%}<li><a href="https://dribbble.com/{{ social.dribbble | cgi_escape | escape }}" title="{{ social.dribbble | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#dribbble' | relative_url }}"></use></svg></a></li>{%- endif -%}
   {%- if social.facebook -%}<li><a href="https://www.facebook.com/{{ social.facebook | cgi_escape | escape }}" title="{{ social.facebook | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#facebook' | relative_url }}"></use></svg></a></li>{%- endif -%}
   {%- if social.flickr -%}<li><a href="https://www.flickr.com/photos/{{ social.flickr | cgi_escape | escape }}" title="{{ social.flickr | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#flickr' | relative_url }}"></use></svg></a></li>{%- endif -%}
-  {%- if social.github -%}<li><a href="https://github.com/{{ social.github | cgi_escape | escape }}" title="{{ social.github | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#github' | relative_url }}"></use></svg></a></li>{%- endif -%}
+  {%- if social.github -%}<li><a href="https://github.com/{{ social.github | cgi_escape | escape }}" title="{{ social.github | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#github' | relative_url }}"></use></svg> Github (rust-gamedev)</a></li>{%- endif -%}
   {%- if social.instagram -%}<li><a href="https://www.instagram.com/{{ social.instagram | cgi_escape | escape }}" title="{{ social.instagram | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#instagram' | relative_url }}"></use></svg></a></li>{%- endif -%}
   {%- if social.linkedin -%}<li><a href="https://www.linkedin.com/in/{{ social.linkedin | cgi_escape | escape }}" title="{{ social.linkedin | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#linkedin' | relative_url }}"></use></svg></a></li>{%- endif -%}
   {%- if social.pinterest -%}<li><a href="https://www.pinterest.com/{{ social.pinterest | cgi_escape | escape }}" title="{{ social.pinterest | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#pinterest' | relative_url }}"></use></svg></a></li>{%- endif -%}
@@ -14,5 +14,6 @@
   {%- if social.youtube_channel -%}<li><a href="https://www.youtube.com/channel/{{ social.youtube_channel | cgi_escape | escape }}" title="{{ social.youtube_channel_name | escape | default: 'YouTube' }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#youtube' | relative_url }}"></use></svg></a></li>{%- endif -%}
   {%- if social.telegram -%}<li><a href="https://t.me/{{ social.telegram | cgi_escape | escape }}" title="{{ social.telegram | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#telegram' | relative_url }}"></use></svg></a></li>{%- endif -%}
   {%- if social.microdotblog -%}<li><a rel="me" href="https://micro.blog/{{ social.microdotblog | cgi_escape | escape }}" title="{{ social.microdotblog | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#microdotblog' | relative_url }}"></use></svg></a></li>{%- endif -%}
-  {%- if social.rss -%}<li><a href="{{ 'feed.xml' | relative_url }}" title="{{ social.rss | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#rss' | relative_url }}"></use></svg></a></li>{%- endif -%}
+  {%- if social.discord -%}<li><a href="https://discord.gg/{{ social.discord | cgi_escape | escape }}" title="Discord"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#discord' | relative_url }}"></use></svg> Discord (#wg-gamedev)</a></li>{%- endif -%}
+  {%- if social.rss -%}<li><a href="{{ 'feed.xml' | relative_url }}" title="{{ social.rss | escape }}"><svg class="svg-icon grey"><use xlink:href="{{ '/assets/minima-social-icons.svg#rss' | relative_url }}"></use></svg> RSS feed</a></li>{%- endif -%}
 </ul>

_layouts/default.html

@@ -8,9 +8,7 @@
     {%- include header.html -%}
 
     <main class="page-content" aria-label="Content">
-      <div class="wrapper">
-        {{ content }}
-      </div>
+      {{ content }}
     </main>
 
     {%- include footer.html -%}

_layouts/home.html

@@ -1,16 +1,33 @@
 ---
 layout: default
 ---
+{%- assign social = site.minima.social_links -%}
 
-<div class="home">
-  {%- if page.title -%}
-    <h1 class="page-heading">{{ page.title }}</h1>
-  {%- endif -%}
+<section class="intro">
+  <div class="wrapper">   
+    <p class="intro-icons" aria-hidden="true">
+      🦀 💖 🕹️
+    </p>
+    <p class="intro-lead">
+      Making Rust a first-class choice for game development
+    </p>
+    <p>
+      The Rust game development working group's goals are to improve the experience of using Rust to make games, and to make it accessible even if you're not an experienced engine/graphics developer.
+    </p>
+    <p>
+      Join us on
+      <a href="https://github.com/{{ social.github | cgi_escape | escape }}/wg"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#github' | relative_url }}"></use></svg> Github</a>
+      or
+      <a href="https://discord.gg/{{ social.discord | cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#discord' | relative_url }}"></use></svg> Discord</a>,
+      and help shape the future of game development in Rust!
+    </p>
+  </div>
+</section>
 
-  {{ content }}
+<div class="home wrapper">
+  <h2 class="post-list-heading">{{ page.list_title | default: "Latest News" }}</h2>
 
   {%- if site.posts.size > 0 -%}
-    <h2 class="post-list-heading">{{ page.list_title | default: "Posts" }}</h2>
     <ul class="post-list">
       {%- for post in site.posts -%}
       <li>
@@ -27,12 +44,12 @@ <h3>
       </li>
       {%- endfor -%}
     </ul>
-
-    <p class="feed-subscribe">
-      <a href="{{ 'feed.xml' | relative_url }}">
-        <svg class="svg-icon orange"><use xlink:href="{{ 'assets/minima-social-icons.svg#rss' | relative_url }}"></use></svg><span>Subscribe</span>
-      </a>
-    </p>
+  {%- else -%}
+    <p class="grey">None yet - stay tuned for updates and announcements!</p>
   {%- endif -%}
-
+  <p class="feed-subscribe">
+    <a href="{{ 'feed.xml' | relative_url }}">
+      <svg class="svg-icon orange"><use xlink:href="{{ 'assets/minima-social-icons.svg#rss' | relative_url }}"></use></svg><span>Subscribe</span>
+    </a>
+  </p>
 </div>

_layouts/page.html

@@ -1,7 +1,7 @@
 ---
 layout: default
 ---
-<article class="post">
+<article class="post wrapper">
 
   <header class="post-header">
     <h1 class="post-title">{{ page.title | escape }}</h1>

_layouts/post.html

@@ -1,7 +1,7 @@
 ---
 layout: default
 ---
-<article class="post h-entry" itemscope itemtype="http://schema.org/BlogPosting">
+<article class="post h-entry wrapper" itemscope itemtype="http://schema.org/BlogPosting">
 
   <header class="post-header">
     <h1 class="post-title p-name" itemprop="name headline">{{ page.title | escape }}</h1>

_sass/extra.scss

@@ -0,0 +1,39 @@
+.intro {
+    color: #ffffff;
+    background-color: #0074D9;
+    margin-top: -30px;
+    padding: 32px 0;
+    border-bottom: 1px solid #e8e8e8;
+    text-align: center;
+
+    .intro-icons {
+        font-size: 2em;
+    }
+
+    .intro-lead {
+        font-weight: bold;
+        font-size: 1.5em;
+    }
+
+    a {
+        color: white;
+        font-weight: bold;
+    }
+}
+
+.home {
+    margin-top: 32px;
+}
+
+.social-links {
+    list-style: none;
+    margin: 0;
+
+    li {
+        margin-bottom: 4px;
+
+        a {
+            color: $grey-color;
+        }
+    }
+}

assets/css/style.scss

@@ -2,4 +2,10 @@
 # Only the main Sass file needs front matter (the dashes are enough)
 ---
 
+// Some of the default colors do not meet the WCAG 2.0 accessibility
+// guidelines for contrast.
+$grey-color: #595959; 
+$brand-color: #1757AA;
+
 @import "minima";
+@import "extra";

index.md

@@ -7,5 +7,3 @@
 #
 layout: home
 ---
-
-Stay up to date with the news and progress related to the Rust Game Development Working Group.