Create index page

This commit is contained in:
Araozu 2024-03-14 15:46:46 -05:00
parent 8b1c18ae8d
commit a7f83e4ca0
2 changed files with 75 additions and 5 deletions

View File

@ -1,4 +1,4 @@
package dev.araozu.eeg_java.controller;
package dev.araozu.eeg_java.index;
import org.springframework.ui.Model;
import org.springframework.stereotype.Controller;

View File

@ -1,9 +1,10 @@
<!doctype html>
<html lang="es" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>EEGSAC - Java</title>
@ -15,12 +16,81 @@
<script defer src="https://unpkg.com/htmx.org@1.9.8/dist/htmx.min.js"></script>
<!-- color manager -->
<script defer src="/colorManager.js"></script>
<!-- Phosphor icons -->
<link rel="stylesheet" type="text/css" href="https://unpkg.com/@phosphor-icons/web@2.0.3/src/regular/style.css" />
</head>
<body>
<h1 class="font-black text-4xl p-4 m-4 border-2 border-[black] rounded-md bg-c-surface-variant text-c-on-surface-variant">
Java forever and ever
</h1>
<div class="grid grid-cols-[5rem_auto]">
<!-- Navigation Rail -->
<div>
<div class="flex flex-col justify-center items-center h-screen overflow-x-hidden">
<a class="my-3 text-center group hover:bg-c-surface-variant rounded-xl transition-colors
max-w-[4rem] inline-block select-none" href="/">
<div
class="p-1 inline-block group-[.active]:bg-c-surface-variant min-w-[4rem] rounded-full transition-colors">
<i class="ph ph-house"></i>
</div>
<span class="text-sm">
Inicio
</span>
</a>
<a class="my-3 text-center group hover:bg-c-surface-variant rounded-xl transition-colors
max-w-[4rem] inline-block select-none" href="/certs">
<div
class="p-1 inline-block group-[.active]:bg-c-surface-variant min-w-[4rem] rounded-full transition-colors">
<i class="ph ph-file-doc"></i>
</div>
<span class="text-sm">
Certs
</span>
</a>
<a class="my-3 text-center group hover:bg-c-surface-variant rounded-xl transition-colors
max-w-[4rem] inline-block select-none" href="/accesos">
<div
class="p-1 inline-block group-[.active]:bg-c-surface-variant min-w-[4rem] rounded-full transition-colors">
<i class="ph ph-password"></i>
</div>
<span class="text-sm">
Accesos
</span>
</a>
<a class="my-3 text-center group hover:bg-c-surface-variant rounded-xl transition-colors
max-w-[4rem] inline-block select-none" href="/escaneos">
<div
class="p-1 inline-block group-[.active]:bg-c-surface-variant min-w-[4rem] rounded-full transition-colors">
<i class="ph ph-scan"></i>
</div>
<span class="text-sm">
Escaneos
</span>
</a>
<a class="my-3 text-center group hover:bg-c-surface-variant rounded-xl transition-colors
max-w-[4rem] inline-block select-none" href="/reportes">
<div
class="p-1 inline-block group-[.active]:bg-c-surface-variant min-w-[4rem] rounded-full transition-colors">
<i class="ph ph-chart-scatter"></i>
</div>
<span class="text-sm">
Reportes
</span>
</a>
</div>
</div>
<!-- Main Content -->
<div class="container">
<h1 class="text-2xl py-4 font-bold">Página principal</h1>
<p>Selecciona uno de los botones en la barra lateral para acceder a la funcionalidad.</p>
</div>
</div>
</body>
</html>