Merge pull request #50 from royalfig/feature/ui

Feature/UI
royalfig · Apr 29, 2021 · 97a6ef8 · 97a6ef8
2 parents bb84b09 + 5d55337
commit 97a6ef8
Show file tree

Hide file tree

Showing 68 changed files with 922 additions and 595 deletions.
diff --git a/assets/built/app.css b/assets/built/app.css
diff --git a/assets/built/app.css.map b/assets/built/app.css.map
diff --git a/assets/built/app.js b/assets/built/app.js
diff --git a/assets/built/app.js.map b/assets/built/app.js.map
diff --git a/assets/built/critical.css b/assets/built/critical.css
diff --git a/assets/built/critical.css.map b/assets/built/critical.css.map
diff --git a/assets/built/post.css b/assets/built/post.css
diff --git a/assets/built/post.css.map b/assets/built/post.css.map
diff --git a/assets/built/post.js b/assets/built/post.js
diff --git a/assets/built/post.js.map b/assets/built/post.js.map
diff --git a/author.hbs b/author.hbs
@@ -5,59 +5,59 @@ into the {body} of the default.hbs template --}}
 {{#author}}
 
 {{!-- Post Header  --}}
-<header class="{{^if cover_image}}post__no-img--container">{{else}}post__img">
+<header class="{{^if cover_image}}sm-post__no-img--container">{{else}}sm-post__img">
     <img srcset="{{img_url cover_image size="s"}} 300w,
                  {{img_url cover_image size="m"}} 600w,
                  {{img_url cover_image size="l"}} 1000w,
                  {{img_url cover_image size="xl"}} 2000w" sizes="(min-width: 640px) 740px, 100vw"
         src="{{img_url cover_image size="l"}}" alt="{{title}}" height="340">
     {{/if}}
     {{^if cover_image}}
-    <div class="post__no-img"></div>
+    <div class="sm-post__no-img"></div>
     {{/if}}
 </header>
 
 {{!-- Main  --}}
-<main class="main" id="sm-main">
-    <div class="main__outer-container">
-        <div class="main__inner-container">
+<main class="sm-main" id="sm-main">
+    <div class="sm-main__outer-container">
+        <div class="sm-main__inner-container">
             <section class="{{slug}}">
 
-                <header class="author__header">
-                    <div class="inner-container--author">
-                        <div class="author__img-container">
+                <header class="sm-author__header">
+                    <div class="sm-inner-container--author">
+                        <div class="sm-author__img-container">
                             {{#if profile_image}}
-                            <img class="author__img" src="{{img_url profile_image size="m"}}" alt="{{name}}">
+                            <img class="sm-author__img" src="{{img_url profile_image size="m"}}" alt="{{name}}">
                             {{else}}
-                            <div class="author__no-img">
+                            <div class="sm-author__no-img">
                                 <svg>
                                     <use href="#user"/>
                                 </svg>
                             </div>
                             {{/if}}
                         </div>
-                        <div class="author__text">
-                            <div class="author__text-container">
-                                <h1 class="author__name">{{name}}</h1>
+                        <div class="sm-author__text">
+                            <div class="sm-author__text-container">
+                                <h1 class="sm-author__name">{{name}}</h1>
                             </div>
 
                             {{#if location}}
-                            <p class="small-header">Location</p>
-                            <div class="author__location map">
+                            <p class="sm-small-header">Location</p>
+                            <div class="sm-author__location map">
                                 <svg aria-hidden="true">
                                     <use href="#location"></use>
                                 </svg>
                                 <p>{{location}}</p>
                             </div>
                             {{/if}}
                             {{#if bio}}
-                            <p class="small-header">Bio</p>
-                            <p class="author__bio">{{bio}}</p>
+                            <p class="sm-small-header">Bio</p>
+                            <p class="sm-author__bio">{{bio}}</p>
                             {{/if}}
                             {{#has any="twitter, facebook, website"}}
-                            <p class="small-header">Social</p>
+                            <p class="sm-small-header">Social</p>
                             {{/has}}
-                            <div class="author__meta">
+                            <div class="sm-author__meta">
                                 {{#if twitter}}
                                 <a class="twitter" href="{{twitter_url}}" aria-label="Twitter">
                                     <svg>
@@ -66,7 +66,7 @@ into the {body} of the default.hbs template --}}
                                 </a>
                                 {{/if}}
                                 {{#if facebook}}
-                                <a class="facebook" href="{{facebook_url}}" aria-label="Facebook">
+                                <a class="sm-facebook" href="{{facebook_url}}" aria-label="Facebook">
                                     <svg>
                                         <use href="#facebook"></use>
                                     </svg>
@@ -87,17 +87,14 @@ into the {body} of the default.hbs template --}}
                 <h2>{{plural ../pagination.total empty='No Posts' singular='% Post' plural='% Posts'}}
                 </h2>
                 {{/author}}
-                <div class="grid-container grid-container-{{posts.length}}">
+                <div class="sm-grid-container sm-grid-container-{{posts.length}}">
                     {{#foreach posts}}
                     {{> "card"}}
                     {{/foreach}}
                 </div>
                 {{pagination}}
             </section>
 
-            {{#if @labs.subscribers}}
-            {{> "subscribe_inner"}}
-            {{/if}}
         </div>
     </div>
 </main>

diff --git a/default.hbs b/default.hbs
diff --git a/error-404.hbs b/error-404.hbs
@@ -8,37 +8,31 @@ It's a good idea to keep this template as minimal as possible in terms of both f
 into the {body} of the default.hbs template --}}
 
 {{!-- Post Header  --}}
-<header class="{{^if @site.cover_image}}post__no-img--container">{{else}}post__img">
+<header class="{{^if @site.cover_image}}sm-post__no-img--container">{{else}}post__img">
     <img srcset="{{img_url @site.cover_image size="s"}} 300w,
                  {{img_url @site.cover_image size="m"}} 600w,
                  {{img_url @site.cover_image size="l"}} 1000w,
                  {{img_url @site.cover_image size="xl"}} 2000w" sizes="(min-width: 640px) 740px, 100vw"
         src="{{img_url @site.cover_image size="l"}}" alt="{{title}}">
     {{/if}}
     {{^if @site.cover_image}}
-    <div class="post__no-img"></div>
+    <div class="sm-post__no-img"></div>
     {{/if}}
 </header>
 {{!-- Post Header  --}}
 
-<main class="main--error">
-    <div class="main__outer-container">
-        <div class="main__inner-container">
-            <header class="post__header">
-                <h1 class="main--error__heading">{{statusCode}}</h1>
-                <p class="main--error__text">{{message}}</p>
+<main class="sm-main--error">
+    <div class="sm-main__outer-container">
+        <div class="sm-main__inner-container">
+            <header class="sm-post__header">
+                <h1 class="sm-main--error__heading">{{statusCode}}</h1>
+                <p class="sm-main--error__text">{{message}}</p>
             </header>
-            <div class="divider">
-                <div class="divider__rule"></div>
-                <div class="divider__sm-block"></div>
-                <div class="divider__lg-block"></div>
-                <div class="divider__sm-block"></div>
-                <div class="divider__rule"></div>
-            </div>
+            <hr>
             {{#get "posts" limit="3" include="authors,tags"}}
             <section>
                 <h2>Recent Posts</h2>
-                <div class="grid-container">
+                <div class="sm-grid-container">
                     {{#foreach posts}}
                     {{> "card"}}
                     {{/foreach}}

diff --git a/home.hbs b/home.hbs
@@ -5,44 +5,44 @@ into the {body} of the default.hbs template --}}
 {{! Hero }}
 {{#if @site.cover_image}}
 <style>
-    .hero {
+    .sm-hero {
         background-image: url({{img_url @site.cover_image size='s'}});
     }
     @media(min-width: 300px) {
-        .hero {
+        .sm-hero {
             background-image: url({{img_url @site.cover_image size='m'}});
         }
     }
     @media(min-width: 740px) {
-        .hero {
+        .sm-hero {
             background-image: url({{img_url @site.cover_image size='l'}});
         }
     }
     @media(min-width: 1024px) {
-        .hero {
+        .sm-hero {
             background-image: url({{img_url @site.cover_image size='xl'}});
         }
     }
 </style>
 {{/if}}
-<header class="hero main__outer-container">
-    <div class="inner-container--hero">
-        <div class="hero__text-container">
-            <h1 class="hero__site-title">{{@site.title}}</h1>
-            <p class="hero__site-description">{{@site.description}}
+<header class="sm-hero sm-main__outer-container">
+    <div class="sm-inner-container--hero">
+        <div class="sm-hero__text-container">
+            <h1 class="sm-hero__site-title">{{@site.title}}</h1>
+            <p class="sm-hero__site-description">{{@site.description}}
             </p>
         </div>
     </div>
 </header>
 
-<main class="main" id="sm-main">
+<main class="sm-main" id="sm-main">
     {{!-- Featured  --}}
     {{#get "posts" include="tags" limit="3" filter="featured:true" as |featured|}}
         {{#if featured}}
-            <div class="main__outer-container">
-                <div class="main__inner-container">
-                    <h2 class="main__header">Featured</h2>
-                    <section class="grid-container grid-container-{{featured.length}}">
+            <div class="sm-main__outer-container">
+                <div class="sm-main__inner-container">
+                    <h2 class="sm-main__header">Featured</h2>
+                    <section class="sm-grid-container sm-grid-container-{{featured.length}}">
                         {{#foreach featured}}
                         {{> "card"}}
                         {{/foreach}}
@@ -55,12 +55,12 @@ into the {body} of the default.hbs template --}}
     {{!-- Latest --}}
     {{#get "posts" limit="5" include="tags" filter="featured:false+tag:-publications+tag:-presentations+tag:-outreach+tag:-teaching+tag:-dissertation" as |latest|}}
         {{#if latest}}
-            <div class="main__outer-container">
-                <div class="main__inner-container">
-                    <a class="main__read-more" href="/page/2/">
-                        <h2 class="main__header">Latest</h2>
+            <div class="sm-main__outer-container">
+                <div class="sm-main__inner-container">
+                    <a class="sm-main__read-more" href="/page/2/">
+                        <h2 class="sm-main__header">Latest</h2>
                     </a>
-                    <section class="grid-container grid-container-{{latest.length}}">
+                    <section class="sm-grid-container sm-grid-container-{{latest.length}}">
                         {{#foreach latest}}
                         {{> "card"}}
                         {{/foreach}}
@@ -73,12 +73,12 @@ into the {body} of the default.hbs template --}}
     {{!-- Publications --}}
     {{#get "posts" limit="5" include="tags" filter="featured:false+tag:publications" as |publications|}}
     {{#if publications}}
-    <div class="main__outer-container">
-        <div class="main__inner-container">
-            <a class="main__read-more" href="/tag/publications/">
-                <h2 class="main__header">Publications</h2>
+    <div class="sm-main__outer-container">
+        <div class="sm-main__inner-container">
+            <a class="sm-main__read-more" href="/tag/publications/">
+                <h2 class="sm-main__header">Publications</h2>
             </a>
-            <section class="grid-container grid-container-{{publications.length}}">
+            <section class="sm-grid-container sm-grid-container-{{publications.length}}">
                 {{#foreach publications}}
                 {{> "card"}}
                 {{/foreach}}
@@ -91,12 +91,12 @@ into the {body} of the default.hbs template --}}
     {{!-- Presentations --}}
     {{#get "posts" limit="5" include="tags" filter="featured:false+tag:presentations+tag:-publications" as |presentations|}}
     {{#if presentations}}
-    <div class="main__outer-container">
-        <div class="main__inner-container">
-            <a class="main__read-more" href="/tag/presentations/">
-                <h2 class="main__header">Presentations</h2>
+    <div class="sm-main__outer-container">
+        <div class="sm-main__inner-container">
+            <a class="sm-main__read-more" href="/tag/presentations/">
+                <h2 class="sm-main__header">Presentations</h2>
             </a>
-            <section class="grid-container grid-container-{{presentations.length}}">
+            <section class="sm-grid-container sm-grid-container-{{presentations.length}}">
                 {{#foreach presentations}}
                 {{> "card"}}
                 {{/foreach}}
@@ -109,12 +109,12 @@ into the {body} of the default.hbs template --}}
     {{!-- Teaching --}}
     {{#get "posts" limit="5" include="tags" filter="featured:false+tag:teaching+tag:-publications+tag:-presentations" as |teaching|}}
         {{#if teaching}}
-            <div class="main__outer-container">
-                <div class="main__inner-container">
-                    <a class="main__read-more" href="/tag/teaching/">
-                        <h2 class="main__header">Teaching</h2>
+            <div class="sm-main__outer-container">
+                <div class="sm-main__inner-container">
+                    <a class="sm-main__read-more" href="/tag/teaching/">
+                        <h2 class="sm-main__header">Teaching</h2>
                     </a>
-                    <section class="grid-container grid-container-{{teaching.length}}">
+                    <section class="sm-grid-container sm-grid-container-{{teaching.length}}">
                         {{#foreach teaching}}
                         {{> "card"}}
                         {{/foreach}}
@@ -127,12 +127,12 @@ into the {body} of the default.hbs template --}}
     {{!-- Outreach --}}
     {{#get "posts" limit="5" include="tags" filter="featured:false+tag:outreach+tag:-publications+tag:-presentations+tag:-teaching" as |outreach|}}
         {{#if outreach}}
-            <div class="main__outer-container">
-                <div class="main__inner-container">
-                    <a class="main__read-more" href="/tag/outreach/">
+            <div class="sm-main__outer-container">
+                <div class="sm-main__inner-container">
+                    <a class="sm-main__read-more" href="/tag/outreach/">
                         <h2 class="main__header">Outreach</h2>
                     </a>
-                    <section class="grid-container grid-container-{{outreach.length}}">
+                    <section class="sm-grid-container sm-grid-container-{{outreach.length}}">
                         {{#foreach outreach}}
                         {{> "card"}}
                         {{/foreach}}

diff --git a/index.hbs b/index.hbs
@@ -3,28 +3,28 @@
 into the {body} of the default.hbs template --}}
 
 {{!-- Post Header  --}}
-<header class="{{^if @site.cover_image}}post__no-img--container">{{else}}post__img">
+<header class="{{^if @site.cover_image}}sm-post__no-img--container">{{else}}post__img">
     <img srcset="{{img_url @site.cover_image size="s"}} 300w,
                  {{img_url @site.cover_image size="m"}} 600w,
                  {{img_url @site.cover_image size="l"}} 1000w,
                  {{img_url @site.cover_image size="xl"}} 2000w" sizes="100vw"
         src="{{img_url @site.cover_image size="xl"}}" alt="{{meta_title}}">
     {{/if}}
     {{^if @site.cover_image}}
-    <div class="post__no-img"></div>
+    <div class="sm-post__no-img"></div>
     {{/if}}
 </header>
 {{!-- Post Header  --}}
 
-<main class="main" id="main">
-    <div class="main__outer-container">
-        <div class="main__inner-container">
-            <header class="post__header">
-                <h1 class="post__title--serif">Latest
+<main class="sm-main" id="sm-main">
+    <div class="sm-main__outer-container">
+        <div class="sm-main__inner-container">
+            <header class="sm-post__header">
+                <h1 class="sm-post__title--serif">Latest
                     <span>{{plural pagination.page empty='' singular='' plural='%'}}</span></h1>
             </header>
 
-            <section class="grid-container">
+            <section class="sm-grid-container">
                 {{#foreach posts}}
                 {{> "card"}}
                 {{/foreach}}

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "smart",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "A customizable Ghost theme",
   "main": "index.js",
   "engines": {