ci

This PR makes it so that opening the nav used a hash in the browser's location. This way, we can program the 'back' action in the browser to close the nav.

Haven't tested on mobile yet, might be a bit quirky.

Co-authored-by: Steve Russo <steverusso@pm.me>
Reviewed-on: #47
Reviewed-by: jeff <jeff@simplesystems.tech>
Co-authored-by: steverusso <steverusso@protonmail.com>
Co-committed-by: steverusso <steverusso@protonmail.com>

.gitea/workflows/build-image.yml

@@ -0,0 +1,35 @@
+name: build image
+on:
+  push:
+    branches:
+      - master
+
+jobs:
+  build image:
+    runs-on: ubuntu-latest
+    steps:
+      - name: code checkout
+        uses: actions/checkout@v4.1.6
+      - name: docker login
+        uses: docker/login-action@v2
+        with:
+          registry: registry.digitalocean.com
+          username: ${{ secrets.DOCKER_REGISTRY_CREDS }}
+          password: ${{ secrets.DOCKER_REGISTRY_CREDS }}
+      - name: create tag
+        id: create-tag
+        run: |
+          tag=$(echo ${{ github.sha }} | cut -b 1-8)
+          echo "::set-output name=tag::$tag"
+      - name: build and push
+        uses: docker/build-push-action@v5.3.0
+        with:
+          platforms: linux/amd64
+          push: true
+          build-args: |
+            REGISTRY_DOCKER_HUB=${{ vars.REGISTRY_DOCKER_HUB }}
+            REGISTRY_GCR=${{ vars.REGISTRY_GCR }}
+            REGISTRY_SIMPLE_SYSTEMS=${{ vars.REGISTRY_SIMPLE_SYSTEMS }}
+          tags: |
+            registry.digitalocean.com/ssdocker/${{ github.repository }}:${{ steps.create-tag.outputs.tag }}
+            registry.digitalocean.com/ssdocker/${{ github.repository }}:latest

.gitignore

@@ -2,7 +2,11 @@
 logs
 *.log
 
+# Compiled directory
 public
 
+# Hugo
+.hugo_build.lock
+
 # IDE
 .idea

Dockerfile

@@ -0,0 +1,23 @@
+ARG REGISTRY_DOCKER_HUB
+ARG REGISTRY_SIMPLE_SYSTEMS
+FROM $REGISTRY_DOCKER_HUB/alpine:latest AS build-website
+
+WORKDIR /src
+
+COPY . /src/
+
+# Get hugo -- using the edge branch to get latest version
+RUN sed -i -e 's/v[[:digit:]]\..*\//edge\//g' /etc/apk/repositories
+RUN apk update && apk upgrade && \
+    apk add --no-cache hugo
+
+RUN hugo --minify
+
+FROM $REGISTRY_SIMPLE_SYSTEMS/simplesystems/static-web-server:609f2b47
+
+WORKDIR /app
+
+# Copy over static website files
+COPY --from=build-website /src/public /app/public
+
+ENTRYPOINT ["./static-web-server", "-rootDir", "public", "-port", "80"]

Dockerfile.dev

@@ -1,11 +1,12 @@
-FROM golang:alpine
+FROM alpine:latest
 
 # This should be mounted with docker run command
 WORKDIR /src
 
-# Build and run hugo
-ENV GO111MODULE=on
-RUN go get -u github.com/gohugoio/hugo@v0.69.0
+# Get hugo -- using the edge branch to get latest version
+RUN sed -i -e 's/v[[:digit:]]\..*\//edge\//g' /etc/apk/repositories
+RUN apk update && apk upgrade && \
+    apk add --no-cache hugo
 
 # Run the development server
-ENTRYPOINT cd /src && hugo server --bind 0.0.0.0
+ENTRYPOINT hugo server --bind 0.0.0.0

Dockerfile.prod

