Misc CSS fixes (#334)

bit-gpt · Aug 24, 2023 · bd3f0b5 · bd3f0b5
1 parent ef0b898
commit bd3f0b5
Show file tree

Hide file tree

Showing 9 changed files with 20 additions and 21 deletions.
diff --git a/src/assets/css/service.css b/src/assets/css/service.css
@@ -83,7 +83,7 @@ p.service-is__not-running {
 
 .service-card {
   box-shadow: 0 4px 24px -1px rgba(0, 0, 0, 0.2);
-  @apply p-7 dark:text-white gap-6 flex items-center relative bg-transparent rounded-[10px] xl:w-[330px] md:w-[265px] w-full max-md:max-w-[300px];
+  @apply p-7 text-white gap-6 flex items-center relative bg-transparent rounded-[10px] xl:w-[330px] md:w-[265px] w-full max-md:max-w-[300px];
 }
 
 .service-card::before,
@@ -111,7 +111,7 @@ p.service-is__not-running {
 }
 
 .service-card .btn-outline-circle {
-  @apply border-[1.5px] dark:border-grey-300 dark:text-grey-300 mt-[55px] flex items-center;
+  @apply border-[1.5px] border-grey-300 text-grey-300 mt-[55px] flex items-center;
 }
 
 .service-card .btn-outline-circle:hover {

diff --git a/src/assets/css/sidebar.css b/src/assets/css/sidebar.css
@@ -7,7 +7,7 @@
 }
 
 .sidebar li a {
-  @apply w-full flex dark:text-grey-200 text-base font-medium;
+  @apply w-full flex text-grey-200 text-base font-medium;
 }
 
 .sidebar__search input {
@@ -20,7 +20,7 @@
 }
 
 .sidebar-toggle__btn {
-  @apply text-base  dark:text-grey-200 mt-[-60px] ml-[25px] flex items-center;
+  @apply text-base  text-grey-200 mt-[-60px] ml-[25px] flex items-center;
 }
 
 .sidebar-toggle {

diff --git a/src/assets/css/system-check.css b/src/assets/css/system-check.css
@@ -1,5 +1,5 @@
 .system-check {
-  @apply dark:bg-grey-900 min-h-screen;
+  @apply bg-grey-900 min-h-screen;
 }
 
 .system-check__requirements p,

diff --git a/src/modules/onboarding/components/SystemCheck.tsx b/src/modules/onboarding/components/SystemCheck.tsx
@@ -60,13 +60,13 @@ const SystemCheck = ({
                 alt="computerLogo"
               />
               <div className="text-center mx-auto mt-5">
-                <h1 className="text-xl dark:text-grey-300">System Check</h1>
-                <p className="dark:text-grey-300 text-sm  my-4">
+                <h1 className="text-xl text-grey-300">System Check</h1>
+                <p className="text-grey-300 text-sm  my-4">
                   For Prem App to run smoothly you need:
                 </p>
               </div>
               <div className="system-check__requirements">
-                <h3 className="text-base dark:text-white">Requirements:</h3>
+                <h3 className="text-base text-white">Requirements:</h3>
                 <Dependency
                   isRunning={isDockerRunning}
                   status={isDockerRunning ? "Found" : "Not Found"}

diff --git a/src/modules/prem-chat/components/InputBox.tsx b/src/modules/prem-chat/components/InputBox.tsx
@@ -9,6 +9,7 @@ const InputBox = forwardRef((props: InputBoxProps, ref: ForwardedRef<HTMLInputEl
   return (
     <div className="prem-chat-input flex items-center relative">
       <input
+        autoComplete="off"
         type="text"
         name="question"
         value={question}

diff --git a/src/modules/prem-chat/components/PremChatSidebar.tsx b/src/modules/prem-chat/components/PremChatSidebar.tsx
@@ -96,7 +96,7 @@ const PremChatSidebar = ({ setHamburgerMenu }: HamburgerMenuProps) => {
                 >
                   <Link to={`/prem-chat/${serviceId}/${item.id}`}>
                     <img src={msg} alt="msg" width={18} height={18} className="mr-3" />
-                    <span>{item.title}</span>
+                    <span className="text-white">{item.title}</span>
                   </Link>
                   <button onClick={() => onDeleteClick(item.id)}>
                     <img src={bin} alt="bin" />
@@ -112,7 +112,7 @@ const PremChatSidebar = ({ setHamburgerMenu }: HamburgerMenuProps) => {
             <li>
               <Link to={`/prem-chat/${serviceId}`} onClick={onClearClick}>
                 <img src={binRed} alt="bin" className="mr-3 max-w-[20px]" />
-                <span>Clear Chat</span>
+                <span className="text-white">Clear Chat</span>
               </Link>
             </li>
           )}
@@ -123,9 +123,9 @@ const PremChatSidebar = ({ setHamburgerMenu }: HamburgerMenuProps) => {
                 alt="exportData"
                 width={20}
                 height={20}
-                className="mr-3 max-w-[20px]"
+                className="mr-3 max-w-5"
               />
-              <span className="text-grey-300">Export data</span>
+              <span className="text-white">Export data</span>
             </Link>
           </li>
           <li>
@@ -135,9 +135,9 @@ const PremChatSidebar = ({ setHamburgerMenu }: HamburgerMenuProps) => {
                 alt="importData"
                 width={20}
                 height={20}
-                className="mr-3 max-w-[20px]"
+                className="mr-3 max-w-5"
               />
-              <span className="text-grey-300">Import data</span>
+              <span className="text-white">Import data</span>
             </Link>
           </li>
         </ul>

diff --git a/src/modules/prem-chat/components/RightSidebar.tsx b/src/modules/prem-chat/components/RightSidebar.tsx
@@ -164,7 +164,7 @@ const RightSidebar = ({ setRightSidebar, resetPromptTemplate }: ChatRightSidebar
           </p>
           <p className="w-full">
             <textarea
-              className="w-full rounded p-1"
+              className="w-full rounded p-2 text-white"
               value={promptTemplate}
               onChange={(e) => setPromptTemplate(e.target.value)}
               rows={5}

diff --git a/src/modules/prem-image/components/PremImageLeftSidebar.tsx b/src/modules/prem-image/components/PremImageLeftSidebar.tsx
@@ -51,9 +51,7 @@ const PremImageLeftSidebar = ({ setHamburgerMenu }: HamburgerMenuProps) => {
                         })}
                       </div>
                     </div>
-                    <span className="text-[#58595E] text-end">
-                      {item.images.length}&nbsp;images
-                    </span>
+                    <span className="text-grey-600 text-end">{item.images.length}&nbsp;images</span>
                   </div>
                 </Link>
               </li>

diff --git a/src/shared/components/UserReply.tsx b/src/shared/components/UserReply.tsx
@@ -5,9 +5,9 @@ const UserReply = ({ reply }: UserReplyProps) => {
   return (
     <div className="user-reply">
       <p>{reply}</p>
-      <button className="bg-grey-100 ml-3 rounded-full min-w-[35px] h-[35px]">
-        <img className="mx-auto" src={user} alt="chatReplay" width={16} height={16} />
-      </button>
+      <div className="flex justify-center align-center bg-grey-100 ml-3 rounded-full min-w-[35px] h-[35px]">
+        <img src={user} alt="user" width={16} height={16} />
+      </div>
     </div>
   );
 };