primer commit: personalización de portada y estilos para Gitea ValerkaSystem

This commit is contained in:
2026-08-22 01:08:30 -03:00
commit bb39956d62
5 changed files with 244 additions and 0 deletions
+4
View File
@@ -0,0 +1,4 @@
documentacion.md
/home.tmpl
log-valerkasystem2.png
*.zip
+39
View File
@@ -0,0 +1,39 @@
# Personalización Gitea ValerkaSystem
Personalización de la portada y estilos para la instancia Gitea **ValerkaSystem** (v1.26.4).
## Estructura
```
templates/ # Plantillas que sobrescriben las del núcleo de Gitea
└── home.tmpl # Portada personalizada
public/ # Archivos estáticos servidos por Gitea
└── assets/
├── css/valerka-home.css # Estilo oscuro moderno de la portada
└── img/logo.png # Logo de la portada
```
## Qué personaliza
- **`templates/home.tmpl`** — Portada con hero (logo, título, subtítulo), texto descriptivo, botones a la organización y al blog, etiquetas de tecnologías y una sección de "Actividad pública" (feed del perfil en iframe).
- **`public/assets/css/valerka-home.css`** — Estilo oscuro moderno: degradados, botones con hover, etiquetas, layout responsive y marco para la actividad.
- **`public/assets/img/logo.png`** — Logo del blog usado como imagen principal de la portada.
## Despliegue
Copiar los archivos a la carpeta `custom` de Gitea y reiniciar el servicio:
```bash
sudo install -D -o gitea -g gitea templates/home.tmpl <custom>/templates/home.tmpl
sudo install -D -o gitea -g gitea public/assets/css/valerka-home.css <custom>/public/assets/css/valerka-home.css
sudo install -D -o gitea -g gitea public/assets/img/logo.png <custom>/public/assets/img/logo.png
sudo systemctl restart gitea
```
Reemplaza `<custom>` por la ruta de archivos personalizados de tu instancia (verificable en el panel de administración o con `gitea help`).
## Notas
- Los cambios en **plantillas** requieren reiniciar Gitea para aplicarse.
- Los archivos en **`public/`** se sirven al vuelo: al actualizarlos solo hay que copiarlos (y refrescar la caché del navegador si hace falta).
- La portada se muestra a usuarios sin sesión; los usuarios autenticados ven el dashboard.
+160
View File
@@ -0,0 +1,160 @@
.valerka-home {
padding: 0;
}
.valerka-home .center,
.valerka-home .ui.stackable.middle.very.relaxed.page.grid {
display: none;
}
.valerka-hero {
position: relative;
padding: 6rem 2rem;
text-align: center;
background:
radial-gradient(1200px 600px at 50% -10%, rgba(86, 148, 255, 0.18), transparent 60%),
radial-gradient(900px 500px at 85% 110%, rgba(130, 96, 255, 0.14), transparent 55%),
var(--color-body);
overflow: hidden;
}
.valerka-hero-inner {
max-width: 760px;
margin: 0 auto;
}
.valerka-logo {
width: 160px;
height: 160px;
object-fit: contain;
border-radius: 24px;
margin-bottom: 1.75rem;
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
border: 1px solid var(--color-secondary);
}
.valerka-title {
font-size: 3rem;
font-weight: 800;
letter-spacing: 0.04em;
margin: 0 0 0.6rem;
background: linear-gradient(120deg, var(--color-primary), var(--color-purple, #a78bfa));
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: var(--color-text);
}
.valerka-subtitle {
font-size: 1.35rem;
color: var(--color-text-light);
font-weight: 600;
letter-spacing: 0.02em;
margin: 0 0 1.5rem;
}
.valerka-tagline {
font-size: 1.1rem;
line-height: 1.7;
color: var(--color-text-secondary);
margin: 0 auto 2.25rem;
max-width: 560px;
}
.valerka-actions {
display: flex;
flex-wrap: wrap;
gap: 0.9rem;
justify-content: center;
margin-bottom: 2rem;
}
.valerka-btn {
font-weight: 700;
padding: 0.85em 1.6em;
border-radius: 12px;
font-size: 1.05rem;
transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}
.valerka-btn:hover {
transform: translateY(-2px);
filter: brightness(1.08);
}
.valerka-btn-primary {
background: linear-gradient(120deg, var(--color-primary), var(--color-purple, #8b5cf6));
color: #fff;
box-shadow: 0 8px 24px rgba(86, 148, 255, 0.35);
}
.valerka-btn-secondary {
background: var(--color-secondary);
color: var(--color-text);
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}
.valerka-tags {
list-style: none;
display: flex;
flex-wrap: wrap;
gap: 0.6rem;
justify-content: center;
margin: 0;
padding: 0;
}
.valerka-tags li {
padding: 0.45em 1.1em;
border-radius: 999px;
background: var(--color-box-header);
border: 1px solid var(--color-secondary);
color: var(--color-text-light);
font-size: 0.9rem;
font-weight: 600;
}
.valerka-activity {
max-width: 900px;
margin: 0 auto;
padding: 3rem 1.5rem 4rem;
}
.valerka-activity-title {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 1.5rem;
font-weight: 700;
color: var(--color-text);
margin: 0 0 0.35rem;
}
.valerka-activity-desc {
color: var(--color-text-secondary);
margin: 0 0 1.25rem;
}
.valerka-activity-frame {
border-radius: 16px;
overflow: hidden;
border: 1px solid var(--color-secondary);
background: var(--color-box-body);
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.35);
}
.valerka-activity-frame iframe {
display: block;
width: 100%;
height: 720px;
border: 0;
background: var(--color-box-body);
}
@media (max-width: 767px) {
.valerka-hero { padding: 3.5rem 1.25rem; }
.valerka-title { font-size: 2.1rem; }
.valerka-subtitle { font-size: 1.1rem; }
.valerka-logo { width: 120px; height: 120px; }
.valerka-activity-frame iframe { height: 600px; }
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 851 KiB

+41
View File
@@ -0,0 +1,41 @@
{{template "base/head" .}}
<link rel="stylesheet" href="{{AssetUrlPrefix}}/css/valerka-home.css">
<div role="main" aria-label="{{if .IsSigned}}{{ctx.Locale.Tr "dashboard"}}{{else}}{{ctx.Locale.Tr "home_title"}}{{end}}" class="page-content home valerka-home">
<div class="valerka-hero">
<div class="valerka-hero-inner">
<img class="valerka-logo" src="{{AssetUrlPrefix}}/img/logo.png" alt="ValerkaSystem logo">
<h1 class="valerka-title">VALERKASYSTEM</h1>
<p class="valerka-subtitle">Infraestructura &middot; Automatización &middot; Open Source</p>
<p class="valerka-tagline">
Proyectos, herramientas y experimentos reales.<br>
Construyo en público.<br>
Comparto lo que aprendo, lo que funciona&hellip;<br>
y también lo que falla.
</p>
<div class="valerka-actions">
<a href="{{AppSubUrl}}/ValerkaSystem" class="ui primary button valerka-btn valerka-btn-primary">
{{svg "octicon-repo"}} Explorar proyectos
</a>
<a href="https://valerka.duckdns.org/" target="_blank" rel="noopener noreferrer" class="ui button valerka-btn valerka-btn-secondary">
{{svg "octicon-link-external"}} Blog
</a>
</div>
<ul class="valerka-tags">
<li>Software libre</li>
<li>Linux</li>
<li>Podman</li>
<li>Automatización</li>
</ul>
</div>
</div>
<div class="valerka-activity">
<h2 class="valerka-activity-title">
{{svg "octicon-rss"}} Actividad pública
</h2>
<p class="valerka-activity-desc">Lo último que estoy construyendo.</p>
<div class="valerka-activity-frame">
<iframe src="{{AppSubUrl}}/Valerka?tab=activity" loading="lazy" title="Actividad pública de Valerka"></iframe>
</div>
</div>
</div>
{{template "base/footer" .}}