feat: implement light mode and light/dark/system mode switch (#69)

* feat: implement theme provider and mode toggle for light/dark mode support

* fix: update icon color from 'text-secondary' to 'text-foreground' in multiple preview tables

* feat: update styles for improved UI consistency across components

* fix: reduce transition duration for improved responsiveness across components

* feat: enhance ModeToggle component with system theme option and improve button styling

* feat: update borderTypeColor to include background colors and dark mode support

* feat: enhance CopyButton tooltip styling and improve TableBody dark mode support

* feat: update component styles for improved UI consistency and responsiveness

* feat: update brand and muted foreground colors for improved accessibility

* feat: update InteractiveJsonViewer styles for improved color consistency and accessibility

* feat: update AddressChip button styles for improved visual consistency and accessibility; refine SchemaSearch layout for better readability

* feat: update ring color variable to use primary color for improved theming consistency

* feat: update Bellecour chain color for improved theming consistency

* feat: update button and span styles for improved visual consistency and accessibility

* feat: update text color for improved theming

* feat: update selected item color in SchemaSearch for improved theming consistency

* feat: update theme toggle buttons for improved clarity and consistency

* feat: update background color for wallet and iExec account sections for improved theming consistency

* refactor: improve ModeToggle code clarity

* fix: update Icon type definition in ModeToggle for improved type safety

Author: ErwanDecoster

package-lock.json

@@ -58,13 +58,13 @@ const CopyButton = ({
               }}
               onMouseEnter={handleMouseEnter}
               onMouseLeave={handleMouseLeave}
-              className="hover:before:bg-grey-700 active:before:bg-grey-600 relative z-0 -mx-1 -my-1 items-center gap-1 px-1 py-1 transition-colors before:absolute before:inset-0 before:-z-10 before:rounded-lg before:duration-150 active:before:scale-x-[0.98] active:before:scale-y-[0.94]"
+              className="hover:before:bg-muted active:before:bg-secondary relative z-0 -mx-1 -my-1 items-center gap-1 px-1 py-1 transition-colors before:absolute before:inset-0 before:-z-10 before:rounded-lg before:duration-200 active:before:scale-x-[0.98] active:before:scale-y-[0.94]"
             >
               <Copy className="size-4 flex-none" />
             </button>
           </span>
         </TooltipTrigger>
-        <TooltipContent side="top" className="max-w-sm">
+        <TooltipContent side="top" className="max-w-sm text-inherit">
           {tooltipMessage}
         </TooltipContent>
       </Tooltip>