feat: apply azionelab branding to frontend

This commit is contained in:
2026-05-05 10:46:10 +02:00
parent cf4e9ec239
commit fbbb1ae5fe
9 changed files with 213 additions and 179 deletions

View File

@@ -15,29 +15,29 @@ import { MatButtonModule } from '@angular/material/button';
<div class="app-shell">
<div class="topline">
<div class="topline-inner">
<span>Rome-based theatre company</span>
<span>Reservations, confirmation, and entrance check-in</span>
<span>Laboratori teatrali & produzioni audio/visive</span>
<span>Direzione artistica a cura di Ernesto Estatico</span>
</div>
</div>
<header class="site-header">
<div class="header-inner">
<a class="brand" routerLink="/">
<span class="brand-mark">A</span>
<img class="brand-logo" src="assets/azionelab-logo.svg" alt="AzioneLab" />
<span class="brand-text">
<strong>AzioneLab</strong>
<small>Independent theatre company</small>
<small>Laboratori teatrali & produzioni audio/visive</small>
</span>
</a>
<nav class="main-nav" aria-label="Primary navigation">
<a mat-button routerLink="/" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }">Home</a>
<a mat-button routerLink="/shows" routerLinkActive="active">Shows</a>
<a mat-button routerLink="/check-in" routerLinkActive="active">Check-in</a>
<a mat-button routerLink="/" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }">Inizio</a>
<a mat-button routerLink="/shows" routerLinkActive="active">Spettacoli</a>
<a mat-button routerLink="/check-in" routerLinkActive="active">Accoglienza</a>
</nav>
<div class="header-actions">
<a mat-stroked-button routerLink="/shows">Book a performance</a>
<a mat-stroked-button routerLink="/shows">Prenota uno spettacolo</a>
</div>
</div>
</header>
@@ -50,12 +50,12 @@ import { MatButtonModule } from '@angular/material/button';
<div class="footer-inner">
<div>
<p class="footer-title">AzioneLab</p>
<p class="footer-copy">Contemporary theatre evenings, small venues, and a lightweight booking flow built for real audiences.</p>
<p class="footer-copy">Un luogo per laboratori teatrali, produzioni audio/visive e serate di scena costruite con attenzione per il pubblico reale.</p>
</div>
<nav class="footer-nav" aria-label="Footer navigation">
<a routerLink="/">Home</a>
<a routerLink="/shows">Shows</a>
<a routerLink="/check-in">Check-in</a>
<a routerLink="/">Inizio</a>
<a routerLink="/shows">Spettacoli</a>
<a routerLink="/check-in">Accoglienza</a>
</nav>
</div>
</footer>
@@ -115,16 +115,12 @@ import { MatButtonModule } from '@angular/material/button';
text-decoration: none;
}
.brand-mark {
display: inline-grid;
place-items: center;
width: 48px;
height: 48px;
border-radius: 14px;
background: linear-gradient(145deg, var(--azionelab-accent), var(--azionelab-accent-soft));
color: #fff8f2;
font-weight: 700;
box-shadow: 0 14px 30px rgba(111, 40, 33, 0.18);
.brand-logo {
width: 58px;
height: 58px;
display: block;
object-fit: contain;
filter: drop-shadow(0 14px 30px rgba(111, 40, 33, 0.16));
}
.brand-text {