update src/components/ThemeColor/index.js

src/components/ThemeColor/index.js

@@ -8,7 +8,7 @@ const ThemeColor = () => {
   const [current, setCurrent] = useState(null);
 
   return (
-    <div className="w-full h-screen flex flex-col items-center bg-[#e1f5ff] rounded-sm border border-[#b8dff3]">
+    <div className="ltr w-full h-screen flex flex-col items-center bg-[#e1f5ff] rounded-sm border border-[#b8dff3]">
       <h2 className="mt-4 text-2xl text-blue-900 font-sansbold">
         Theme Properties
       </h2>
@@ -19,19 +19,21 @@ const ThemeColor = () => {
         Version:
         <span className="ml-1">1</span>
       </p>
-      <div className="w-full flex flex-row items-center justify-between mt-7 divide-x-2 divide-blue-900 divide-x-reverse">
+      <div className="w-full flex flex-row-reverse items-center justify-between mt-7 divide-x-2 divide-[#b8dff3] divide-x-reverse">
         {/* right */}
         <div className="w-1/2 flex-grow flex-1 flex flex-col p-4">fsd</div>
         {/* left */}
         <div className="w-1/2 flex-grow flex-1 flex flex-col p-4">
-          <div className="w-full flex flex-row items-center justify-between">
+          <div className="w-full flex flex-row-reverse items-center justify-between">
-            <div className="flex flex-row items-center justify-between">
+            <div className="flex flex-row-reverse items-center justify-between">
               <span className="text-xs ml-2">Dark</span> <SwitchDesign />
             </div>
             <p className="text-2xl">The Color System</p>
           </div>
-          <hr className="my-2 border border-blue-900" />
+          <hr className="my-2 border border-[#b8dff3]" />
-          <p>Original Colors</p>
+          <p className="text-[#64b6df] text-lg font-sansbold">
+            Original Colors
+          </p>
         </div>
       </div>
     </div>