Add OB spam
This commit is contained in:
jose-rZM
BIN
frontend/public/open-bokeron-logo.png
Normal file
BIN
frontend/public/open-bokeron-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
@@ -389,5 +389,50 @@
|
||||
<p>No hay precios que mostrar.</p>
|
||||
{/if}
|
||||
</article>
|
||||
|
||||
<article class="card openbokeron-card">
|
||||
<div class="card-head">
|
||||
<div>
|
||||
<p class="label">Open Bokeron</p>
|
||||
<p class="sub">Asociación de software libre</p>
|
||||
</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">
|
||||
La peña que monta este tinglado. Y como esta es mi web pues hago spam gratis y así ves esta
|
||||
tarjeta durante todo el taller. De nada.
|
||||
</p>
|
||||
<ul class="openbokeron-list">
|
||||
<li>Usamos Linux y te juzgamos duramente si te vemos con un Windows.</li>
|
||||
<li>A veces hacemos cosas, #HazCosas dicen aquí en la ETSII.</li>
|
||||
<li>¡Encuesta! Anda, rellena esta encuesta de satisfacción del taller no me seas: [URL].</li>
|
||||
</ul>
|
||||
<div class="openbokeron-actions">
|
||||
<a
|
||||
class="button-link"
|
||||
href="https://openbokeron.org"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Pásate por la web
|
||||
</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>
|
||||
</article>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
@@ -184,6 +184,23 @@ button.outline {
|
||||
border: 1px solid rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
|
||||
.openbokeron-card {
|
||||
background:
|
||||
radial-gradient(circle at 12% 18%, rgba(34, 211, 238, 0.22), transparent 26%),
|
||||
radial-gradient(circle at 85% -5%, rgba(124, 58, 237, 0.2), transparent 28%),
|
||||
linear-gradient(180deg, #0b1224, #0e1530);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.openbokeron-card::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: linear-gradient(135deg, rgba(255, 255, 255, 0.02), transparent 55%);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.card-head {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@@ -211,6 +228,21 @@ button.outline {
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.tag.link-tag {
|
||||
text-decoration: none;
|
||||
border: 1px solid rgba(165, 180, 252, 0.4);
|
||||
transition:
|
||||
border-color 120ms ease,
|
||||
color 120ms ease,
|
||||
background 120ms ease;
|
||||
}
|
||||
|
||||
.tag.link-tag:hover {
|
||||
border-color: rgba(165, 180, 252, 0.8);
|
||||
background: rgba(165, 180, 252, 0.16);
|
||||
color: #c7d2fe;
|
||||
}
|
||||
|
||||
.menu-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||
@@ -368,6 +400,93 @@ li {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.openbokeron-body {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1.2fr) minmax(220px, 0.8fr);
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.openbokeron-copy {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.65rem;
|
||||
}
|
||||
|
||||
.openbokeron-text {
|
||||
margin: 0;
|
||||
color: #e2e8f0;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.openbokeron-list {
|
||||
margin: 0;
|
||||
padding-left: 1.1rem;
|
||||
color: #cbd5f5;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.35rem;
|
||||
}
|
||||
|
||||
.openbokeron-actions {
|
||||
display: flex;
|
||||
gap: 0.6rem;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.button-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.35rem;
|
||||
background: linear-gradient(120deg, #22d3ee, #38bdf8);
|
||||
color: #0b1224;
|
||||
text-decoration: none;
|
||||
font-weight: 800;
|
||||
padding: 0.65rem 1rem;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 12px 26px rgba(34, 211, 238, 0.25);
|
||||
transition:
|
||||
transform 120ms ease,
|
||||
box-shadow 120ms ease;
|
||||
}
|
||||
|
||||
.button-link:hover {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 14px 28px rgba(56, 189, 248, 0.3);
|
||||
}
|
||||
|
||||
.openbokeron-logo {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.4rem;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.logo-bubble {
|
||||
width: 100%;
|
||||
min-height: 170px;
|
||||
border-radius: 16px;
|
||||
border: 1px dashed rgba(148, 163, 184, 0.38);
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.9rem;
|
||||
box-shadow:
|
||||
inset 0 0 0 1px rgba(255, 255, 255, 0.03),
|
||||
0 12px 28px rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.logo-bubble img {
|
||||
display: block;
|
||||
max-width: 160px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.32));
|
||||
}
|
||||
|
||||
.price-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
|
||||
@@ -455,6 +574,16 @@ li {
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 780px) {
|
||||
.openbokeron-body {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.openbokeron-actions {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 980px) {
|
||||
.menu-card {
|
||||
grid-column: span 2;
|
||||
|
||||
Reference in New Issue
Block a user