Fix PageTabs styling and clean up duplicate files

apps/react/src/app/components/page-tabs/index.tsx

@@ -1,30 +0,0 @@
-import React from 'react'
-import { Link, useLocation } from 'react-router-dom'
-import { useTranslation } from 'react-i18next'
-
-export const PageTabs: React.FC = () => {
-  const location = useLocation()
-  const { t } = useTranslation()
-
-  const tabs = [
-    { path: '/onlineboard', label: 'Online Board' },
-    { path: '/schedule', label: 'Schedule' },
-  ]
-
-  return (
-    <div className="page-tabs" data-testid="page-tabs">
-      <nav className="page-tabs__nav">
-        {tabs.map(tab => (
-          <Link
-            key={tab.path}
-            to={tab.path}
-            className={`page-tabs__link ${location.pathname.startsWith(tab.path) ? 'page-tabs__link--active' : ''}`}
-            data-testid={`tab-${tab.path.substring(1)}`}
-          >
-            {tab.label}
-          </Link>
-        ))}
-      </nav>
-    </div>
-  )
-}

apps/react/src/app/components/page-tabs/page-tabs.scss

@@ -1,25 +1,34 @@
 .page-tabs {
   display: flex;
-  gap: 10px;
-  border-bottom: 2px solid #e0e0e0;
-  margin-bottom: 20px;
+  flex-direction: column;
+  gap: 8px;
+  width: 100%;
 }
 
 .page-tabs__link {
+  display: block;
   padding: 12px 16px;
   text-decoration: none;
-  color: #666;
+  color: #333333;
   font-weight: 500;
-  border-bottom: 3px solid transparent;
+  background-color: #ffffff;
+  border: 2px solid #c0c0c0;
+  border-radius: 2px;
   cursor: pointer;
-  transition: all 0.2s ease;
+  transition: all 0.15s ease;
+  text-align: center;
+  font-size: 13px;
+  line-height: 1.4;
 
   &:hover {
-    color: #333;
+    background-color: #fafafa;
+    border-color: #a0a0a0;
   }
 
   &--active {
+    background-color: #f0f0f0;
     color: #1976d2;
-    border-bottom-color: #1976d2;
+    border-color: #1976d2;
+    font-weight: 600;
   }
 }