bulmatown 1.0.0

data/example/frontend/javascript/index.js

@@ -0,0 +1,4 @@
+import "../styles/index.scss"
+import Bulmatown from "bulmatown"
+
+console.info("Bridgetown is loaded!")

data/example/frontend/styles/index.scss

@@ -0,0 +1,5 @@
+//$text: #444;
+
+//$theme_variation: rust;
+
+@import "~bulmatown/frontend/styles"

data/example/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "new-bridgetown-site",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "build": "bundle exec bridgetown build",
+    "serve": "bundle exec bridgetown serve",
+    "webpack-build": "webpack --mode production",
+    "webpack-dev": "webpack --mode development -w",
+    "deploy": "yarn webpack-build && yarn build",
+    "sync": "node sync.js",
+    "start": "node start.js"
+  },
+  "dependencies": {
+    "bridgetown-quick-search": "1.0.3",
+    "bulmatown": "../../bulmatown"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.9.0",
+    "@babel/plugin-proposal-class-properties": "^7.8.3",
+    "@babel/plugin-proposal-decorators": "^7.10.1",
+    "@babel/plugin-transform-runtime": "^7.9.0",
+    "@babel/preset-env": "^7.9.0",
+    "babel-loader": "^8.1.0",
+    "browser-sync": "^2.26.7",
+    "concurrently": "^5.2.0",
+    "css-loader": "^3.4.2",
+    "file-loader": "^6.0.0",
+    "mini-css-extract-plugin": "^0.9.0",
+    "node-sass": "^4.13.1",
+    "sass-loader": "^8.0.2",
+    "style-loader": "^1.1.3",
+    "webpack": "^4.42.1",
+    "webpack-cli": "^3.3.11",
+    "webpack-manifest-plugin": "^2.2.0"
+  }
+}

data/example/plugins/site_builder.rb

@@ -0,0 +1,4 @@
+class SiteBuilder < Bridgetown::Builder
+  # write builders which subclass SiteBuilder in plugins/builder
+end
+

data/example/src/404.html