@@ -1,34 +0,0 @@
-# STEP 1: Build the website's files
-FROM golang:alpine AS build-website
-
-WORKDIR /src
-
-COPY . /src/
-
-RUN cd /src
-
-ENV GO111MODULE=on
-RUN go get -u github.com/gohugoio/hugo@v0.69.0
-
-RUN hugo --minify
-
-# STEP 2: Get a binary for the static-web-server
-FROM golang:alpine AS build-webserver
-
-RUN apk update && apk upgrade && \
-    apk add --no-cache git
-
-RUN go get -u git.simplesystems.tech/SimpleSystems/static-web-server
-
-# STEP 3: Combine static files and binary on fresh alpine image
-FROM alpine:latest
-
-WORKDIR /app
-
-# Copy over static website files
-COPY --from=build-website /src/public /app/public
-
-# Copy over static-web-server
-COPY --from=build-webserver /go/bin/static-web-server /app/
-
-ENTRYPOINT ["./static-web-server", "-rootDir", "public", "-port", "80", "-redirect"]

README.md

@@ -7,6 +7,12 @@ Built using [Hugo](https://gohugo.io/getting-started/installing/)
 hugo server
 ```
 
+Development can also be run using Docker:
+```shell script
+docker build --no-cache -f Dockerfile.dev -t website-fe . && \
+docker run -it -p 1313:1313 --mount source=$(pwd),target=/src,type=bind --rm website-fe
+```
+
 ## Production
 To build the production site, run the following command:
 ```

assets/simplesystems.css

@@ -71,13 +71,12 @@ hr, hr.light {
 .col.shrink { flex: 0 0 auto !important }
 @media (min-width: 600px) {
 	.col.sm-content { flex-basis: content !important }
-	.col.sm-grow { flex-grow: 1 !important; flex-basis: 0 !important; }
-	.col.sm-shrink { flex: 0 0 auto !important; }
+	.col.sm-grow { flex: 1 0 0 !important; width: auto !important; }
+	.col.sm-shrink { flex: 0 0 auto !important; width: auto !important; }
 	.col.sm-6 { width: 50% !important }
 	.col.sm-9 { width: 75% !important }
 	.col.sm-10 { width: 83.3334% !important }
 
-	.text-sm-center { text-align: center !important; }
 	.justify-sm-center { justify-content: center !important; }
 }
 @media (min-width: 950px) {
@@ -105,8 +104,14 @@ hr, hr.light {
 .align-center { align-items: center !important }
 .justify-center { justify-content: center !important }
 .justify-end { justify-content: end !important }
+
 .text-center { text-align: center !important }
 .text-right { text-align: right !important }
+@media (min-width: 600px) {
+	.text-sm-left { text-align: left !important }
+	.text-sm-center { text-align: center !important }
+	.text-sm-right { text-align: right !important }
+}
 
 .title { font-size: 1.25rem }
 .headline { font-size: 1.5rem }
@@ -335,3 +340,11 @@ button.round, .btn.round {
 }
 
 .blue { --clr: #42A5F5 }
+
+pre {
+	background: #eee;
+	border-radius: 5px;
+	padding-left: 1rem;
+	color: black;
+	font-size: 0.95rem;
+}

config.toml

@@ -1,5 +1,9 @@
 languageCode = "en-us"
+disableKinds = ["taxonomy", "taxonomyTerm"]
 title = "SimpleSystems, LLC"
 
 [markup.goldmark.renderer]
-unsafe= true
+	unsafe= true
+
+[markup.highlight]
+	style = "friendly"

content/_index.md

@@ -1,4 +1,6 @@
-[
+---
+title:
+ssattrs: [
 	{
 		"title": "Comprehensible Interaction",
 		"img": "/img/interact.png",
@@ -20,3 +22,4 @@
 		"desc": "When software simply does its job, and does it well, it will be an asset to other systems.  When software becomes convoluted, it will hinder other systems."
 	}
 ]
+---

content/blog/boolean_names.md

@@ -0,0 +1,40 @@
+---
+img: /img/yinyang-simplesystems.png
+title: "Boolean Variable Names"
+author: Jeff Russo
+pdate: June 30, 2020
+desc: Choosing a good boolean variable name
+---
+
+Choosing good names for variables is an important art for software engineers to master.  Variable names are documentation and can remove [complexity](http://localhost:1313/blog/complexity/) from code.  Using a bad name for a variable leads to confusion, bugs, and wasted engineer time.  In this blog post I will discuss what makes a [boolean](https://en.wikipedia.org/wiki/Boolean_data_type) variable name good or bad.
+
+## Good Boolean Names
+Boolean names should be [negatable](https://www.yourdictionary.com/negatable) and in the positive form.  They should be clear and concise just as all variable names should be.  As the scope of the variable increases, its level of description should increase as well.
+
+_The Elements of Style_ <sup>1</sup> is a concise guide to writing English.  Some rules can be used as a guide for writing code as well.  For example, rule 11, "Put statements in positive form," can be applied to naming boolean variables.  In code, there is one additional requirement: the statement must be positive as well.  'enabled' is both in the positive form and a positive statement.  'disabled' is in the positive form but is a negative statement. 'notEnabled' is both in the negative form and a negative statement.
+
+In English, it is best to use enabled or disabled, and to avoid "not enabled"; they are more concise and stay in the positive form.  The extra requirement of using a positive statement for boolean names is because the negations of boolean variables have meaning as well; in writing, "not disabled" is a double negative and is discouraged.  In code '!disabled' is also a double negative, and should be avoided.
+
+A boolean name should give the reader more clarity as its scope expands.  A boolean variable that exists for the scope of an if statement may have a short name ('ok').  If this variable was in scope throughout the function, it would become meaningless.
+
+## Bad Boolean Names
+As with many things in software engineering, it is easier to find mistakes than to do something correctly the first time.  Here are some naming conventions to avoid:
+1. Names that are already a negation.  'featureTurnedOff' and 'notProd' may make sense in one use case, but they become confusing in a larger context.  The following code is both hard to read and ambiguous (what if there is a third environment).
+   ```go
+
+   confA.useProd := !confB.notProd
+
+   ```
+
+2. Names that are not negatable.  A name such as 'sheets' has ambiguous meaning.  It probably has something to do with a spreadsheet, but it is the writer's responsibility to prevent the reader from needing to do an investigation.
+
+3. Names that are in negative form.  These typically appear when the default use is the negative form.  For example, 'disabled' for a service typically disabled.  Keep all the names in positive form to avoid a future headache explaining what the billing system does when it's "not disabled".  Is it now enabled, or is it just not disabled?
+
+4. Overly general names.  As discussed earlier, this depends on the scope of the name.  Avoid using a name such as 'on'.  It leaves questions in the reader's mind such as "_Which_ thing is on?".  The exception to this is typical boolean names used across code bases; Go's 'ok' is an example of this.
+
+5. Negatable adjectives without context.  'bool customSize' is clear, but without the 'bool' context, the type is unclear.  Ambiguity can be removed by prepending 'is' or 'has' ('isCustomSize').
+
+## Conclusion
+This blog post discussed a goal to aim at (good names) and several things to avoid (bad names).  Combined, these will hopefully increase the readability of the software you write!
+
+<sup>1</sup> https://tinyurl.com/y3uxhzxc

content/blog/complexity.md

@@ -8,7 +8,7 @@ desc: What is complexity as it relates to software?
 The most [relevant definition of complexity](https://www.lexico.com/en/definition/complex) for this blog post is: (adj) "Not easy to analyze or understand; complicated or intricate." Intuition of complexity is important if you are designing, writing, or reading software.  If you are purchasing software, it is important to prioritize simpler options; it will be cheaper in the long run.  In this blog post, I will discuss identifying complexity, why it's bad, why simple is good, and how software engineers manage complexity.
 
 ## Identifying Complexity
-Before being able to manage complexity, it must be identified.  In addition to the definition, it is helpful to know indicators and examples.  Seasoned engineers sometimes call these smells; complexity is not black and white, but more of an intuition.  Things that appear simple now may become complex in the future.
+Before being able to manage complexity, it must be identified.  Along with the definition, it is helpful to know indicators and examples.  Seasoned engineers sometimes call these smells; complexity is not black and white, but more of an intuition.  Things that currently appear simple may become complex in the future.
 
 #### Indicators
 
@@ -27,22 +27,24 @@ Before being able to manage complexity, it must be identified.  In addition to t
 * Humans: No two are the same.  DNA on its own is complex; factoring in the expression of that DNA is beyond the understanding of any single person. 
 
 ## Complex Software is Undesirable
-All software is complex; it is one of the most complex man-made things.  Physical creations such as space ships, submarines, and skyscrapers may be complex, but they are limited by the laws of physics.  Software has no such limit.  For example, [FreeBSD](https://www.freebsd.org/) is an operating system that powers parts of [Netflix](https://www.phoronix.com/scan.php?page=news_item&px=Netflix-NUMA-FreeBSD-Optimized), [WhatsApp](https://www.quora.com/Why-did-WhatsApp-choose-FreeBSD-over-Linux), and [PlayStation 4](https://en.wikipedia.org/wiki/PlayStation_4_system_software).  Using [scc](https://github.com/boyter/scc), a tool to evaluate the size of codebases, it estimates it would take about 16 years with 500 people to recreate FreeBSD 12.1.
+All software is complex; it is one of the most complex man-made things.  Physical creations such as spaceships, submarines, and skyscrapers may be complex, but they are limited by the laws of physics.  Software has no such limit.  For example, [FreeBSD](https://www.freebsd.org/) is an operating system that powers parts of [Netflix](https://www.phoronix.com/scan.php?page=news_item&px=Netflix-NUMA-FreeBSD-Optimized), [WhatsApp](https://www.quora.com/Why-did-WhatsApp-choose-FreeBSD-over-Linux), and [PlayStation 4](https://en.wikipedia.org/wiki/PlayStation_4_system_software).  Using [scc](https://github.com/boyter/scc), a tool to evaluate the size of codebases, it estimates 16 years with 500 people would be required to recreate FreeBSD 12.1.
 
 While some complexity is unavoidable, it is best minimized.  Here are a few reasons to minimize the complexity of software:
 
 * Expensive changes: As software gets more complex, the cost to change increases exponentially.  A module bound to several business concerns is more expensive than a module that does one thing.  Engineers, business representatives, and managers need to work together on multi-purpose modules instead of handing a simple task to an engineer to work on a single-purpose module.
 
-* Time: While money can be acquired, time is scarce.  If a project becomes expensive, some larger companies can handle it.  If the software is complex enough, the bottleneck becomes time, at which point it is too late.  Cars travel quickly on highways, partly due to their straight path (simple).  If the only way to get from A to B is a winding mountain road (complex), more time will be needed than the highway, no matter how fast a car you buy.
+* Time: Time is a scarce resource; more importantly, it cannot be produced, accumulated, or recovered.  When complexity creeps into software, a large time cost in incurred.  Money can be generated or borrowed to offset project costs, but time cannot.  This is the most undesirable attribute of complex software.
 
 * Engineer retention: Engineers who work on simple software run into less frustrating walls.  This is more fulfilling work, and will keep engineers on the team.  Engineers are less likely to take ownership of problems and code if it is part of a complex mess.
 
 ## Simple is Difficult, but Effective
 An antonym of complexity is [simplicity](https://www.thesaurus.com/browse/complexity). Although it is easy to explain a [simple system](https://simplesystems.tech/blog/post/simplicity), it is not easy to create one.  This is the classic investment mindset applied to time.  It is better to think twice and code once.  Here are a few examples of simplifying principles:
 
-* Encapsulation: When the complexity of software cannot be mitigated, it can still be encapsulated.  This powerful idea is what enables the internet to work smoothly; each packet of information sent across it is an envelope.  The inner workings of an automatic transmission are quite complex, but it is encapsulated so well that the driver simply selects "D".  As [Rob Pike](https://twitter.com/rob_pike) points out in this [video](https://www.youtube.com/watch?v=rFejpH_tAHM&t=789), the simplest interface is no interface at all; garbage collection is completely encapsulated.
+* Encapsulation: When the complexity of software cannot be mitigated, it can still be encapsulated.  This powerful idea is what enables the internet to work smoothly; each packet of information sent across it is an envelope.
+    
+    The inner workings of a vehicle's automatic transmission are quite complex, but it is encapsulated so well that the driver simply selects "D".  As [Rob Pike](https://twitter.com/rob_pike) points out in this [video](https://www.youtube.com/watch?v=rFejpH_tAHM&t=789), the simplest interface is no interface at all; garbage collection is completely encapsulated.
 
-* UNIX philosophy:  "Make each program do one thing well."  This can save software from becoming an indomitable mess.  Constantly adding features to the same system will eventually make it collapse in on itself.
+* UNIX philosophy:  "Make each program do one thing well."  This can save software from becoming an indomitable mess.  Constantly adding features to the same system will eventually make it collapse in on itself.  Maintaining this discipline is difficult, but is more effective than simply saying yes to everything.
 
 * Composition: Software should be composed of interchangeable modules.  The boundaries between modules must be well-defined.  Chess software should have two players, but those players do not need to be humans on a computer.  By keeping the player module separate, it can be swapped for an AI player module.  This enables better testing and more interesting games.
 

content/blog/cryptocurrency.md

@@ -41,7 +41,7 @@ If you saved a dollar in 1913, it only has about 4 cents worth of buying power n
 
 ## Bitcoin - A Major Breakthrough
 [Bitcoin](https://bitcoin.org/bitcoin.pdf) was a major breakthrough in both computing and money.
-It's Proof of Work consensus algorithm is the backbone of most cryptocurrencies.
+Its Proof of Work consensus algorithm is the backbone of most cryptocurrencies.
 This method enables entities from around the world to agree on something.
 For cryptocurrencies, that something is the possession of money.
 An agreement on the ownership of about $150B has been reached every ten minutes for over a decade.
@@ -59,14 +59,14 @@ If that $10 was in a bank robbery last year, should it be deemed to have less th
 
 ## Monero - Fungible
 [Monero](https://web.getmonero.org/) is cryptocurrency which was released a few years after Bitcoin.
-It is [fungible](https://web.getmonero.org/resources/moneropedia/fungibility.html) unlike Bitcoin, meaning each unit of currency is of equal value as the others. 
+It is [fungible](https://web.getmonero.org/resources/moneropedia/fungibility.html), unlike Bitcoin, meaning each unit of currency is of equal value as the others. 
 This is achieved by keeping the ledger private.
 Transactions are put out in the open like Bitcoin, but the details are encrypted.
 This means there is no way to discriminate against a user based on their financial history.
 
 Monero is private by default, but has the ability to reveal transactions at your discretion.
 In the case of a business, it may be required to show the "books".
-This is simple with a view key that can be used to show incoming transactions.
+This is simple with a view key, which can be used to show incoming transactions.
 
 ## Be your own bank
 One of the advantages to using cryptocurrency is that you are your own bank.
@@ -81,7 +81,7 @@ This 24/7 availability gives you 24/7 access.
 ## Conclusion
 I think cryptocurrencies are the future of money.
 They are superior to fiat in so many ways.
-There are almost no barriers to entry; Essentially anyone with internet access can use crypto.
+There are almost no barriers to entry; essentially anyone with internet access can use crypto.
 For myself and my company, this makes it very easy to be my own bank.
 
 We will accept crypto because we believe it is only a matter of time before the world starts converting from fiat to it.

content/jobs/back-end-engineer.md

@@ -0,0 +1,38 @@
+---
+title: Back End Engineer
+icon: settings
+desc: As a back end engineer, your mission is to create and maintain useful services. You'll work with data in various forms and transform it into meaningful information.
+---
+
+# Back End Engineer
+---
+
+### About the company
+Simple Systems is a software company.
+Our mission is to deliver simple solutions for complex problems.
+
+### About the job
+As a back end engineer, your mission is to create and maintain useful services.
+You'll work with data in various forms and transform it into meaningful information.
+Project leaders will come to you with complex problems that need simple solutions.
+
+#### Expectations
+* Reduce [complexity](https://simplesystems.tech/blog/complexity)
+* Work with project leaders to gain understanding of their vision
+* Support front end engineers by delivering the information they need
+* Own the code you write
+* Review code from other engineers
+* Suggest improvements throughout codebase
+* Be open to suggestions for your code
+
+#### Competencies
+* Ownership mentality: Take responsibility for what you do.
+* Clear communication: Software engineering is a team process.  Be able to communicate with teammates.
+* Constant learning: Keep up to date on technologies.
+* Lazy programming: Think before you code.
+* Testing: Unit tests are a must.  Testing logic is important too.
+* Documentation: Other engineers should be able to pick up your code without hassle.
+* Currently, we use Go, gRPC, and SQL, but are more concerned with fundamentals than specific technology.
+
+### Interested?
+Email a resume and brief description about yourself to jobs@simplesystems.tech. 

content/portfolio/_index.md

@@ -2,9 +2,15 @@
 	"projects": [
 		{
 			"title": "SBA Ponderay",
-			"img": "https://sbaponderay.com/img/sba-ponderay.png",
+			"img": "/img/sba-ponderay.png",
 			"desc": "SBA Ponderay is a Jiu Jitsu gym in Ponderay, ID. It specializes in the Progressive System of Brazilian Jiu Jitsu. Simple Systems' owner trains there several times a week.",
 			"href": "https://sbaponderay.com/"
+		},
+		{
+			"title": "7B-IV",
+			"img": "/img/logo_7biv.svg",
+			"desc": "7B-IV is an IV service. They have a clinic in town, but also have a mobile option.",
+			"href": "https://7b-iv.com/"
 		}
 	]
 }

layouts/_default/baseof.html

@@ -4,26 +4,31 @@
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
-		<link rel="stylesheet" href="/icons.css">
-		<link rel="stylesheet" href="/simplesystems.css">
-		<link rel="stylesheet" href="/light-theme.css">
+		{{ partialCached "css-global.html" . }}
 		<link rel="shortcut icon" href="/favicon.ico">
 
-		<title>{{ block "title" . }}
-		{{ .Site.Title }}
-		{{ end }}</title>
+		<title>{{ .Site.Title }} {{ block "title" . }} {{ with .Title }} | {{ . }} {{ end }} {{ end }}</title>
 	</head>
 
 	<body>
-		{{ partial "navbar/site-navbar.html" . }}
+		{{ partialCached "navbar.html" . }}
 
 		<main>
-			{{ block "main" . }}
-				<!-- The part of the page that begins to differ between templates -->
-			{{ end }}
+			{{ block "main" . }} {{ end }}
 		</main>
 
-		{{ partial "footer/site-footer.html" . }}
-		{{ partial "scripts/scripts.html" . }}
+		{{ partialCached "footer.html" . }}
+		{{ partialCached "js-global.html" . }}
+
+		<script>
+			(function() {
+				var drawerLinks = navDrawer.getElementsByTagName("a");
+				for (var i=0; i<drawerLinks.length; i++) {
+					drawerLinks[i].addEventListener("click", function() {
+						navToggle.checked = false;
+					});
+				}
+			})()
+		</script>
 	</body>
 </html>

layouts/_default/section.html

@@ -1,6 +1,4 @@
 {{ define "main" }}
-	{{ .Content }}
-
 	<div class="container">
 		<div class="row">
 			{{ range .Pages }}

layouts/index.html

@@ -1,4 +1,4 @@
 {{ define "main" }}
 	{{ partial "jumbotron.html" . }}
-	{{ partial "simple-software.html" . }}
+	{{ partial "simple-software.html" .Params.ssattrs }}
 {{ end }}

layouts/partials/css-global.html

@@ -0,0 +1,8 @@
+{{ $sheets := slice }}
+{{ range slice "icons.css" "simplesystems.css" "light-theme.css" }}
+	{{ $sheets = $sheets | append (resources.Get .) }}
+{{ end }}
+
+{{ $css := $sheets | resources.Concat "/css/main.css" | resources.Fingerprint "sha512" }}
+
+<link rel="stylesheet" href="{{ $css.RelPermalink }}" integrity="{{ $css.Data.Integrity }}">

layouts/partials/js-global.html

@@ -1,11 +1,11 @@
 <script>
 	function openNavDrawer() {
-		navDrawerOverlay.classList.toggle('d-none')
+		navDrawerOverlay.classList.remove('d-none')
 		navDrawer.style.transform = 'translate(0)'
 	}
 
 	function closeNavDrawer() {
-		navDrawerOverlay.classList.toggle('d-none')
+		navDrawerOverlay.classList.add('d-none')
 		navDrawer.style.transform = 'translate(100%)'
 	}
 
@@ -62,5 +62,6 @@
 		}
 		setThemeTo(th)
 		initToggle(th)
+		closeNavDrawer()
 	})()
 </script>

layouts/partials/simple-software.html

@@ -7,7 +7,7 @@
 	</div>
 
 	<div class="row justify-center">
-		{{ range $.Site.Data.home.ssattrs }}
+		{{ range $ }}
 			<div class="col xs-12 sm-10 md-6">
 				{{ partial "cards/home-card.html" . }}
 			</div>

layouts/section/about.html

@@ -1,8 +1,8 @@
 {{ define "main" }}
 	<div class="container">
-		<div class="row text-center">
+		<div class="row">
 			<div class="col xs-12">
-        <p class="headline">Our mission is to deliver simple solutions for complex problems.</p>
+        <p class="headline text-center">Our mission is to deliver simple solutions for complex problems.</p>
 			</div>
 		</div>
 
@@ -10,14 +10,13 @@
 			<div class="col">
 				<div class="card text-center">
 					<div class="row align-center">
-						<div class="col xs-12 sm-content">
+						<div class="col xs-12 sm-shrink">
 							<img src="/img/rocket.png" width="150" height="150">
 						</div>
 
-						<div class="col xs-12 sm-grow">
-							<p class="mb-0">“Any darn fool can make something complex;<br>It takes a genius to make something simple.”</p>
-							<br>
-							<p class="ml-5">-- Albert Einstein</p>
+						<div class="col xs-12 sm-grow" style="flex-basis: auto !important;">
+							<p class="mb-0 text-center text-sm-left">“Any darn fool can make something complex;<br>It takes a genius to make something simple.”</p>
+							<p class="text-center text-sm-right">-- Albert Einstein</p>
 						</div>
 					</div>
 				</div>

layouts/section/blog.html

@@ -1,6 +1,4 @@
 {{ define "main" }}
-	{{ .Content }}
-
 	<div class="container">
 		<div class="row text-center">
 			<div class="col xs-12">

layouts/section/jobs.html

@@ -1,6 +1,4 @@
 {{ define "main" }}
-	{{ .Content }}
-
 	<div class="container">
 		<div class="row text-center">
 			<div class="col xs-12">