style: update Hero and ThemeSwitcher components to improve visibility on larger screensg

Author: code-env

src/components/shared/hero.tsx

@@ -41,7 +41,7 @@ const Hero = ({ hidden, count }: { hidden: boolean; count: number }) => {
         <a
           href={siteConfig.link.githubRepo}
           target="_blank"
-          className="absolute top-0 right-0 flex items-center gap-2 border border-r-0 border-t-0 border-muted-foreground/20 p-2 text-sm font-medium"
+          className="absolute top-0 right-0 md:flex items-center gap-2 border border-r-0 border-t-0 border-muted-foreground/20 p-2 text-sm font-medium hidden"
         >
           <Icons.github className="w-4 h-4 fill-primary" />
           <span>Star on GitHub</span>

src/components/shared/mode-toggle.tsx

@@ -34,14 +34,14 @@ const ThemeSwitcher = () => {
   if (!mouted) return;
 
   return (
-    <div className="fixed border bottom-0 left-0 p-1 border-l-0 border-b-0 !z-[999] bg-muted/40 rounded-tr-xl flex items-center gap-2">
+    <div className="fixed hidden md:flex border bottom-0 left-0 p-1 border-l-0 border-b-0 !z-[999] bg-muted/40 rounded-tr-xl items-center gap-2">
       {themes.map((theme, index) => {
         // something
         return (
           <button
             key={index + theme.name}
             className={cn(
-              "size-6 flex items-center justify-center relative outline-none ring-0",
+              "size-6 flex items-center justify-center relative outline-none ring-0"
             )}
             onClick={() => setTheme(theme.name)}
           >