From 5919e6f59163fff5f639635392721b4631d66070 Mon Sep 17 00:00:00 2001
From: Xiao Rong W <xr_wong@hotmail.com>
Date: Thu, 18 Jun 2020 01:23:08 +0800
Subject: [PATCH] hide overflow on date input

---
 src/App.css                          | 8 ++++++--
 src/components/TodoInputComponent.js | 2 +-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/App.css b/src/App.css
index ee916dc..dbfd623 100644
--- a/src/App.css
+++ b/src/App.css
@@ -104,18 +104,22 @@ span.today-date {
   border-width: 0.5px;
 }
 
+/* images */
 .emoji {
   /* opacity: 0.7; */
   width: 27px;
   margin-right: 3px;
 }
-
 .today-img {
   width: 70px;
   /* margin-right: 10px; */
 }
-
 .addtask-img {
   width: 22px;
   margin-right: 10px;
+}
+
+.SingleDatePickerInput {
+  border-radius: 5px;
+  overflow: hidden;
 }
\ No newline at end of file
diff --git a/src/components/TodoInputComponent.js b/src/components/TodoInputComponent.js
index 85b5b83..7de16d9 100644
--- a/src/components/TodoInputComponent.js
+++ b/src/components/TodoInputComponent.js
@@ -58,7 +58,7 @@ class TodoInput extends Component {
                 <div className='row'>
                     <div className='col'>
                         <Card body className='task-input'
-                        style={{backgroundColor:'rgba(136, 144, 133, 0.7)', borderColor: 'rgb(235, 236, 231)', marginTop:'10px', borderRadius:'20px'}}>
+                        style={{backgroundColor:'rgba(136, 144, 133, 0.6)', borderColor: 'rgb(235, 236, 231)', marginTop:'10px', borderRadius:'20px'}}>
                             <div className='container'>
                                 <div className='row d-flex justify-content-center align-items-center'>
                                     <div className='col-sm-12 col-lg-1 d-flex justify-content-center align-self-center'>