From 5d1f8af7d3ef65abc5d107eb207a23797639c53e Mon Sep 17 00:00:00 2001
From: James Panther <4462786+jpanther@users.noreply.github.com>
Date: Sat, 6 Nov 2021 16:32:34 +1100
Subject: [PATCH] =?UTF-8?q?=F0=9F=93=9D=20Add=20link=20styles=20demo=20pag?=
 =?UTF-8?q?e?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 exampleSite/config.toml                  |  5 +++
 exampleSite/content/styles.md            | 47 ++++++++++++++++++++++++
 exampleSite/layouts/shortcodes/link.html |  8 ++++
 3 files changed, 60 insertions(+)
 create mode 100644 exampleSite/content/styles.md
 create mode 100644 exampleSite/layouts/shortcodes/link.html

diff --git a/exampleSite/config.toml b/exampleSite/config.toml
index fc2c119..baac176 100644
--- a/exampleSite/config.toml
+++ b/exampleSite/config.toml
@@ -9,6 +9,7 @@ disableKinds = ["taxonomy", "term"]
   image = "author.jpg"
   links = [
     { link = { href = "readme/", text = "View the readme" } },
+    { link = { href = "styles/", text = "All the link styles" } },
     { github = "https://github.com/jpanther/lynx" },
     { twitter = "https://twitter.com/jpanther" },
     { font-awesome = { href = "https://fontawesome.com/", text = "FontAwesome" } },
@@ -16,3 +17,7 @@ disableKinds = ["taxonomy", "term"]
 
 [markup.highlight]
   noClasses = false
+
+[markup.goldmark]
+[markup.goldmark.renderer]
+  unsafe = true
diff --git a/exampleSite/content/styles.md b/exampleSite/content/styles.md
new file mode 100644
index 0000000..a370f0a
--- /dev/null
+++ b/exampleSite/content/styles.md
@@ -0,0 +1,47 @@
+---
+title: Link styles
+---
+
+These are all the built-in link styles available in Lynx. Don't forget that you can also create your own styles --- check the [readme]({{< ref "readme#adding-custom-icons-and-link-styles" >}}) for more details.
+<br><br>
+
+</section>
+<section>
+<div class="flex flex-col flex-wrap min-w-full mt-4 sm:min-w-0">
+{{< link email >}}
+{{< link link >}}
+{{< link amazon >}}
+{{< link apple >}}
+{{< link codepen >}}
+{{< link dev >}}
+{{< link discord >}}
+{{< link dribbble >}}
+{{< link facebook >}}
+{{< link flickr >}}
+{{< link foursquare >}}
+{{< link github >}}
+{{< link gitlab >}}
+{{< link google >}}
+{{< link instagram >}}
+{{< link keybase >}}
+{{< link kickstarter >}}
+{{< link lastfm >}}
+{{< link linkedin >}}
+{{< link mastodon >}}
+{{< link medium >}}
+{{< link microsoft >}}
+{{< link patreon >}}
+{{< link pinterest >}}
+{{< link reddit >}}
+{{< link slack >}}
+{{< link snapchat >}}
+{{< link soundcloud >}}
+{{< link steam >}}
+{{< link telegram >}}
+{{< link tiktok >}}
+{{< link tumblr >}}
+{{< link twitch >}}
+{{< link twitter >}}
+{{< link whatsapp >}}
+{{< link youtube >}}
+</div>
diff --git a/exampleSite/layouts/shortcodes/link.html b/exampleSite/layouts/shortcodes/link.html
new file mode 100644
index 0000000..552b1d1
--- /dev/null
+++ b/exampleSite/layouts/shortcodes/link.html
@@ -0,0 +1,8 @@
+<a
+  class="link link-{{ .Get 0 }} sm:px-24 min-w-full py-2 mb-3 text-lg rounded"
+  href="#"
+  onclick="navigator.clipboard.writeText({{ .Get 0 }})"
+>
+  <span class="mr-1">{{ partial "icon.html" (.Get 0) }}</span>
+  {{ .Get 0 }}
+</a>