From 78a1baa26b1dd57ed6d89a33fc2e898782ed7e45 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9B=90=EB=8D=94?= <wonderbotsupport@naver.com>
Date: Mon, 1 Feb 2021 20:41:58 +0900
Subject: [PATCH] styles: added styles

---
 app.css                   | 39 +++++++++++++++++++++++++++++++++++++++
 components/Form/Input.tsx |  5 ++---
 components/Tag.tsx        |  2 +-
 3 files changed, 42 insertions(+), 4 deletions(-)

diff --git a/app.css b/app.css
index 2e5ae16..7b03d89 100644
--- a/app.css
+++ b/app.css
@@ -30,6 +30,45 @@ body {
   min-height: 100vh;
 }
 
+.__control--is-focused {
+  border: none !important;
+  box-shadow: none !important;
+}
+
 i {
   width: 20px
+}
+
+* ::-webkit-scrollbar {
+  -webkit-appearance: none;
+  width: 8px;
+  height: 8px;
+}
+
+* ::-webkit-scrollbar-thumb, html ::-webkit-scrollbar-thumb {
+  cursor: pointer;
+  border-radius: 5px;
+  background: #ccc;
+  -webkit-transition: color .2s ease;
+  transition: color .2s ease;
+}
+
+.dark * ::-webkit-scrollbar-thumb, html.dark ::-webkit-scrollbar-thumb {
+  cursor: pointer;
+  border-radius: 5px;
+  background: #202225;
+  -webkit-transition: color .2s ease;
+  transition: color .2s ease;
+}
+
+* ::-webkit-scrollbar-track, html ::-webkit-scrollbar-track {
+  background: #f2f2f2;
+  border-radius: 0;
+  border: 4px solid transparent;
+  border-radius: 8px;
+}
+
+.dark * ::-webkit-scrollbar-track, html.dark ::-webkit-scrollbar-track {
+  background: #2e3338;
+  border-radius: 0;
 }
\ No newline at end of file
diff --git a/components/Form/Input.tsx b/components/Form/Input.tsx
index 58c16d0..48ed985 100644
--- a/components/Form/Input.tsx
+++ b/components/Form/Input.tsx
@@ -1,7 +1,7 @@
 import { Field } from 'formik'
 
 const Input = ({ name, placeholder }:InputProps):JSX.Element => {
-	return <Field name={name} className='text-black w-full h-10 border border-grey-light rounded px-3 relative focus:shadow outline-none' placeholder={placeholder}/>
+	return <Field name={name} className='border border-grey-light dark:border-transparent text-black dark:bg-very-black dark:text-white w-full h-10 rounded px-3 relative outline-none' placeholder={placeholder}/>
 }
 
 interface InputProps {
@@ -9,5 +9,4 @@ interface InputProps {
   placeholder?: string
 }
 
-export default Input
-
+export default Input
\ No newline at end of file
diff --git a/components/Tag.tsx b/components/Tag.tsx
index 24368dc..e07db10 100644
--- a/components/Tag.tsx
+++ b/components/Tag.tsx
@@ -60,7 +60,7 @@ const Tag = ({
 						? 'font-bg dark:text-white bg-discord-blurple text-black'
 						: github
 							? 'bg-gray-900 text-white'
-							: 'bg-little-white-hover dark:bg-very-black'
+							: `bg-little-white-hover dark:bg-very-black ${props.onClick ? 'hover:bg-little-white dark:hover:bg-discord-dark-hover transition duration-100 ease-in' : '' }`
 					: `bg-little-white dark:bg-discord-black ${props.onClick ? 'hover:bg-little-white-hover dark:hover:bg-discord-dark-hover transition duration-100 ease-in' : '' }`
 			} ${!blurple && !github ? 'text-black dark:text-gray-400' : ''} ${
 				circular ? `rounded-3xl ${bigger ? 'px-3.5 py-2.5' : 'px-2.5 py-1.5'}` : `rounded ${bigger ? 'px-3 py-2' : 'px-2 py-1'}`