final touches

This commit was merged in pull request #53.
This commit is contained in:
Chukwumdiebube
2023-02-11 22:27:56 +01:00
parent ac505a3211
commit 8181fceb6f
2 changed files with 44 additions and 10 deletions
+33 -6
View File
@@ -23,6 +23,7 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
* {
min-height: 0;
min-width: 0;
@@ -657,7 +658,7 @@ TODO: Responsive ===========================
.children-element {
left: 0;
top: 0;
webkit-transform: none;
-webkit-transform: none;
transform: none;
}
}
@@ -685,11 +686,24 @@ TODO: Responsive ===========================
border-radius: 7px !important;
}
.dark .react-calendar{
background: #11131F;
color: #7B818D;
border: 1px solid #25284F;
}
.dark .react-calendar__navigation button:enabled:hover,
.dark .react-calendar__navigation button:enabled:focus,
.dark .react-calendar__tile:disabled,
.dark .react-calendar__navigation button:disabled{background: #1D1F2F;}
.react-calendar__navigation{
margin-top: 2px;
margin-inline: 2px;
}
.react-calendar__tile--active{color: #fff; font-weight: bold; background-color: #006edc;}
.dark .react-calendar__tile--active{color: #fff;}
.react-calendar__navigation button:enabled:hover,
.react-calendar__navigation button:enabled:focus{
@apply rounded-full transition duration-500
@@ -713,13 +727,19 @@ TODO: Responsive ===========================
transition: all 500ms;
}
.dark .react-calendar__tile{background: #11131F;}
.reminder-select select{
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: url("data:image/svg+xml,<svg height='10px' width='10px' viewBox='0 0 16 16' fill='%23000000' xmlns='http://www.w3.org/2000/svg'><path d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/></svg>") no-repeat #fafafa;
background-position: calc(100% - 0.75rem) center !important;
box-shadow: 0 0 0.5em 0 rgba(194, 194, 194, 0.2);
border: 0.5px solid #E3E4FE;
}
.dark .reminder-select select {
border: 0.5px solid #25284F;
}
.reminder-select select::-ms-expand {
@@ -740,17 +760,21 @@ TODO: Responsive ===========================
/* Date Picker */
.react-date-picker__wrapper{
border: 0;
box-shadow: 0 0 0.5em 0 rgb(194 194 194 / 20%);
border: 0.5px solid #E3E4FE;
padding: 1.25rem;
background: #fafafa;
border-radius: 9999px;
}
.dark .react-date-picker__wrapper {border: 0.5px solid #25284F;}
.dark .react-date-picker__wrapper{
background: #1a3544;
background: #11131F;
color: #7B818D;
}
.dark .react-date-picker__button svg{stroke: #7B818D;}
.react-date-picker__calendar .react-calendar{
min-height: 18.4rem;
}
@@ -759,6 +783,9 @@ TODO: Responsive ===========================
height: 40px !important;
}
.react-date-picker__inputGroup__input{
.react-date-picker__inputGroup__input,
.react-date-picker__inputGroup__divider,
.react-date-picker__inputGroup__leadingZero{
cursor: pointer;
color: #374151;
}