diff options
Diffstat (limited to 'src/frontend/app/routes/lines.tsx')
| -rw-r--r-- | src/frontend/app/routes/lines.tsx | 57 |
1 files changed, 30 insertions, 27 deletions
diff --git a/src/frontend/app/routes/lines.tsx b/src/frontend/app/routes/lines.tsx index 658716f..acf8a7f 100644 --- a/src/frontend/app/routes/lines.tsx +++ b/src/frontend/app/routes/lines.tsx @@ -2,36 +2,39 @@ import { useTranslation } from "react-i18next"; import LineIcon from "~/components/LineIcon"; import { usePageTitle } from "~/contexts/PageTitleContext"; import { VIGO_LINES } from "~/data/LinesData"; -import '../tailwind-full.css'; +import "../tailwind-full.css"; export default function LinesPage() { - const { t } = useTranslation(); - usePageTitle(t("navbar.lines", "Líneas")); + const { t } = useTranslation(); + usePageTitle(t("navbar.lines", "Líneas")); - return ( - <div className="container mx-auto px-4 py-6"> - <p className="mb-6 text-gray-700 dark:text-gray-300"> - {t("lines.description", "A continuación se muestra una lista de las líneas de autobús urbano de Vigo con sus respectivas rutas y enlaces a los horarios oficiales.")} - </p> + return ( + <div className="container mx-auto px-4 py-6"> + <p className="mb-6 text-gray-700 dark:text-gray-300"> + {t( + "lines.description", + "A continuación se muestra una lista de las líneas de autobús urbano de Vigo con sus respectivas rutas y enlaces a los horarios oficiales." + )} + </p> - <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4"> - {VIGO_LINES.map((line) => ( - <a - key={line.lineNumber} - href={line.scheduleUrl} - target="_blank" - rel="noopener noreferrer" - className="flex items-center gap-3 p-4 bg-white dark:bg-gray-800 rounded-lg shadow hover:shadow-lg transition-shadow border border-gray-200 dark:border-gray-700" - > - <LineIcon line={line.lineNumber} mode="rounded" /> - <div className="flex-1 min-w-0"> - <p className="text-sm md:text-md font-semibold text-gray-900 dark:text-gray-100"> - {line.routeName} - </p> - </div> - </a> - ))} + <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4"> + {VIGO_LINES.map((line) => ( + <a + key={line.lineNumber} + href={line.scheduleUrl} + target="_blank" + rel="noopener noreferrer" + className="flex items-center gap-3 p-4 bg-white dark:bg-gray-800 rounded-lg shadow hover:shadow-lg transition-shadow border border-gray-200 dark:border-gray-700" + > + <LineIcon line={line.lineNumber} mode="rounded" /> + <div className="flex-1 min-w-0"> + <p className="text-sm md:text-md font-semibold text-gray-900 dark:text-gray-100"> + {line.routeName} + </p> </div> - </div> - ); + </a> + ))} + </div> + </div> + ); } |
