Change layout and texts
This commit is contained in:
jose-rZM
@@ -99,8 +99,8 @@
|
|||||||
está inspirada en la de nuestra querida escuela.
|
está inspirada en la de nuestra querida escuela.
|
||||||
</p>
|
</p>
|
||||||
<div class="actions">
|
<div class="actions">
|
||||||
<button on:click={() => fetchMenu()} class="ghost">Refrescar menú</button>
|
<button on:click={() => fetchMenu()}>Refrescar menú</button>
|
||||||
<button on:click={() => fetchPrices()}>Recalcular desayunos</button>
|
<button on:click={() => fetchPrices()} class="ghost">Recalcular desayunos</button>
|
||||||
</div>
|
</div>
|
||||||
<p class="meta">
|
<p class="meta">
|
||||||
Backend: {API_BASE} · Endpoints: /menu · /prices · /prices/:item · /health
|
Backend: {API_BASE} · Endpoints: /menu · /prices · /prices/:item · /health
|
||||||
@@ -255,11 +255,42 @@
|
|||||||
{/if}
|
{/if}
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
|
<article class="card">
|
||||||
|
<div class="card-head">
|
||||||
|
<div class="label">Desayunos</div>
|
||||||
|
{#if loadingPrices}
|
||||||
|
<span class="tag">cargando...</span>
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{#if prices.length}
|
||||||
|
<div class="price-grid">
|
||||||
|
{#each prices as price}
|
||||||
|
<div class="price-card">
|
||||||
|
<p class="item">{prettify(price.item)}</p>
|
||||||
|
<p class="value">{price.price} €</p>
|
||||||
|
<p class="timestamp">{price.generated_at}</p>
|
||||||
|
</div>
|
||||||
|
{/each}
|
||||||
|
</div>
|
||||||
|
<p class="meta">
|
||||||
|
Dependiendo de si vas por la mañana o por la tarde los precios cambian. No sé,
|
||||||
|
como no ponen los precios al público... :p
|
||||||
|
</p>
|
||||||
|
{:else if !loadingPrices}
|
||||||
|
<p>No hay precios que mostrar.</p>
|
||||||
|
{/if}
|
||||||
|
</article>
|
||||||
|
|
||||||
<article class="card ci-card">
|
<article class="card ci-card">
|
||||||
<div class="card-head">
|
<div class="card-head">
|
||||||
<div>
|
<div>
|
||||||
<p class="label">Estado del sistema</p>
|
<p class="label">Estado del sistema</p>
|
||||||
<p class="sub">Información de build y backend</p>
|
<p class="sub">
|
||||||
|
Información de build y backend. Tanto el Build, Commit y Autor lo
|
||||||
|
recuperamos gracias a Jenkins, inyectando ciertas variables a la hora de
|
||||||
|
hacer despliegue del backend.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
{#if loadingCiStatus}
|
{#if loadingCiStatus}
|
||||||
<span class="tag">comprobando...</span>
|
<span class="tag">comprobando...</span>
|
||||||
@@ -309,7 +340,11 @@
|
|||||||
<div class="card-head">
|
<div class="card-head">
|
||||||
<div>
|
<div>
|
||||||
<p class="label">Historial</p>
|
<p class="label">Historial</p>
|
||||||
<p class="sub">Builds recientes en Jenkins</p>
|
<p class="sub">
|
||||||
|
Builds recientes en Jenkins. Esto lo conseguimos gracias a que Jenkins nos
|
||||||
|
expone una API REST muy maja para consultar información de los jobs y
|
||||||
|
builds.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
{#if loadingHistory}
|
{#if loadingHistory}
|
||||||
<span class="tag">actualizando...</span>
|
<span class="tag">actualizando...</span>
|
||||||
@@ -363,88 +398,60 @@
|
|||||||
{/if}
|
{/if}
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article class="card">
|
|
||||||
<div class="card-head">
|
|
||||||
<div class="label">Desayunos</div>
|
|
||||||
{#if loadingPrices}
|
|
||||||
<span class="tag">cargando...</span>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{#if prices.length}
|
|
||||||
<div class="price-grid">
|
|
||||||
{#each prices as price}
|
|
||||||
<div class="price-card">
|
|
||||||
<p class="item">{prettify(price.item)}</p>
|
|
||||||
<p class="value">{price.price} €</p>
|
|
||||||
<p class="timestamp">{price.generated_at}</p>
|
|
||||||
</div>
|
|
||||||
{/each}
|
|
||||||
</div>
|
|
||||||
<p class="meta">
|
|
||||||
Dependiendo de si vas por la mañana o por la tarde los precios cambian. No sé,
|
|
||||||
como no ponen los precios al público... :p
|
|
||||||
</p>
|
|
||||||
{:else if !loadingPrices}
|
|
||||||
<p>No hay precios que mostrar.</p>
|
|
||||||
{/if}
|
|
||||||
</article>
|
|
||||||
|
|
||||||
<article class="card openbokeron-card">
|
<article class="card openbokeron-card">
|
||||||
<div class="card-head">
|
<div class="card-head">
|
||||||
<div>
|
<div>
|
||||||
<p class="label">Open Bokeron</p>
|
<p class="label">Open Bokeron</p>
|
||||||
<p class="sub">Quiénes estamos detrás del taller</p>
|
<p class="sub">Quiénes estamos detrás del taller</p>
|
||||||
</div>
|
</div>
|
||||||
<a
|
|
||||||
class="tag link-tag"
|
|
||||||
href="https://openbokeron.org"
|
|
||||||
target="_blank"
|
|
||||||
rel="noreferrer"
|
|
||||||
>
|
|
||||||
openbokeron.org
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="openbokeron-body">
|
|
||||||
<div class="openbokeron-copy">
|
|
||||||
<p class="openbokeron-text">
|
|
||||||
Somos Open Bokeron, la asociación de software libre de la ETSII.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p class="openbokeron-text subtle">
|
|
||||||
Este tinglado lo hemos montado nosotros, así que sí: esta tarjeta se queda todo el
|
|
||||||
taller
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<ul class="openbokeron-list">
|
|
||||||
<li>Usamos Linux y te juzgamos severamente si vienes con Windows.</li>
|
|
||||||
<li>A veces hacemos cosas. #HazCosas dicen por aquí en la ETSII.</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div class="openbokeron-actions">
|
|
||||||
<a
|
<a
|
||||||
class="button-link subtle"
|
class="tag link-tag"
|
||||||
href="https://openbokeron.org"
|
href="https://openbokeron.org"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noreferrer"
|
rel="noreferrer"
|
||||||
>
|
>
|
||||||
Conócenos
|
openbokeron.org
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="openbokeron-logo">
|
<div class="openbokeron-body">
|
||||||
<div class="logo-bubble">
|
<div class="openbokeron-copy">
|
||||||
<img
|
<p class="openbokeron-text">
|
||||||
src="/open-bokeron-logo.png"
|
Somos Open Bokeron, la asociación de software libre de la ETSII.
|
||||||
alt="Logo de Open Bokeron"
|
</p>
|
||||||
loading="lazy"
|
|
||||||
/>
|
<p class="openbokeron-text subtle">
|
||||||
|
Este tinglado lo hemos montado nosotros, así que sí: esta tarjeta se queda
|
||||||
|
todo el taller
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<ul class="openbokeron-list">
|
||||||
|
<li>Usamos Linux y te juzgamos severamente si vienes con Windows.</li>
|
||||||
|
<li>A veces hacemos cosas. #HazCosas dicen por aquí en la ETSII.</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="openbokeron-actions">
|
||||||
|
<a
|
||||||
|
class="button-link subtle"
|
||||||
|
href="https://openbokeron.org"
|
||||||
|
target="_blank"
|
||||||
|
rel="noreferrer"
|
||||||
|
>
|
||||||
|
Conócenos
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="openbokeron-logo">
|
||||||
|
<div class="logo-bubble">
|
||||||
|
<img
|
||||||
|
src="/open-bokeron-logo.png"
|
||||||
|
alt="Logo de Open Bokeron"
|
||||||
|
loading="lazy"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</article>
|
||||||
</div>
|
|
||||||
</article>
|
|
||||||
|
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
|||||||
@@ -413,7 +413,7 @@ li {
|
|||||||
gap: 0.4rem;
|
gap: 0.4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.openbokeron-copy>*+* {
|
.openbokeron-copy > * + * {
|
||||||
margin-top: 0.3rem;
|
margin-top: 0.3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -429,8 +429,6 @@ li {
|
|||||||
font-size: 0.9rem;
|
font-size: 0.9rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.openbokeron-list {
|
.openbokeron-list {
|
||||||
margin: 0.2rem 0 0;
|
margin: 0.2rem 0 0;
|
||||||
padding-left: 1.1rem;
|
padding-left: 1.1rem;
|
||||||
@@ -442,7 +440,6 @@ li {
|
|||||||
gap: 0.3rem;
|
gap: 0.3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.openbokeron-actions {
|
.openbokeron-actions {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 0.6rem;
|
gap: 0.6rem;
|
||||||
@@ -482,7 +479,6 @@ li {
|
|||||||
background: rgba(255, 255, 255, 0.14);
|
background: rgba(255, 255, 255, 0.14);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.openbokeron-logo {
|
.openbokeron-logo {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -507,7 +503,6 @@ li {
|
|||||||
opacity: 0.9;
|
opacity: 0.9;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.price-grid {
|
.price-grid {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
|
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
|
||||||
|
|||||||
Reference in New Issue
Block a user