style: fix colors

thraizz · Dec 14, 2023 · db91377 · db91377
1 parent 10ff3e7
commit db91377
Show file tree

Hide file tree

Showing 5 changed files with 7 additions and 7 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -12,7 +12,7 @@ export const App = () => {
 
   return (
     <div className="flex flex-col min-h-screen">
-      <header className="flex flex-row items-center justify-between h-32 bg-sky-600 px-6 py-4">
+      <header className="flex flex-row items-center justify-between h-32 bg-sky-50 px-6 py-4">
         <div>
           <h1 className="text-2xl font-bold">r10progress</h1>
           <p className="text-md">

diff --git a/src/AveragesTable.tsx b/src/AveragesTable.tsx
@@ -44,12 +44,12 @@ export const AveragesTable = () => {
     <Disclosure defaultOpen={true} as="div" className="mt-2">
       {({ open }) => (
         <>
-          <Disclosure.Button className="flex w-full justify-between rounded-lg bg-purple-100 px-4 py-2 text-left text-sm font-medium text-purple-900 hover:bg-purple-200 focus:outline-none focus-visible:ring focus-visible:ring-purple-500/75">
+          <Disclosure.Button className="flex w-full justify-between rounded-lg bg-sky-100 px-4 py-2 text-left text-sm font-medium text-sky-900 hover:bg-sky-200 focus:outline-none focus-visible:ring focus-visible:ring-sky-500/75">
             <h3 className="text-xl font-bold">Average Values</h3>
             <ChevronUpIcon
               className={`${
                 open ? "rotate-180 transform" : ""
-              } h-5 w-5 text-purple-500 self-center`}
+              } h-5 w-5 text-sky-500 self-center`}
             />
           </Disclosure.Button>
           <Disclosure.Panel className="mt-2 pt-4 text-sm text-gray-500">

diff --git a/src/DataTable.tsx b/src/DataTable.tsx
@@ -65,12 +65,12 @@ export const DataTable = () => {
         <Disclosure defaultOpen={true} as="div" className="mt-2">
           {({ open }) => (
             <>
-              <Disclosure.Button className="flex w-full justify-between rounded-lg bg-purple-100 px-4 py-2 text-left text-sm font-medium text-purple-900 hover:bg-purple-200 focus:outline-none focus-visible:ring focus-visible:ring-purple-500/75">
+              <Disclosure.Button className="flex w-full justify-between rounded-lg bg-sky-100 px-4 py-2 text-left text-sm font-medium text-sky-900 hover:bg-sky-200 focus:outline-none focus-visible:ring focus-visible:ring-sky-500/75">
                 <h3 className="text-xl font-bold">All Data</h3>
                 <ChevronUpIcon
                   className={`${
                     open ? "rotate-180 transform" : ""
-                  } h-5 w-5 text-purple-500 self-center`}
+                  } h-5 w-5 text-sky-500 self-center`}
                 />
               </Disclosure.Button>
               <Disclosure.Panel className="mt-2 pt-4 text-sm text-gray-500">

diff --git a/src/SessionPicker.tsx b/src/SessionPicker.tsx
@@ -69,7 +69,7 @@ export const SessionPicker = () => {
       <Label> Select a session to filter data in the table and averages.</Label>
       <Listbox value={selected} onChange={writeSelected}>
         <div className="relative mt-1 z-20 mb-4">
-          <Listbox.Button className="relative w-full cursor-default rounded-lg bg-white py-2 pl-3 pr-10 text-left shadow-md focus:outline-none focus-visible:border-indigo-500 focus-visible:ring-2 focus-visible:ring-white/75 focus-visible:ring-offset-2 focus-visible:ring-offset-orange-300 sm:text-sm">
+          <Listbox.Button className="relative w-full cursor-default rounded-lg bg-white py-2 pl-3 pr-10 text-left shadow-md focus:outline-none focus-visible:border-indigo-500 focus-visible:ring-2 focus-visible:ring-white/75 focus-visible:ring-offset-2 focus-visible:ring-offset-sky-300 sm:text-sm">
             <span className="block truncate">{selected}</span>
             <span className="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2">
               <ChevronUpDownIcon

diff --git a/src/index.scss b/src/index.scss
@@ -3,7 +3,7 @@
 @tailwind utilities;
 
 .btn {
-  @apply rounded bg-sky-200 px-2 py-1 text-lg font-semibold text-sky-600 shadow-sm hover:bg-sky-300;
+  @apply rounded bg-sky-200 px-2 py-1 text-base font-semibold text-sky-600 shadow-sm hover:bg-sky-300;
 
   &.is-disabled {
     @apply opacity-50 bg-gray-50 pointer-events-none text-gray-600 hover:bg-gray-50