@@ -0,0 +1,9 @@
+---
+permalink: /404.html
+layout: default
+---
+
+<h1>404</h1>
+
+<p><strong>Page not found :(</strong></p>
+<p>The requested page could not be found.</p>

data/example/src/_components/footer.liquid

@@ -0,0 +1,53 @@
+<footer class="footer">
+  <div class="container">
+    <div class="columns">
+      <div class="column is-5">
+        <div class="logo">
+          {{ metadata.title}}
+        </div>
+
+        <h4>
+          {{ metadata.tagline }}
+        </h4>
+
+        <div class="mt-3">
+          Follow on Twitter: <strong><a href="https://twitter.com/{{ metadata.twitter }}">@{{ metadata.twitter }}</strong></a>
+        </div>
+
+        <div class="mt-6 is-size-7">
+          Website content licensed <a rel="license" href="https://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">CC BY-NC-SA 4.0</a>
+        </div>
+
+      </div>
+      <div class="column is-4">
+        <h4>
+          Other <strong>Resources</strong>
+        </h4>
+
+        <div class="mt-5">
+          <a href="https://wikipedia.org">Wikipedia</a><br/>
+          <a href="https://archive.org/web/">Wayback Machine</a>
+        </div>
+      </div>
+      <div class="column is-3">
+        <h4>
+          <strong>Share</strong> on Social Media
+        </h4>
+
+        <div class="mt-5">
+          <a href="https://twitter.com/intent/tweet?url={{ url | uri_escape }}&via={{ metadata.twitter }}&text=Check%20out%20this%20awesome%20new%20site%20built%20with%20Bridgetown%20and%20Ruby%21&hashtags=SpinUpBridgetown%2CJamstack" class="button is-info">
+            <span class="icon"> <i class="fa fa-twitter is-size-5"></i> </span>
+            <span class="has-text-weight-bold">Tweet</span>
+          </a>
+        </div>
+
+        <div class="mt-6">
+          <a href="/feed.xml" class="button is-danger is-small">
+            <span class="icon"> <i class="fa fa-rss"></i> </span>
+            <span class="has-text-weight-bold">News Feed</span>
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+</footer>

data/example/src/_components/head.liquid

@@ -0,0 +1,9 @@
+<meta charset="utf-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+{% capture page_title %}{{ title | strip_html | strip_newlines }}{% endcapture %}
+<title>{% if page_title != "" %}{{ page_title | escape }} | {{ metadata.title | escape }}{% else %}{{ metadata.title | escape }}: {{ metadata.tagline | escape }}{% endif %}</title>
+
+<meta name="description" content="{{ metadata.description }}" />
+
+<link rel="stylesheet" href="{% webpack_path css %}" />
+<script src="{% webpack_path js %}" defer></script>

data/example/src/_components/navbar.liquid

@@ -0,0 +1,51 @@
+{% rendercontent "bulmatown/navbar", class: "is-dark" %}
+  {% with logo %}
+    <a class="navbar-item" href="/">
+      {{ metadata.title }}
+    </a>
+  {% endwith %}
+  {% with items_start %}
+    <a class="navbar-item" href="/">Home</a>
+    <a class="navbar-item" href="/posts">Articles</a>
+    <a class="navbar-item" href="/about">About</a>
+    <div class="navbar-item has-dropdown is-hoverable">
+      <a class="navbar-link" href="/topics">
+        Topics
+      </a>
+      <div class="navbar-dropdown is-boxed">
+        <a class="navbar-item" href="https://bulma.io/documentation/overview/start/">
+          Overview
+        </a>
+        <a class="navbar-item" href="https://bulma.io/documentation/overview/modifiers/">
+          Modifiers
+        </a>
+        <a class="navbar-item" href="https://bulma.io/documentation/columns/basics/">
+          Columns
+        </a>
+        <a class="navbar-item" href="https://bulma.io/documentation/layout/container/">
+          Layout
+        </a>
+        <a class="navbar-item" href="https://bulma.io/documentation/form/general/">
+          Form
+        </a>
+        <hr class="navbar-divider">
+        <a class="navbar-item" href="https://bulma.io/documentation/elements/box/">
+          Elements
+        </a>
+        <a class="navbar-item" href="https://bulma.io/documentation/components/breadcrumb/">
+          Components
+        </a>
+      </div>
+    </div>
+  {% endwith %}
+
+  {% with items_end %}
+    <div class="navbar-item search-item">
+      {% render "bridgetown_quick_search/search", placeholder: "Search", input_class: "input" %}
+    </div>
+    <a class="navbar-item is-hidden-desktop-only" href="https://twitter.com/{{ metadata.twitter }}" target="_blank">
+      <span class="icon"><i class="fa fa-twitter is-size-6"></i></span>
+      <span class="is-hidden-tablet">Twitter</span>
+    </a>
+  {% endwith %}
+{% endrendercontent %}

data/example/src/_data/authors.yml

@@ -0,0 +1,5 @@
+jared:
+  name: Jared White
+  avatar: /images/jared-white-avatar.jpg
+  twitter: jaredcwhite
+  website: https://jaredwhite.com

data/example/src/_data/site_metadata.yml

@@ -0,0 +1,18 @@
+# Site settings
+# These are used to personalize your new site. If you look in the HTML files,
+# you will see them accessed via {{ site.metadata.title }}, {{ site.metadata.email }}, and so on.
+# You can create any custom variable you would like, and they will be accessible
+# in the templates via {{ site.metadata.myvariable }}.
+
+title: Your awesome title
+tagline: This site is totally awesome
+email: your-email@example.com
+description: >- # this means to ignore newlines until "baseurl:"
+  Write an awesome description for your new site here. It will appear in your document head meta (for Google search results) and in your feed.xml site description.
+
+twitter: jaredcwhite
+
+bulmatown_theme:
+  image_sizes:
+    embed: image
+    hero: image_hero

data/example/src/_layouts/default.html

@@ -0,0 +1,15 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    {% render "head", metadata: site.metadata, title: page.title %}
+  </head>
+  <body class="{{ page.layout }} {{ page.page_class }}">
+    {% render "navbar", metadata: site.metadata %}
+
+    <main>
+      {{ content }}
+    </main>
+
+    {% render "footer", url: site.url, metadata: site.metadata %}
+  </body>
+</html>

data/example/src/_layouts/home.html

@@ -0,0 +1,5 @@
+---
+layout: bulmatown/homepage
+---
+
+{{ content }}

data/example/src/_layouts/page.html

@@ -0,0 +1,5 @@
+---
+layout: bulmatown/page
+---
+
+{{ content }}

data/example/src/_layouts/post.html

@@ -0,0 +1,5 @@
+---
+layout: bulmatown/post
+---
+
+{{ content }}

data/example/src/_posts/2020-06-13-this-is-groovy.md

@@ -0,0 +1,29 @@
+---
+layout: post
+title:  This is Groovy
+subtitle: Take a look at the source for this post to get an idea about how it works.
+image: https://res.cloudinary.com/mariposta/image/upload/w_1800,c_limit,q_65/EEF14FD7-4409-419C-B4CF-DE4934C67F1A_eexxp7.jpg
+image_hero: https://res.cloudinary.com/mariposta/image/upload/w_2048,c_limit,q_65/EEF14FD7-4409-419C-B4CF-DE4934C67F1A_eexxp7.jpg
+rainbow_hero: true
+author: jared
+---
+
+You’ll find this post in your `_posts` directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run `bridgetown serve`, which launches a web server and auto-regenerates your site when a file is updated.
+
+Bridgetown requires blog post files to be named according to the following format:
+
+`YEAR-MONTH-DAY-title.EXT`
+
+Where `YEAR` is a four-digit number, `MONTH` and `DAY` are both two-digit numbers, and `EXT` is the file extension representing the format used in the file (for example, `md` for Markdown). After that, include the necessary front matter. Take a look at the source for this post to get an idea about how it works.
+
+Bridgetown also offers powerful support for code snippets:
+
+```ruby
+def print_hi(name)
+  puts "Hi, #{name}"
+end
+print_hi('Tom')
+#=> prints 'Hi, Tom' to STDOUT.
+````
+
+Check out the [Bridgetown docs](https://bridgetownrb.com/docs/) for more info on how to get the most out of Bridgetown. File all bugs/feature requests at [Bridgetown’s GitHub repo](https://github.com/bridgetownrb/bridgetown). If you have questions, you can ask them on [Bridgetown Community Forum](https://community.bridgetownrb.com).

data/example/src/_posts/2020-06-13-welcome-to-bridgetown.md

@@ -0,0 +1,30 @@
+---
+layout: post
+title:  "Your First Post on Bridgetown"
+subtitle: You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes!
+date:   2020-06-13 08:39:40 -0700
+categories: updates
+image: https://res.cloudinary.com/mariposta/image/upload/w_1800,c_limit,q_65/IMG_5232_srqhvl.jpg
+image_hero: https://res.cloudinary.com/mariposta/image/upload/w_2048,c_limit,q_65/IMG_5232_srqhvl.jpg
+author: jared
+---
+
+You’ll find this post in your `_posts` directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run `bridgetown serve`, which launches a web server and auto-regenerates your site when a file is updated.
+
+Bridgetown requires blog post files to be named according to the following format:
+
+`YEAR-MONTH-DAY-title.EXT`
+
+Where `YEAR` is a four-digit number, `MONTH` and `DAY` are both two-digit numbers, and `EXT` is the file extension representing the format used in the file (for example, `md` for Markdown). After that, include the necessary front matter. Take a look at the source for this post to get an idea about how it works.
+
+Bridgetown also offers powerful support for code snippets:
+
+```ruby
+def print_hi(name)
+  puts "Hi, #{name}"
+end
+print_hi('Tom')
+#=> prints 'Hi, Tom' to STDOUT.
+````
+
+Check out the [Bridgetown docs](https://bridgetownrb.com/docs/) for more info on how to get the most out of Bridgetown. File all bugs/feature requests at [Bridgetown’s GitHub repo](https://github.com/bridgetownrb/bridgetown). If you have questions, you can ask them on [Bridgetown Community Forum](https://community.bridgetownrb.com).

data/example/src/about.md

@@ -0,0 +1,11 @@
+---
+layout: page
+title: About
+subtitle: This is an About page.
+---
+
+This is the basic Bridgetown site template. You can find out more info about customizing your Bridgetown site, as well as basic Bridgetown usage documentation at [bridgetownrb.com](https://bridgetownrb.com/)
+
+You can find the source code for Bridgetown at GitHub:
+[bridgetownrb](https://github.com/bridgetownrb) /
+[bridgetown](https://github.com/bridgetownrb/bridgetown)

data/example/src/index.md

@@ -0,0 +1,21 @@
+---
+layout: home
+---
+
+Welcome to my site!
+
+I write about topics that I care about and believe are important. I try to bring my authentic voice every time I set out to type, and I strive to share a viewpoint that gets you thinking and inspired to dig deeper.
+
+----
+{: .my-6}
+
+# Latest Articles
+{: .mb-5 .title .has-text-centered}
+
+{% assign posts = site.posts | slice: 0, 6 %}
+{% render "bulmatown/collection", collection: posts, metadata: site.metadata %}
+
+{% if site.posts.size > 6 %}
+  <a href="/posts/" class="button is-primary is-outlined is-small"><span>Previous Articles</span> <span class="icon"><i class="fa fa-arrow-right"></i></span></a>
+  {: .mt-6 .has-text-centered}
+{% endif %}

data/example/src/posts.md

@@ -0,0 +1,11 @@
+---
+layout: page
+title: Articles
+pagination:
+  enabled: true
+---
+
+{% assign posts = paginator.documents %}
+{% render "bulmatown/collection", collection: posts, metadata: site.metadata %}
+
+{% render "bulmatown/pagination", paginator: paginator %}

data/example/start.js

@@ -0,0 +1,17 @@
+const concurrently = require('concurrently');
+
+// By default, configure Bridgetown to use port 4001 so Browsersync can use 4000
+// See also Browsersync settings in sync.js
+const port = 4001
+
+/////////////////
+// Concurrently
+/////////////////
+concurrently([
+  { command: "yarn webpack-dev", name: "Webpack", prefixColor: "yellow"},
+  { command: "sleep 4; yarn serve --port " + port, name: "Bridgetown", prefixColor: "green"},
+  { command: "sleep 8; yarn sync", name: "Live", prefixColor: "blue"}
+], {
+  restartTries: 3,
+  killOthers: ['failure', 'success'],
+}).then(() => { console.log("Done.");console.log('\033[0G'); }, () => {});

data/example/sync.js

@@ -0,0 +1,35 @@
+const browserSync = require("browser-sync").create();
+
+// You can change these configuration values:
+const proxy = "http://localhost:4001"
+const port = 4000
+const uiPort = 4002
+
+////////////////
+// Browsersync
+////////////////
+browserSync.init({
+  open: false,
+  notify: false,
+  proxy: proxy,
+  port: port,
+  files: "output/index.html",
+  ghostMode: {
+    clicks: false,
+    forms: false,
+    scroll: false,
+  },
+  reloadDelay: 0,
+  injectChanges: false,
+  ui: {
+    port: uiPort
+  },
+  snippetOptions: {
+    rule: {
+      match: /<\/head>/i,
+      fn: function (snippet, match) {
+        return snippet + match;
+      },
+    },
+  },
+});

data/example/webpack.config.js

@@ -0,0 +1,78 @@
+const path = require("path");
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+const ManifestPlugin = require("webpack-manifest-plugin");
+
+module.exports = {
+  entry: "./frontend/javascript/index.js",
+  devtool: "source-map",
+  // Set some or all of these to true if you want more verbose logging:
+  stats: {
+    modules: false,
+    builtAt: false,
+    timings: false,
+    children: false,
+  },
+  output: {
+    path: path.resolve(__dirname, "output", "_bridgetown", "static", "js"),
+    filename: "all.[contenthash].js",
+  },
+  resolve: {
+    extensions: [".js", ".jsx"],
+  },
+  plugins: [
+    new MiniCssExtractPlugin({
+      filename: "../css/all.[contenthash].css",
+    }),
+    new ManifestPlugin({
+      fileName: path.resolve(__dirname, ".bridgetown-webpack", "manifest.json"),
+    }),
+  ],
+  module: {
+    rules: [
+      {
+        test: /\.(js|jsx)/,
+        use: {
+          loader: "babel-loader",
+          options: {
+            presets: ["@babel/preset-env"],
+            plugins: [
+              ["@babel/plugin-proposal-decorators", { "legacy": true }],
+              ["@babel/plugin-proposal-class-properties", { "loose" : true }],
+              [
+                "@babel/plugin-transform-runtime",
+                {
+                  helpers: false,
+                },
+              ],
+            ],
+          },
+        },
+      },
+      {
+        test: /\.(s[ac]|c)ss$/,
+        use: [
+          MiniCssExtractPlugin.loader,
+          "css-loader",
+          {
+            loader: "sass-loader",
+            options: {
+              sassOptions: {
+                includePaths: [
+                  path.resolve(__dirname, "src/_components")
+                ],
+              },
+            },
+          },
+        ],
+      },
+      {
+        test: /\.woff2?$|\.ttf$|\.eot$|\.svg$/,
+        loader: "file-loader",
+        options: {
+          outputPath: "../fonts",
+          publicPath: "../fonts",
+        },
+      },
+    ],
+  },
+};