Merge pull request #137 from stanleyowen/v0.5.1

Version 0.5.1

README.md

@@ -8,10 +8,10 @@
 [![Netlify Status](https://api.netlify.com/api/v1/badges/56772f5c-0c69-41e8-a788-69ca591e70ef/deploy-status)](https://app.netlify.com/sites/todoapp-task/deploys)
 
 ## Login Freely with OAuth
-![Login with OAuth](https://user-images.githubusercontent.com/69080584/113655970-16ca1c00-96c5-11eb-836e-83e0c58cbe2b.png)
+![Login with OAuth](https://user-images.githubusercontent.com/69080584/117276341-00aca880-ae89-11eb-90b8-730f543a726e.png)
 
 ## Built In Multi Factor Authentication (MFA)
-![Multi Factor Authentication](https://user-images.githubusercontent.com/69080584/115656260-1eddb900-a35f-11eb-8c6f-fa24196704b6.png)
+![Multi Factor Authentication](https://user-images.githubusercontent.com/69080584/117276484-25a11b80-ae89-11eb-8034-d5a5d4ef4c93.png)
 
 ## User Interface
 ![Todo Application](https://user-images.githubusercontent.com/69080584/113655834-c488fb00-96c4-11eb-9479-be2e0e4acc62.png)
@@ -32,7 +32,7 @@ Todo Application is an **open source** project, completed with **highest standar
   There are some several quick start options available:
     - [Fork this repository](https://github.com/stanleyowen/todo-application/fork)
     - Clone this repository, type `https://github.com/stanleyowen/todo-application.git` in command line
-    - [Download the latest release](https://github.com/stanleyowen/todo-application/archive/v0.5.0.zip)
+    - [Download the latest release](https://github.com/stanleyowen/todo-application/archive/v0.5.1.zip)
 2. Install All the Dependencies
     - Open your terminal
     - Change directory `cd` to both `client` and `server` folder

client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "client",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "private": true,
   "dependencies": {
     "@date-io/date-fns": "^1.3.13",

client/src/App.css

@@ -1,4 +1,4 @@
-/*! Todo Application - CSS Version 0.5.0 Copyright 2021, Stanley Owen */
+/*! Todo Application - CSS Version 0.5.1 Copyright 2021, Stanley Owen */
 @import url('https://fonts.googleapis.com/css2?family=Chilanka&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');
 * {
@@ -79,8 +79,9 @@ body.dark .modal__closeBtn {
     color: #FFFFFF;
 }
 body.dark .main__title,
-body.dark .projects__viewMore {
-    color: #79c3ff;
+body.dark .projects__viewMore,
+body.dark .link {
+    color: #79c3ff !important;
 }
 body.dark .navbar { box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14),0 1px 10px 0 rgba(0,0,0,0.12),0 2px 4px -1px rgba(0,0,0,0.2); }
 body.dark .footer { background-color: #191919; }
@@ -108,6 +109,7 @@ body.dark .btn__value {
 }
 body.dark .MuiInput-underline:after { border-bottom: 2px solid #FFFFFF !important; }
 body.dark .MuiInput-underline:hover:not(.Mui-disabled):before { border-bottom: 1px solid #7c7c7c !important; }
+.MuiSvgIcon-root { color: #212121; }
 button, a { user-select: none; cursor: pointer; }
 label { user-select: none; }
 .privacy-policy {
@@ -158,7 +160,6 @@ label { user-select: none; }
     padding: 10px;
 }
 .oauth-box p {
-    font-family: cursive;
     font-size: 18px;
     display: inline-block;
     margin-top: auto;
@@ -176,8 +177,12 @@ label { user-select: none; }
 }
 .success { color: rgb(18, 214, 0); margin-right: 5px }
 .danger { color: rgb(252, 52, 52); margin-right: 5px }
-.flex { display: flex !important; }
+.button { font-size: 18px; }
+.flex { display: flex !important; flex-wrap: wrap; }
+.flex p { flex: 50%; }
+.m-5 { margin: 5px !important; }
 .m-10 { margin: 10px !important; }
+.p-12 { padding: 12px !important; }
 .ml-10 { margin-left: 10px !important; }
 .mr-10 { margin-right: 10px !important; }
 .mt-10 { margin-top: 10px !important; }
@@ -193,11 +198,10 @@ label { user-select: none; }
 .full-width { width: 100% !important; }
 .no-border, .no-border tr td  { border: none !important; }
 .no-outline { outline: none !important; }
-.disabled {
+.disabled, .disabled:hover {
     cursor: auto;
     opacity: 0.7;
 }
-.disabled:hover { background-color: transparent!important; color: #1a73e8!important; }
 .loader {
     position: fixed;
     background-color: rgba(255, 255, 255, 0.61);
@@ -563,6 +567,7 @@ tbody tr:hover {
 .showModal { animation: grow 0.15s ease-in forwards; }
 .closeModal { animation: shrink 0.2s ease-out forwards; }
 .hiddenModal { opacity: 0; visibility: hidden; }
+.float-right { float: right; }
 .modal__body { padding: 10px; text-decoration: none; }
 .modal__bodyImg {
     display: block;
@@ -710,6 +715,7 @@ img {
     box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .30), 0 2px 6px 2px rgba(60, 64, 67, .15);
 }
 .form__container {
+    width: 100%;
     display: grid;
     grid-template-columns: auto auto;
 }
@@ -812,7 +818,7 @@ blockquote{
     font-size: 16px;
     line-height: 1.2;
     color: rgb(0, 0, 0);
-    text-align: justify;
+    text-align: left;
     border-left: 7px solid #ffe564;
     /* -moz-box-shadow: 2px 2px 15px #ccc;
     -webkit-box-shadow: 2px 2px 15px #ccc;
@@ -827,6 +833,7 @@ blockquote a{
 }
 blockquote a:hover{ color: #666; }
 blockquote em {font-style: italic;}
+.block { display: block; }
 .small { font-size: 14px; }
 .full td { width: 70%; text-align: left; }
 .view-eye {
@@ -845,6 +852,30 @@ blockquote em {font-style: italic;}
     font-weight: bold;
     margin-left: 10px;
 }
+.link {
+    text-decoration: none;
+    font-weight: bold;
+}
+.link:focus { color: #004299 !important; }
+.link:visited { color: blue; }
+.otp input {
+    margin: 3px;
+    width: 40px;
+    height: 40px;
+    font-size: 20px;
+    text-align: center;
+    border-radius: 5px;
+    border-style: solid;
+    border-color: #f1f1f1 !important;
+}
+.otp input:focus {
+    color: #3F4254;
+    background-color: #EBEDF3;
+    border-color: #1a73e8 !important;
+    outline: 0;
+    transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
+}
+.justify-center { justify-content: center; }
 @keyframes octocat-wave {
     0%,100%{transform:rotate(0)}
     20%,60%{transform:rotate(-25deg)}
@@ -1010,8 +1041,9 @@ blockquote em {font-style: italic;}
 @media only screen and (max-width: 600px) {
     .animation__message { width: 100%; height: auto; }
     .btn__outline { width: 65%; }
-    .oauth-box p { font-family: sans-serif; }
     .privacy-policy { margin: 0 15px; }
+    .flex p { flex: 100%; }
+    .flex p button { margin-left: 0px !important; margin-right: 0px !important; margin-top: 10px !important; }
 }
 @media (max-width:500px){
     .github-corner:hover .octo-arm{animation:none}