From 39c53bb59718184b383f303aa4be1abe749a905e Mon Sep 17 00:00:00 2001
From: Enes Ozturk <enesozturk.d@gmail.com>
Date: Fri, 5 Mar 2021 11:01:21 +0300
Subject: [PATCH] docs: update footer and docs

---
 website/docs/getting-started.md            |  9 ++++----
 website/docs/usage.md                      |  1 -
 website/docusaurus.config.js               |  2 --
 website/src/theme/Footer/index.js          | 24 ++++++++++++++++++++++
 website/src/theme/Footer/styles.module.css | 17 +++++++++++++++
 5 files changed, 46 insertions(+), 7 deletions(-)
 create mode 100644 website/src/theme/Footer/index.js
 create mode 100644 website/src/theme/Footer/styles.module.css

diff --git a/website/docs/getting-started.md b/website/docs/getting-started.md
index 4ed8060..984bcec 100644
--- a/website/docs/getting-started.md
+++ b/website/docs/getting-started.md
@@ -13,10 +13,11 @@ A performant, easy to use hold to open context menu for React Native powered by
 
 ## Features
 
-- Powered with Reanimated v2 🚀
-- Easy to use 😊
-- Dark/Light Mode 🌚
-- Device orientation change
+- Powered with Reanimated v2. 🚀
+- Smooth interactions & animations.
+- Supports dark/light Mode. 🌚 🌝
+- Supports device orientation change.
+- Compatible with Expo.
 - Written in `TypeScript`.
 
 ## Installation
diff --git a/website/docs/usage.md b/website/docs/usage.md
index 85c0218..fea6cfb 100644
--- a/website/docs/usage.md
+++ b/website/docs/usage.md
@@ -13,7 +13,6 @@ Before using Hold Menu in your application, you need to wrap your app with `Hold
 ```tsx
 import React from 'react';
 
-// Hold Menu
 import { HoldMenuProvider } from 'react-native-hold-menu';
 
 const App = () => {
diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js
index d27916f..97c203c 100644
--- a/website/docusaurus.config.js
+++ b/website/docusaurus.config.js
@@ -30,8 +30,6 @@ module.exports = {
     },
     footer: {
       style: 'dark',
-      links: [],
-      copyright: `Copyright © ${new Date().getFullYear()} React Native Hold Menu. Built with Docusaurus.`,
     },
   },
   presets: [
diff --git a/website/src/theme/Footer/index.js b/website/src/theme/Footer/index.js
new file mode 100644
index 0000000..0e592ea
--- /dev/null
+++ b/website/src/theme/Footer/index.js
@@ -0,0 +1,24 @@
+import React from 'react';
+import styles from './styles.module.css';
+
+function Footer() {
+  return (
+    <footer className={styles.footerContainer}>
+      <div className={styles.footerLeft}>
+        Copyright © {new Date().getFullYear()}{' '}
+        <a rel="author" href="https://twitter.com/enesozt_" target="_blank">
+          Enes Öztürk
+        </a>
+      </div>
+      <div className={styles.footerRight}>
+        Built with{' '}
+        <a rel="nofollow" href="https://v2.docusaurus.io/" target="_blank">
+          Docusaurus
+        </a>{' '}
+        ❤️
+      </div>
+    </footer>
+  );
+}
+
+export default Footer;
diff --git a/website/src/theme/Footer/styles.module.css b/website/src/theme/Footer/styles.module.css
new file mode 100644
index 0000000..117eb62
--- /dev/null
+++ b/website/src/theme/Footer/styles.module.css
@@ -0,0 +1,17 @@
+.footerContainer {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  height: var(--ifm-navbar-height);
+  padding: var(--ifm-navbar-padding-vertical)
+    var(--ifm-navbar-padding-horizontal);
+  background: var(--ifm-navbar-background-color);
+}
+
+.footerRight {
+  float: right;
+}
+.footerLeft {
+  float: left;
+}