From f7e4f5cdb014c1bdfdc7c31f57c0c344db29f88c Mon Sep 17 00:00:00 2001
From: Erik Osterman <erik@cloudposse.com>
Date: Sun, 6 May 2018 01:32:48 -0700
Subject: [PATCH] More cleanup (#10)

* css for code block, warning and important

* fix directory pages

* white active menu;

* fix footline on category pages

* hide empty th

* css fixes

* more css fixes

* fix editURL
---
 config.toml                                   |   2 +
 .../postmortem-example.md                     |   1 +
 content/documentation/contact-us.md           |  10 +-
 .../geodesic-module/use/with-terraform.md     |  63 ++++----
 content/helm-charts/helm-quick-start.md       |   7 +-
 .../ingress/_index.md                         |  16 +-
 content/kubernetes/kubernetes-pull-secrets.md |   5 +-
 content/project-management/gost-framework.md  |  20 ++-
 content/release-engineering/build-harness.md  |  22 +--
 layouts/partials/flex/body-beforecontent.html |   2 +-
 static/css/custom.css                         | 146 ++++++++++++++++--
 11 files changed, 217 insertions(+), 77 deletions(-)

diff --git a/config.toml b/config.toml
index c447a1416..47093401a 100644
--- a/config.toml
+++ b/config.toml
@@ -9,6 +9,7 @@ defaultContentLanguage = "en"
 defaultContentLanguageInSubdir= false
 enableMissingTranslationPlaceholders = false
 
+
 enableEmoji = true
 # [Languages]
 # [Languages.en]
@@ -32,6 +33,7 @@ disableNavChevron = false # set true to hide next/prev chevron, default is false
 highlightClientSide = false # set true to use highlight.pack.js instead of the default hugo chroma highlighter
 menushortcutsnewtab = false # set true to open shortcuts links to a new tab/window
 enableGitInfo = true
+editURL = "https://github.com/cloudposse/docs/edit/master"
 
 [outputFormats.glossary]
 baseName = "glossary"
diff --git a/content/devops-methodology/root-cause-analysis-postmortem/postmortem-example.md b/content/devops-methodology/root-cause-analysis-postmortem/postmortem-example.md
index e05e0e063..5fdd1511e 100644
--- a/content/devops-methodology/root-cause-analysis-postmortem/postmortem-example.md
+++ b/content/devops-methodology/root-cause-analysis-postmortem/postmortem-example.md
@@ -5,6 +5,7 @@ excerpt: Example of a well-executed postmortem for Root Cause Analysis
 
 # Incident #1 - Rollout Caused Unplanned Outage (2017-06-29)
 
+|                  |                      |
 |:-----------------|:---------------------|
 | On-call Engineer | Erik Osterman        |
 | Start Time       | 2018-06-29 12:58 PST |
diff --git a/content/documentation/contact-us.md b/content/documentation/contact-us.md
index b08925d14..8814f598b 100644
--- a/content/documentation/contact-us.md
+++ b/content/documentation/contact-us.md
@@ -4,8 +4,8 @@ excerpt: ''
 parent: home
 ---
 
-              |
-------------- | ----------------------------------------------------------
-Inquiries     | [hello@cloudposse.com](mailto:hello@cloudposse.com)
-Schedule Time | [calendly.com/cloudposse](https://calendly.com/cloudposse)
-Call          | +1 (310) 496-6556
+|               |                                                            |
+|:--------------|:-----------------------------------------------------------|
+| Inquiries     | [hello@cloudposse.com](mailto:hello@cloudposse.com)        |
+| Schedule Time | [calendly.com/cloudposse](https://calendly.com/cloudposse) |
+| Call          | +1 (310) 496-6556                                          |
diff --git a/content/geodesic/geodesic-module/use/with-terraform.md b/content/geodesic/geodesic-module/use/with-terraform.md
index dc5b97001..1e6c0afa8 100644
--- a/content/geodesic/geodesic-module/use/with-terraform.md
+++ b/content/geodesic/geodesic-module/use/with-terraform.md
@@ -28,14 +28,16 @@ Then run these commands:
 
 5. Re-run `init-terraform`, answer `yes` when asked to import state
 
-##### :warning: Prerequisites
-> Follow the "Use geodesic module"  to [Use](doc:use) get how to use the module shell.
+{{% dialog type="warning" icon="fa-exclamation-circle" title="Prerequisites" %}}
+Follow the "Use geodesic module"  to [Use](doc:use) get how to use the module shell.
+{{% /dialog %}}
 
 # Create terraform state bucket
 
-##### :no_entry_sign: Important
-> To use terraform you need to create terraform state bucket.
- >Follow the instructions to do that.
+{{% dialog type="important" icon="fa-exclamation-triangle" title="Important" %}}
+To use terraform you need to create terraform state bucket.
+Follow the instructions to do that.
+{{% /dialog %}}
 
 To create terraform state bucket follow this steps:
 
@@ -129,7 +131,7 @@ Run Geodesic Shell in [development mode](doc:use#section-development-mode)
 > $CLUSTER_NAME
 ```
 
-##### Example
+{{% dialog type="code-block" icon="fa-code" title="Example" %}}
 ```shell
 > staging.example.com
 # Mounting /home/goruha into container
@@ -156,6 +158,7 @@ IMPORTANT:
 ❌   (none) ~ ➤  
 
 ```
+{{% /dialog %}}
 
 ## Authorize on AWS
 Assume role by running
@@ -163,7 +166,7 @@ Assume role by running
 assume-role
 ```
 
-##### Example
+{{% dialog type="code-block" icon="fa-code" title="Example" %}}
 ```shell
 ❌   (none) tfstate-backend ➤  assume-role
 Enter passphrase to unlock /conf/.awsvault/keys/:
@@ -174,6 +177,7 @@ Enter token for arn:aws:iam::xxxxxxx:mfa/goruha: 781874
 ✅   (example-staging-admin) tfstate-backend ➤  
 
 ```
+{{% /dialog %}}
 
 ## Apply tfstate-bucket
 
@@ -185,7 +189,7 @@ terraform apply
 ```
 The latest command will output id of terraform state bucket and dynamo DB table. Please copy that values because we need it for next step.
 
-##### Example
+{{% dialog type="code-block" icon="fa-code" title="Example" %}}
 ```shell
 ✅   (example-staging-admin) tfstate-backend ➤  terraform apply
 null_resource.default: Refreshing state... (ID: 4514126170089387416)
@@ -207,13 +211,14 @@ tfstate_backend_s3_bucket_id = example-staging-terraform-state
 ✅   (example-staging-admin) tfstate-backend ➤  
 
 ```
+{{% /dialog %}}
 
 In the example the bucket name is `example-staging-terraform-state` and dynamo DB table `example-staging-terraform-state-lock`.
 
 ## Exit the module shell
 Exit from the shell by running `exit` twice
 
-##### Example
+{{% dialog type="code-block" icon="fa-code" title="Example" %}}
 ```shell
 ✅   (example-staging-admin) tfstate-backend ➤  exit
 logout
@@ -223,8 +228,8 @@ Goodbye
 ❌   (none) ~ ➤  exit
 logout
 Goodbye
-
 ```
+{{% /dialog %}}
 
 ## Set the bucket as default bucket to store for terraform state files
 Update in module `Dockerfile` environment variables
@@ -236,7 +241,7 @@ ENV TF_DYNAMODB_TABLE ""
 ```
 with terraform state bucket name and region and dynamo DB table name.
 
-##### Example
+### Example
 ```text
 # Terraform
 ENV TF_BUCKET "example-staging-terraform-state"
@@ -257,7 +262,7 @@ Run Geodesic Shell in [development mode](doc:use#section-development-mode)
 > assume-role
 ```
 
-##### Example
+{{% dialog type="code-block" icon="fa-code" title="Example" %}}
 ```shell
 > staging.example.com
 # Mounting /home/goruha into container
@@ -289,33 +294,32 @@ Enter token for arn:aws:iam::xxxxxxx:mfa/goruha: 781874
  ⧉  staging example
 ✅   (example-staging-admin) tfstate-backend ➤  
 ```
+{{% /dialog %}}
 
 ## Save `tfstate-bucket` terraform state file into the bucket
 This is kind of self-reference but we need to store state in reliable storage. This is useful for the future update.
 
 
-# Create terraform module
-
-
+# Create Terraform Module
 
 To provision terraform module create a directory for it in `/conf`
 
-##### :information_source: Example
-> If terraform module name is `kube2iam`.
- >Create `/conf/kube2iam` and put there terraform code.
- >Example of code you can find there [LINK!]
+{{% dialog type="tip" icon="fa-hand-o-right" title="Tip" %}}
+If the terraform module is named `kube2iam`, then create `/conf/kube2iam` and stick the terraform code in there.
+Example of code you can find there [LINK!]
+{{% /dialog %}}
 
-# Rebuild the shell container
+# Rebuild the Geodesic Module
 
 Rebuild the shell container with `make build` command.
 
-{{% dialog type="info" icon="fa-info-circle" title="Tip" %}}
+{{% dialog type="tip" icon="fa-hand-o-right" title="Tip" %}}
 During development, you can skip rebuilding the container and instead work from the `/localhost` folder inside of the container. The `/localhost` folder is the user's `$HOME` folder mounted into the container. Any files on this system will be persisted.
 {{% /dialog %}}
 
 # Run the shell
 ```bash
-> $CLUSTER_NAME
+$CLUSTER_NAME
 ```
 
 For example, to access your geodesic project shell do the following.
@@ -339,12 +343,15 @@ terraform plan
 terraform apply
 ```
 
-##### :information_source: Example
-> If terraform module name is `kube2iam`.
- >`> cd /conf/kube2iam`
- >`> init-terraform`
- >`> terraform plan`
- >`> terraform apply`
+{{% dialog type="code-block" icon="fa-code" title="Example" %}}
+If terraform module name is `kube2iam`.
+```bash
+cd /conf/kube2iam
+init-terraform
+terraform plan
+terraform apply
+```
+{{% /dialog %}}
 
 ## Example: Provision CloudTrail with Terraform
 
diff --git a/content/helm-charts/helm-quick-start.md b/content/helm-charts/helm-quick-start.md
index f5d2ab8f7..1ac66172c 100644
--- a/content/helm-charts/helm-quick-start.md
+++ b/content/helm-charts/helm-quick-start.md
@@ -6,10 +6,9 @@ Helm is a package manager for kubernetes.
 
 There are a vast number of public charts available: https://github.com/kubernetes/charts/
 
-
-##### :information_source: Official Documentation
-> Visit the [Helm Documentation Portal](https://docs.helm.sh/) for excellent documentation
-
+{{% dialog type="info" icon="fa-info-circle" title="Official Documentation" %}}
+Visit the [Helm Documentation Portal](https://docs.helm.sh/) for excellent documentation
+{{% /dialog %}}
 
 # Values File
 
diff --git a/content/kubernetes-backing-services/ingress/_index.md b/content/kubernetes-backing-services/ingress/_index.md
index 621194894..76c7663e3 100644
--- a/content/kubernetes-backing-services/ingress/_index.md
+++ b/content/kubernetes-backing-services/ingress/_index.md
@@ -7,7 +7,7 @@ Configuring a web server or load balancer used to be harder than it should be, e
 Typically, services and pods have IPs only routable by the cluster network. All traffic that ends up at an edge router is either dropped or forwarded elsewhere. Conceptually, this might look like:
 
 
-##### 
+#####
 ```yaml
     internet
         |
@@ -18,7 +18,7 @@ Typically, services and pods have IPs only routable by the cluster network. All
 An Ingress is a collection of rules that allow inbound connections to reach the cluster services.
 
 
-##### 
+#####
 ```yaml
      internet
         |
@@ -56,13 +56,15 @@ In order for the Ingress resource to work, the cluster must have an Ingress cont
 
 An Ingress Controller is a daemon, deployed as a Kubernetes Pod, that watches the API server's /ingresses endpoint for updates to the Ingress resource. Its job is to satisfy requests for Ingresses.
 
-##### :information_source: Note
-> In theory, you can install several ingress controllers, for example, for different types of service. 
- >This would require you to specify explicitly which instance of the ingress controller to associate with. Therefore, we recommend to only have one controller per cluster.
+{{% dialog type="info" icon="fa-info-circle" title="Note" %}}
+In theory, you can install several ingress controllers, for example, for different types of service.
+This would require you to specify explicitly which instance of the ingress controller to associate with. Therefore, we recommend to only have one controller per cluster.
+{{% /dialog %}}
 
 Here is a list of controllers we support:
 
 * [Nginx Ingress Controller](doc:nginx-ingress-controller)
 
-##### :information_source: Read more
-> https://kubernetes.io/docs/concepts/services-networking/ingress
+{{% dialog type="info" icon="fa-info-circle" title="Read More" %}}
+https://kubernetes.io/docs/concepts/services-networking/ingress
+{{% /dialog %}}
diff --git a/content/kubernetes/kubernetes-pull-secrets.md b/content/kubernetes/kubernetes-pull-secrets.md
index 1e36fec59..5d419c885 100644
--- a/content/kubernetes/kubernetes-pull-secrets.md
+++ b/content/kubernetes/kubernetes-pull-secrets.md
@@ -33,9 +33,10 @@ kops create secret dockerconfig
 ```
 
 
-##### :information_source: READ MORE
-> [github.com/kubernetes/kops/blob/master/docs/cli/kops_create_secret_dockerconfig.md](https://github.com/kubernetes/kops/blob/master/docs/cli/kops_create_secret_dockerconfig.md)
 
+{{% dialog type="info" icon="fa-info-circle" title="Read More" %}}
+[github.com/kubernetes/kops/blob/master/docs/cli/kops_create_secret_dockerconfig.md](https://github.com/kubernetes/kops/blob/master/docs/cli/kops_create_secret_dockerconfig.md)
+{{% /dialog %}}
 
 # Kubernetes
 
diff --git a/content/project-management/gost-framework.md b/content/project-management/gost-framework.md
index ba45a391e..1d93c55aa 100644
--- a/content/project-management/gost-framework.md
+++ b/content/project-management/gost-framework.md
@@ -15,8 +15,9 @@ A goal defines a broad primary outcome. This is the business driver and should r
 
 **Example**: "Improve user productivity for most popular pages across our site"
 
-##### :information_source: HINT
-> The goal should not include any objectives, strategies or tactics. It's very high-level and should be easily understood by anyone in the business.
+{{% dialog type="tip" icon="fa-info-circle" title="Tip" %}}
+The goal should not include any objectives, strategies or tactics. It's very high-level and should be easily understood by anyone in the business.
+{{% /dialog %}}
 
 # Objectives
 
@@ -24,8 +25,9 @@ List of measurable outcomes that will be achieved by executing the strategies. O
 
 **Example**: "Reduce page load times by 25%"
 
-##### :information_source: HINT
-> Typlically, these objectives are described using the following terms: "minimize", "increase", "reduce", "eliminate".
+{{% dialog type="tip" icon="fa-info-circle" title="Tip" %}}
+Typically, these objectives are described using the following terms: "minimize", "increase", "reduce", "eliminate".
+{{% /dialog %}}
 
 # Strategies
 
@@ -33,8 +35,9 @@ The specific approach that will be taken to achieve a goal and objectives. They
 
 **Example**: "Use caching to reduce page load times"
 
-##### :information_source: HINT
-> Strategies should not encompass any tactics. That is, there might be multiple tacts that can be executed to fulfill the strategy. This is geared towards the CIO/CTO audience that might not be well versed on the tactics. For example, "Use Caching to reduce page load times"
+{{% dialog type="tip" icon="fa-info-circle" title="Tip" %}}
+Strategies should not encompass any tactics. That is, there might be multiple tacts that can be executed to fulfill the strategy. This is geared towards the CIO/CTO audience that might not be well versed on the tactics. For example, "Use Caching to reduce page load times"
+{{% /dialog %}}
 
 # Tactics
 
@@ -42,5 +45,6 @@ Tactics describe *how* specific tools will be used to implement the strategies.
 
 **Example**: "Use Memcache to cache API responses"
 
-##### :information_source: HINT
-> Tactics describe the exact solution that will be implemented by the engineering team. Typically, this is a list of technologies (E.g. MySQL, Memcache, Kubernetes, Helm, Docker, etc)
+{{% dialog type="tip" icon="fa-info-circle" title="Tip" %}}
+Tactics describe the exact solution that will be implemented by the engineering team. Typically, this is a list of technologies (E.g. MySQL, Memcache, Kubernetes, Helm, Docker, etc)
+{{% /dialog %}}
diff --git a/content/release-engineering/build-harness.md b/content/release-engineering/build-harness.md
index 63592d061..dade06b88 100644
--- a/content/release-engineering/build-harness.md
+++ b/content/release-engineering/build-harness.md
@@ -5,11 +5,11 @@ excerpt: ''
 
 The `build-harness` is a collection of [Makefiles](doc:makefile) to facilitate building stuff. It supports Golang projects, Dockerfiles, Helm charts, and much more.
 
-             |
------------- | --------------------------------------------------------------------------------------------------------------------------------------
-GitHub Repo  | <https://raw.githubusercontent.com/cloudposse/build-harness>
-Build Status | [![Build Status](https://travis-ci.org/cloudposse/build-harness.svg)](https://travis-ci.org/cloudposse/build-harness)
-Release      | [![Release](https://img.shields.io/github/release/cloudposse/build-harness.svg)](https://github.com/cloudposse/build-harness/releases)
+|              |                                                                                                                                        |
+|:-------------|:---------------------------------------------------------------------------------------------------------------------------------------|
+| GitHub Repo  | <https://raw.githubusercontent.com/cloudposse/build-harness>                                                                           |
+| Build Status | [![Build Status](https://travis-ci.org/cloudposse/build-harness.svg)](https://travis-ci.org/cloudposse/build-harness)                  |
+| Release      | [![Release](https://img.shields.io/github/release/cloudposse/build-harness.svg)](https://github.com/cloudposse/build-harness/releases) |
 
 It's designed to work with CI/CD systems such as Travis CI, CircleCI, CodeFresh and Jenkins.
 
@@ -39,12 +39,12 @@ Run `make help` for a list of available targets.
 
 We leverage the `build-harness` in nearly every project on our [GitHub](doc:github).
 
-                                                                                  |
---------------------------------------------------------------------------------- | --------------------------------------------------------------------------
-[`github-authorized-keys`](https://github.com/cloudposse/github-authorized-keys/) | A Golang project that leverages `docker/%`, `go/%`, `travis/%` targets
-[`charts`](https://github.com/cloudposse/charts/)                                 | A collection of Helm Charts that leverages `docker/%` and `helm/%` targets
-[`bastion`](https://github.com/cloudposse/bastion/)                               | A docker image that leverages `docker/%` and `bash/lint` targets
-[`terraform-null-label`](https://github.com/cloudposse/terraform-null-label/)     | A terraform module that leverages `terraform/%` targets
+|                                                                                   |                                                                            |
+|:----------------------------------------------------------------------------------|:---------------------------------------------------------------------------|
+| [`github-authorized-keys`](https://github.com/cloudposse/github-authorized-keys/) | A Golang project that leverages `docker/%`, `go/%`, `travis/%` targets     |
+| [`charts`](https://github.com/cloudposse/charts/)                                 | A collection of Helm Charts that leverages `docker/%` and `helm/%` targets |
+| [`bastion`](https://github.com/cloudposse/bastion/)                               | A docker image that leverages `docker/%` and `bash/lint` targets           |
+| [`terraform-null-label`](https://github.com/cloudposse/terraform-null-label/)     | A terraform module that leverages `terraform/%` targets                    |
 
 # Makefile Targets
 
diff --git a/layouts/partials/flex/body-beforecontent.html b/layouts/partials/flex/body-beforecontent.html
index cd31d4e41..724b60eed 100755
--- a/layouts/partials/flex/body-beforecontent.html
+++ b/layouts/partials/flex/body-beforecontent.html
@@ -100,7 +100,7 @@ <h1>The Cloud Posse Developer Hub</h1>
     {{- end}}
       <h1 class="title">{{.Title}}</h1>
       <div class="github-link">
-        <a href="{{ .Site.Params.editURL }}{{ replace .File.Dir "\\" "/" }}{{ .File.LogicalName }}" target="blank"><i class="fa fa-edit"></i>{{T "Edit-this-page"}}</a>
+        <a href="{{ .Site.Params.editURL }}/content/{{ .File.Path }}" target="blank"><i class="fa fa-edit"></i>{{T "Edit-this-page"}}</a>
       </div>
       <div class="excerpt">
         {{ if .Params.excerpt }}
diff --git a/static/css/custom.css b/static/css/custom.css
index 1e1efaaad..93c72fd1d 100644
--- a/static/css/custom.css
+++ b/static/css/custom.css
@@ -25,11 +25,61 @@ body > header nav.shortcuts li a {
   height: 2rem;
 }
 
+a, section a {
+    color: #364548;
+}
+
+a:hover {
+    color: #0a0d0e;
+}
+
+
+th:empty {
+  display: none;
+}
+
+
 /* fix for empty pages */
 section header {
   display: none;
 }
 
+section article.post {
+  display: inherit;
+}
+
+section article.post footer {
+  margin-left: 0;
+  padding-left: 0;
+}
+
+section.page > article > header > h2, section.page > article p {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+section.page > article.post > footer:empty.footline {
+  display: none;
+}
+
+section article header.post-header {
+  display: inherit;
+  position: relative;
+  background-color: transparent;
+  border-bottom: 0;
+  min-width: 100%;
+  padding-left: 0;
+}
+
+.post-header h2 {
+  background-color: transparent;
+  font-size: 1.2rem;
+}
+
+section article header:after {
+  background: transparent;
+}
+
 
 header .logo img {
   width: 174px;
@@ -117,6 +167,10 @@ aside#left-sidebar .menu .dd-item.active > div * {
   border-bottom: 0;
 }
 
+aside#left-sidebar .menu .dd-item.active > div a {
+  color: #fff;
+}
+
 aside#left-sidebar .menu .dd-item.active > div {
   color: #fff;
   background-color: #364548;
@@ -528,20 +582,20 @@ thead {
   border-bottom: 2px solid #eee;
 }
 
-footer .footline {
+body > footer .footline {
   display: block;
   padding-top: 0.2rem;
   padding-left: 5rem;
 }
 
-footer .footline .tags {
+body > footer .footline .tags {
   display: inline-block;
   float: left;
   font-size: 12px;
   margin-right: 10px;
 }
 
-footer .footline .tags, .footline .copyright {
+body > footer .footline .tags, body > .footline .copyright {
   display: inline-block;
   float: left;
 }
@@ -568,8 +622,9 @@ footer .footline .tags, .footline .copyright {
   padding-top: 13px;
   padding-bottom: 1px;
   padding-left: 23px;
-  margin-left: 31px;
+  margin-left: 0px;
   margin-bottom: 3em;
+  color: rgba(0,0,0,0.5);
 }
 
 .dialog p {
@@ -577,21 +632,22 @@ footer .footline .tags, .footline .copyright {
   padding-left: 22px;
   padding-bottom: 0;
   padding-top: 0;
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+
+.dialog p:empty {
+   display: none;
 }
 
 .dialog h4 {
-  margin-bottom: 10px;
+  margin-bottom: 0px;
+  margin-top: 2px;
   font-size: 14px;
   font-weight: bold;
   text-transform: uppercase;
 }
 
-.dialog.info, .dialog.info a {
-  background-color: #e3edf2;
-  border-color: #5bc0de;
-  color: rgba(0,0,0,0.5);
-}
-
 .dialog .fa {
     pointer-events: none;
     font-size: 18px;
@@ -606,3 +662,71 @@ footer .footline .tags, .footline .copyright {
 .dialog.info h4 {
    color: #5bc0de;
 }
+
+.dialog.info, .dialog.info a {
+  background-color: #e3edf2;
+  border-color: #5bc0de;
+}
+
+.dialog.important h4 {
+   color: #d9534f;
+}
+
+.dialog.important, .dialog.important a {
+  background-color: #fdf7f7;
+  border-color: #d9534f;
+}
+
+.dialog.warning h4 {
+   color: #f0ad4e;
+}
+
+.dialog.warning, .dialog.warning a {
+  background-color: #fcf8f2;
+  border-color: #f0ad4e;
+}
+
+.dialog.tip h4 {
+   color: #5bc0de;
+}
+
+.dialog.tip, .dialog.tip a {
+  background-color: #e3edf2;
+  border-color: #5bc0de;
+}
+
+.dialog.code-block {
+  width: 100%;
+  padding-left: 0;
+  margin-left: 0;
+  border-left: 0;
+  padding-top: 0;
+  position:relative;
+  left: -4rem;
+  width: 116%;
+}
+
+.dialog.code-block pre {
+  margin: 0;
+  padding-left: 13px;
+  padding-top: 5px;
+  padding-right: 13px;
+  padding-bottom: 5px;
+}
+
+.dialog.code-block h4 {
+  line-height: 2em;
+  font-size: 15px;
+  color: #333;
+  background-color: #eaeaea;
+  padding-left: 18px;
+  margin-bottom: 0;
+}
+
+.dialog.code-block, .dialog.code-block a {
+  border-color: transparent;
+  background-color: #f6f6f6;
+  margin-bottom: 2em;
+}
+
+