From 5c5ffd0a92fe3fab01e1c5400badcbd2bfc2a758 Mon Sep 17 00:00:00 2001
From: Ava Gaiety Wroten <ava@wroten.me>
Date: Fri, 31 Dec 2021 12:25:52 -0600
Subject: [PATCH] feat: twitter feed

---
 components/TwitterFeed.vue | 28 ++++++++++++++++++++++++++++
 nuxt.config.js             |  7 +++++++
 pages/index.vue            |  1 +
 3 files changed, 36 insertions(+)
 create mode 100644 components/TwitterFeed.vue

diff --git a/components/TwitterFeed.vue b/components/TwitterFeed.vue
new file mode 100644
index 0000000..dfbc79a
--- /dev/null
+++ b/components/TwitterFeed.vue
@@ -0,0 +1,28 @@
+<template>
+  <div>
+    <div class="relative mb-12">
+      <div class="absolute inset-0 flex items-center" aria-hidden="true">
+        <div class="w-full border-t border-gray-300" />
+      </div>
+      <div class="relative flex items-center justify-between">
+        <span class="pr-3 text-lg font-medium text-gray-900"> Feed </span>
+        <a
+          href="https://twitter.com/FaetaleTTRPG?ref_src=twsrc%5Etfw"
+          class="inline-flex items-center shadow-sm px-4 py-1.5 border border-gray-300 text-sm leading-5 font-medium rounded-full text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
+          data-dnt="true"
+          data-show-count="false"
+        >
+          Follow @FaetaleTTRPG
+        </a>
+      </div>
+    </div>
+    <a
+      class="twitter-timeline"
+      data-dnt="true"
+      data-theme="light"
+      href="https://twitter.com/FaetaleTTRPG?ref_src=twsrc%5Etfw"
+    >
+      Tweets by FaetaleTTRPG
+    </a>
+  </div>
+</template>
diff --git a/nuxt.config.js b/nuxt.config.js
index 2c04445..e51e768 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -110,6 +110,13 @@ export default {
       },
       { rel: 'manifest', href: '/icon/manifest.json' },
     ],
+    script: [
+      {
+        hid: 'twitter',
+        defer: true,
+        src: 'https://platform.twitter.com/widgets.js',
+      },
+    ],
   },
 
   router: {
diff --git a/pages/index.vue b/pages/index.vue
index abc2d59..4592498 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -16,6 +16,7 @@
               :next-page-token="nextPageToken"
             />
           </div>
+          <TwitterFeed />
         </div>
       </div>
     </main>