From b5e882f07e146296bb6ae6cce244ce521330ac51 Mon Sep 17 00:00:00 2001
From: Nguyen Thanh Quang <admin@xwork.space>
Date: Sat, 28 Aug 2021 05:33:32 +0700
Subject: [PATCH] feat(themes): added dracula theme (#92)

* added dracula theme

* change border color from white

Co-authored-by: dicedtomato <35403473+diced@users.noreply.github.com>
---
 src/components/Theming.tsx |  7 +++++--
 src/lib/themes/dracula.ts  | 17 +++++++++++++++++
 2 files changed, 22 insertions(+), 2 deletions(-)
 create mode 100644 src/lib/themes/dracula.ts

diff --git a/src/components/Theming.tsx b/src/components/Theming.tsx
index f0c6221e..7bfd501d 100644
--- a/src/components/Theming.tsx
+++ b/src/components/Theming.tsx
@@ -8,6 +8,7 @@ import ayu_mirage from 'lib/themes/ayu_mirage';
 import ayu_light from 'lib/themes/ayu_light';
 import nord from 'lib/themes/nord';
 import polar from 'lib/themes/polar';
+import dracula from 'lib/themes/dracula';
 import { useStoreSelector } from 'lib/redux/store';
 import createTheme from 'lib/themes';
 
@@ -18,7 +19,8 @@ export const themes = {
   'ayu_mirage': ayu_mirage,
   'ayu_light': ayu_light,
   'nord': nord,
-  'polar': polar
+  'polar': polar,
+  'dracula': dracula
 };
 
 export const friendlyThemeName = {
@@ -28,7 +30,8 @@ export const friendlyThemeName = {
   'ayu_mirage': 'Ayu Mirage',
   'ayu_light': 'Ayu Light',
   'nord': 'Nord',
-  'polar': 'Polar'
+  'polar': 'Polar',
+  'dracula': 'Dracula'
 };
 
 export default function ZiplineTheming({ Component, pageProps }) {
diff --git a/src/lib/themes/dracula.ts b/src/lib/themes/dracula.ts
new file mode 100644
index 00000000..a0afe9f3
--- /dev/null
+++ b/src/lib/themes/dracula.ts
@@ -0,0 +1,17 @@
+// https://github.com/AlphaNecron/
+// https://github.com/dracula/dracula-theme
+import createTheme from '.';
+
+export default createTheme({
+  type: 'dark',
+  primary: '#BD93F9',
+  secondary: '#6272A4',
+  error: '#FF5555',
+  warning: '#FFB86C',
+  info: '#8BE9FD',
+  border: '#7D8096',
+  background: {
+    main: '#282A36',
+    paper: '#44475A'
+  }
+});