Merge pull request #8 from ryanwiemer/progress

Progress Indicator
ryanwiemer · Aug 22, 2019 · 85e1279 · 85e1279
2 parents ede3c59 + 1854089
commit 85e1279
Show file tree

Hide file tree

Showing 19 changed files with 443 additions and 258 deletions.
diff --git a/README.md b/README.md
@@ -31,6 +31,7 @@ A Gatsby theme for artists, photographers and other creative folks.
 - Customizable theme colors and typography
 - SEO friendly component
 - Mobile menu
+- Optional scroll progress indicator
 - Styled components
 - Tags
 - Pagination
@@ -80,13 +81,15 @@ module.exports = {
 
 ### Theme Options
 
-| Key           | Default Value | Description                                                                                                                                      |
-| ------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
-| `basePath`    | `/`           | Root URL for all posts.                                                                                                                          |
-| `contentPath` | `/content`    | Location of markdown files used for the posts.                                                                                                   |  |
-| `transitions` | `true`        | Include simple page transitions powered with [framer-motion](https://github.com/framer/motion)                                                   |
-| `iconPath`    | default icon  | Path to the icon to be used for the favicon and web manifest. For example `'src/images/favicon.png'`. For best results provide a 512x512 square. |
-| `grid`        | `basic`       | Determines the type of grid used on the posts and tag templates. Two available options: `basic` and `list`.                                      |
+| Key                 | Default Value | Description                                                                                                                                      |
+| ------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
+| `basePath`          | `/`           | Root URL for all posts.                                                                                                                          |
+| `contentPath`       | `/content`    | Location of markdown files used for the posts.                                                                                                   |  |
+| `transitions`       | `true`        | Include simple page transitions powered with [framer-motion](https://github.com/framer/motion)                                                   |
+| `iconPath`          | default icon  | Path to the icon to be used for the favicon and web manifest. For example `'src/images/favicon.png'`. For best results provide a 512x512 square. |
+| `postsPerPage`      | `6`           | Determines the number of posts shown on each page. This effects both the posts and tag template.                                                 |
+| `grid`              | `basic`       | Determines the type of grid used on the posts and tag templates. Two available options: `basic` and `list`.                                      |
+| `progressIndicator` | `true`        | Include a progress indicator on the post template.                                                                                               |
 
 #### Example Usage
 

diff --git a/site/content/placeholder-example/index.md b/site/content/placeholder-example/index.md
@@ -11,3 +11,33 @@ Vestibulum quis est iaculis, euismod lacus sit amet, tincidunt ante. Duis conval
 Suspendisse potenti. Praesent a dolor dictum, pretium felis non, malesuada massa. Phasellus tincidunt ornare velit eu dictum. Cras ac felis eu nisl dictum sollicitudin sit amet in eros. Morbi massa turpis, condimentum id rutrum vel, ultricies quis sapien. Ut lacus neque, lacinia sed orci non, tristique facilisis ante. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut ac sem velit.
 
 Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
+
+Duis finibus porta posuere. Fusce tristique feugiat lacinia. Vivamus iaculis massa tortor, nec euismod dolor dapibus non. Suspendisse eu convallis nunc. Maecenas a aliquet nisi. Donec mattis viverra erat, non varius erat viverra vitae. Quisque porttitor, metus ut rutrum pharetra, nisi nisl feugiat lacus, id eleifend nulla nibh vel sapien. Donec et rutrum turpis. Proin efficitur, orci in cursus egestas, lacus sem interdum lectus, et semper tellus libero a elit. Duis blandit libero erat, ut tincidunt lacus tristique eget. Aliquam aliquam sapien libero, in vulputate lacus malesuada vitae. Curabitur eget ipsum in sem fringilla aliquam. Praesent ut sollicitudin nisi. Pellentesque rhoncus eu massa id blandit. Nam finibus pellentesque egestas. Vivamus fermentum faucibus purus nec scelerisque.
diff --git a/site/gatsby-config.js b/site/gatsby-config.js
@@ -41,7 +41,6 @@ module.exports = {
       resolve: 'gatsby-theme-amsterdam',
       options: {
         postsPerPage: 6,
-        grid: 'basic',
       },
     },
     {

diff --git a/site/package.json b/site/package.json
@@ -15,8 +15,8 @@
     "clean": "gatsby clean"
   },
   "dependencies": {
-    "gatsby": "^2.13.57",
-    "gatsby-plugin-google-analytics": "^2.1.7",
+    "gatsby": "^2.13.72",
+    "gatsby-plugin-google-analytics": "^2.1.8",
     "gatsby-theme-amsterdam": "*",
     "react": "^16.9.0",
     "react-dom": "^16.9.0"

diff --git a/site/src/pages/about.js b/site/src/pages/about.js
@@ -70,6 +70,7 @@ const AboutPage = ({ data }) => {
           <li>Customizable theme colors and typography</li>
           <li>SEO friendly component</li>
           <li>Mobile menu</li>
+          <li>Optional scroll progress indicator</li>
           <li>Styled components</li>
           <li>Tags</li>
           <li>Pagination</li>

diff --git a/site/src/pages/docs.js b/site/src/pages/docs.js
@@ -179,6 +179,20 @@ const DocsPage = ({ data }) => {
                 results provide a 512x512 square.
               </td>
             </tr>
+
+            <tr>
+              <td>
+                <code>postsPerPage</code>
+              </td>
+              <td align="left">
+                <code>6</code>
+              </td>
+              <td align="left">
+                Determines the number of posts shown on each page. This effects
+                both the posts and tag template.
+              </td>
+            </tr>
+
             <tr>
               <td>
                 <code>grid</code>
@@ -191,6 +205,18 @@ const DocsPage = ({ data }) => {
                 Two available options: <code>basic</code> and <code>list</code>.
               </td>
             </tr>
+
+            <tr>
+              <td>
+                <code>progressIndicator</code>
+              </td>
+              <td align="left">
+                <code>true</code>
+              </td>
+              <td align="left">
+                Include a progress indicator on the post template.
+              </td>
+            </tr>
           </tbody>
         </table>
         <h3>Example Usage</h3>