diff --git a/content/posts/a-post-with-a-cover.md b/content/posts/a-post-with-a-cover.md index 63fde9f..3c7eb20 100644 --- a/content/posts/a-post-with-a-cover.md +++ b/content/posts/a-post-with-a-cover.md @@ -11,7 +11,7 @@ description: "Markdown is intended to be as easy-to-read and easy-to-write as is Readability, however, is emphasized above all else. A Markdown-formatted document should be publishable as-is, as plain text, without looking -like it's been marked up with tags or formatting instructions. +like it's been marked up with tags or formatting instructions. While Markdown's syntax has been influenced by several existing text-to-HTML filters -- including [Setext](http://docutils.sourceforge.net/mirror/setext.html), [atx](http://www.aaronsw.com/2002/atx/), [Textile](http://textism.com/tools/textile/), [reStructuredText](http://docutils.sourceforge.net/rst.html), [Grutatext](http://www.triptico.com/software/grutatxt.html), and [EtText](http://ettext.taint.org/doc/) -- the single biggest source of diff --git a/content/posts/markdown-test-file.md b/content/posts/markdown-test-file.md index bf12e22..72d0475 100644 --- a/content/posts/markdown-test-file.md +++ b/content/posts/markdown-test-file.md @@ -62,7 +62,7 @@ wrap the text and put a `>` before every line: > This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, > consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. > Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus. -> +> > Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse > id sem consectetuer libero luctus adipiscing. @@ -89,12 +89,12 @@ Blockquotes can contain other Markdown elements, including headers, lists, and code blocks: > ## This is a header. -> +> > 1. This is the first list item. > 2. This is the second list item. -> +> > Here's some example code: -> +> > return shell_exec("echo $input | $markdown_script"); Any decent text editor should make email-style quoting easy. For diff --git a/content/posts/say-hello-to-gridsome.md b/content/posts/say-hello-to-gridsome.md index 2b57f85..9d21085 100644 --- a/content/posts/say-hello-to-gridsome.md +++ b/content/posts/say-hello-to-gridsome.md @@ -11,7 +11,7 @@ A new static site generator baby is born. It's highly inspired by Gatsby.js (Rea We think **Gridsome** is a missing piece to the Vue.js ecosystem. What Gatsby.js does for React.js is a game changer in how we build websites. React.js is excellent, but we think Vue.js is more approachable for most web designers and devs getting started with JAMstack. Gridsome is the Vue.js alternative to Gatsby. -With **Gridsome** you get a **universal GraphQL layer** for all your connected data sources. It's like a single source of truth for your website data ready to be used in any page or components. Connect to any CMS or APIs like Google Spreadsheet, Airtable, Instagram Feed, local markdown files, etc. +With **Gridsome** you get a **universal GraphQL layer** for all your connected data sources. It's like a single source of truth for your website data ready to be used in any page or components. Connect to any CMS or APIs like Google Spreadsheet, Airtable, Instagram Feed, local markdown files, etc. Here is an example on how to query posts from the GraphQL layer in a page: @@ -54,19 +54,19 @@ The GraphQL layer and all the data can be explored in a local GraphQL playground One of the main goals of Gridsome is to make a framework that let you build websites that are optimized "out-of-the-box." It follows the [PRPL-pattern by Google.](https://developers.google.com/web/fundamentals/performance/prpl-pattern/) You don't need to be a performance expert to make fast websites with Gridsome. Your site gets almost perfect scores on Google lighthouse out-of-the-box. These are some of the performance steps that Gridsome takes care of: -- Image compressing & lazy-loading ⚡️ -- CSS & JS minification ⚡️ -- Code-splitting ⚡️ -- HTML compressing ⚡️ -- Critical CSS (Plugin) ⚡️ -- Full PWA & Offline-support (plugin) ⚡️ +- Image compressing & lazy-loading ⚡️ +- CSS & JS minification ⚡️ +- Code-splitting ⚡️ +- HTML compressing ⚡️ +- Critical CSS (Plugin) ⚡️ +- Full PWA & Offline-support (plugin) ⚡️ #### A better way to build websites Gridsome is built for the JAMstack workflow - a new way to build websites that gives you better performance, higher security, cheaper hosting, and a better developer experience. Generate prerendered (static) pages at build time for SEO-purpose and add powerful dynamic functionality with APIs and Vue.js. -We believe the SSGs / JAMstack trend is just getting started. When you have first started to make websites this way there is no way back. You feel almost "dirty" when going back to a traditional WordPress / CMS setup. +We believe the SSGs / JAMstack trend is just getting started. When you have first started to make websites this way there is no way back. You feel almost "dirty" when going back to a traditional WordPress / CMS setup. Try running the new Chrome Lighthouse (Audit tab in Developer tools) on a WordPress site - It is impossible to get good scores even with the best caching plugins and hosting. With Gridsome you don't even need caching plugins. Website optimization is taken care of at build time. @@ -75,7 +75,7 @@ This is what we think is very exciting and is why we are building Gridsome. It i #### Whats next -In the next couple of months we're going to continue to improve the docs, create tutorials, add more source & transformer plugins and fix bugs. +In the next couple of months we're going to continue to improve the docs, create tutorials, add more source & transformer plugins and fix bugs. #### Contribute to Gridsome diff --git a/src/assets/style/_reset.scss b/src/assets/style/_reset.scss index af94440..cf3d1dd 100644 --- a/src/assets/style/_reset.scss +++ b/src/assets/style/_reset.scss @@ -1,4 +1,4 @@ -/* http://meyerweb.com/eric/tools/css/reset/ +/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ @@ -12,8 +12,8 @@ b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, -article, aside, canvas, details, embed, -figure, figcaption, footer, header, hgroup, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; @@ -24,7 +24,7 @@ time, mark, audio, video { vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ -article, aside, details, figcaption, figure, +article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } diff --git a/src/layouts/Default.vue b/src/layouts/Default.vue index 970fb9f..7d30bfc 100644 --- a/src/layouts/Default.vue +++ b/src/layouts/Default.vue @@ -3,10 +3,10 @@
- +
- -
+ +
diff --git a/src/main.js b/src/main.js index d90e270..73356d6 100644 --- a/src/main.js +++ b/src/main.js @@ -6,7 +6,7 @@ import DefaultLayout from '~/layouts/Default.vue' // The Client API can be used here. Learn more: gridsome.org/docs/client-api export default function (Vue, { router, head, isClient }) { - + // Set default layout as a global component Vue.component('Layout', DefaultLayout) } \ No newline at end of file