From 9bfddade5efaedbceb6c9233e486977e56649696 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Glauco=20Cust=C3=B3dio?= <glauco.custodio@gmail.com>
Date: Sat, 20 Jul 2024 10:01:00 +0100
Subject: [PATCH] add example

---
 .vscode/settings.json    |  5 ++++
 _config.yml              | 11 ++++++-
 _sass/custom/custom.scss | 43 +++++++++++++++++++++++++++
 index.html               | 63 ++++++++++++++++++++++++++++++++++++++++
 index.md                 | 35 ----------------------
 5 files changed, 121 insertions(+), 36 deletions(-)
 create mode 100644 .vscode/settings.json
 create mode 100644 _sass/custom/custom.scss
 create mode 100644 index.html
 delete mode 100644 index.md

diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..65e7b97
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,5 @@
+{
+  "[html]": {
+    "editor.formatOnSave": false
+  },
+}
diff --git a/_config.yml b/_config.yml
index 5cab035..bc8e45f 100644
--- a/_config.yml
+++ b/_config.yml
@@ -5,4 +5,13 @@ theme: just-the-docs
 url: https://evenbetterspecs.github.io
 
 aux_links:
-  Template Repository: https://github.com/just-the-docs/just-the-docs-template
+  GitHub: https://github.com/evenbetterspecs/
+
+# External navigation links
+nav_external_links:
+  - title: Describe what you are testing
+    url: "#describe"
+    hide_icon: true
+  - title: Use context
+    url: "#use-context"
+    hide_icon: true
diff --git a/_sass/custom/custom.scss b/_sass/custom/custom.scss
new file mode 100644
index 0000000..3d1cbe1
--- /dev/null
+++ b/_sass/custom/custom.scss
@@ -0,0 +1,43 @@
+.bad,
+.good {
+  background: #e8e8e8;
+  padding: 5px 0px 0px 0;
+
+  &::before {
+    padding: 0 10px;
+  }
+
+  .highlight {
+    margin-top: 3px;
+  }
+}
+
+.bad {
+  color: red;
+
+  &::before {
+    content: "BAD";
+  }
+}
+
+.good {
+  color: green;
+
+  &::before {
+    content: "GOOD";
+  }
+}
+
+.main-content {
+  article:not(:last-child) {
+    margin-bottom: 4em;
+  }
+
+  h2 {
+    &:first-child {
+      margin-top: 0;
+    }
+
+    margin-bottom: 0.75em;
+  }
+}
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..df84f9e
--- /dev/null
+++ b/index.html
@@ -0,0 +1,63 @@
+---
+title: Home
+layout: home
+---
+
+<article>
+  <h2 id="describe">
+    <a href="#describe">
+      Describe what you are testing
+    </a>
+  </h2>
+
+  <p>Be clear about what method you are describing. For instance, use the Ruby documentation convention of <code>.</code> when referring to a class method's name and <code>#</code> when referring to an instance method's name.</p>
+
+  <div class="bad">
+{% highlight ruby %}
+describe 'the authenticate method for User' do
+describe 'if the user is an admin' do
+{% endhighlight %}
+  </div>
+
+  <div class="good">
+{% highlight ruby %}
+describe '.authenticate' do
+describe '#admin?' do
+{% endhighlight %}
+  </div>
+</article>
+
+
+<article>
+  <h2 id="use-context">
+    <a href="#use-context">
+      Use context
+    </a>
+  </h2>
+
+  <p>Contexts are a powerful way to make your tests clear and well organized (they keep tests easy to read). They should start with <code>when</code>.</p>
+
+  <div class="bad">
+{% highlight ruby %}
+it 'has 200 status code if logged in' do
+  expect(response).to respond_with 200
+end
+
+it 'has 401 status code if not logged in' do
+  expect(response).to respond_with 401
+end
+{% endhighlight %}
+  </div>
+
+  <div class="good">
+{% highlight ruby %}
+context 'when logged in' do
+  it { is_expected.to respond_with 200 }
+end
+
+context 'when logged out' do
+  it { is_expected.to respond_with 401 }
+end
+{% endhighlight %}
+  </div>
+</article>
diff --git a/index.md b/index.md
deleted file mode 100644
index ca0c545..0000000
--- a/index.md
+++ /dev/null
@@ -1,35 +0,0 @@
----
-title: Home
-layout: home
----
-
-This is a *bare-minimum* template to create a Jekyll site that uses the [Just the Docs] theme. You can easily set the created site to be published on [GitHub Pages] – the [README] file explains how to do that, along with other details.
-
-If [Jekyll] is installed on your computer, you can also build and preview the created site *locally*. This lets you test changes before committing them, and avoids waiting for GitHub Pages.[^1] And you will be able to deploy your local build to a different platform than GitHub Pages.
-
-More specifically, the created site:
-
-- uses a gem-based approach, i.e. uses a `Gemfile` and loads the `just-the-docs` gem
-- uses the [GitHub Pages / Actions workflow] to build and publish the site on GitHub Pages
-
-Other than that, you're free to customize sites that you create with this template, however you like. You can easily change the versions of `just-the-docs` and Jekyll it uses, as well as adding further plugins.
-
-[Browse our documentation][Just the Docs] to learn more about how to use this theme.
-
-To get started with creating a site, simply:
-
-1. click "[use this template]" to create a GitHub repository
-2. go to Settings > Pages > Build and deployment > Source, and select GitHub Actions
-
-If you want to maintain your docs in the `docs` directory of an existing project repo, see [Hosting your docs from an existing project repo](https://github.com/just-the-docs/just-the-docs-template/blob/main/README.md#hosting-your-docs-from-an-existing-project-repo) in the template README.
-
-----
-
-[^1]: [It can take up to 10 minutes for changes to your site to publish after you push the changes to GitHub](https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/creating-a-github-pages-site-with-jekyll#creating-your-site).
-
-[Just the Docs]: https://just-the-docs.github.io/just-the-docs/
-[GitHub Pages]: https://docs.github.com/en/pages
-[README]: https://github.com/just-the-docs/just-the-docs-template/blob/main/README.md
-[Jekyll]: https://jekyllrb.com
-[GitHub Pages / Actions workflow]: https://github.blog/changelog/2022-07-27-github-pages-custom-github-actions-workflows-beta/
-[use this template]: https://github.com/just-the-docs/just-the-docs-template/generate