feat: branding Romfast în header și footer

Adăugat antet și subsol comune Romfast: siglă (link către romfast.ro),
titlul aplicației și „Romfast SRL", plus link „Aplicații online"
(romfast.ro/menu/aplicatii-online.html). Fără fundal colorat — se
integrează cu interfața existentă a aplicației.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Claude Agent
2026-06-26 19:46:43 +00:00
parent 9bcb2f8099
commit 593df7e3ed
2 changed files with 51 additions and 0 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

View File

@@ -3,6 +3,19 @@
<AppSidebar v-if="showSidebar" />
<div class="app-main" :class="{ 'with-sidebar': showSidebar, 'sidebar-collapsed': collapsed }">
<!-- Romfast brand header -->
<div class="rf-wrap rf-wrap-top">
<header class="rf-header">
<a class="rf-header-brand" href="https://romfast.ro" target="_blank" rel="noopener" title="romfast.ro — toate aplicațiile">
<img class="rf-header-logo" src="/romfast_logo.png" alt="Romfast">
</a>
<div class="rf-header-titles">
<h1 class="rf-header-title">Space Booking</h1>
<div class="rf-header-sub">Romfast SRL</div>
</div>
</header>
</div>
<!-- Mobile header bar -->
<div v-if="showSidebar" class="mobile-header">
<button class="mobile-hamburger" @click="toggleMobile" aria-label="Open menu">
@@ -52,6 +65,17 @@
<main class="content">
<router-view />
</main>
<!-- Romfast brand footer -->
<div class="rf-wrap rf-wrap-bottom">
<footer class="rf-footer">
<a class="rf-footer-link" href="https://romfast.ro" target="_blank" rel="noopener" title="romfast.ro">
<img class="rf-footer-logo" src="/romfast_logo.png" alt="Romfast">
</a>
<span>© Romfast SRL</span>
<a href="https://romfast.ro/menu/aplicatii-online.html" target="_blank" rel="noopener">Aplicații online</a>
</footer>
</div>
</div>
</div>
</template>
@@ -166,6 +190,33 @@ onUnmounted(() => {
</script>
<style scoped>
/* ===== Romfast branding kit (header + footer) — comun tuturor aplicațiilor ===== */
.rf-wrap { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; box-sizing: border-box; }
.rf-wrap-top { margin-top: 1.25rem; }
.rf-wrap-bottom { margin-top: 2rem; margin-bottom: 1.25rem; }
.rf-header {
display: flex; flex-direction: row; align-items: center; gap: 14px;
padding: 14px 4px;
border-bottom: 1px solid var(--color-border, #e5e7eb);
}
.rf-header-brand { display: inline-flex; align-items: center; flex-shrink: 0; }
.rf-header-logo { height: 46px; width: auto; display: block; }
.rf-header-titles { min-width: 0; text-align: left; }
.rf-header-title { margin: 0; padding: 0; font-size: 20px; font-weight: 700; line-height: 1.2; color: var(--color-text-primary, #1f2937); letter-spacing: -0.01em; }
.rf-header-sub { margin-top: 2px; font-size: 11px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-text-secondary, #9ca3af); }
.rf-footer {
display: flex; flex-direction: row; flex-wrap: wrap;
align-items: center; justify-content: center; gap: 8px 18px;
padding: 16px 4px;
border-top: 1px solid var(--color-border, #e5e7eb);
font-size: 13px; color: var(--color-text-secondary, #6b7280); text-align: center;
}
.rf-footer-link { display: inline-flex; align-items: center; }
.rf-footer-logo { height: 22px; width: auto; display: block; opacity: 0.9; transition: opacity 0.2s ease; }
.rf-footer-link:hover .rf-footer-logo { opacity: 1; }
.rf-footer a { color: var(--color-text-secondary, #6b7280); text-decoration: none; }
.rf-footer a:hover { color: var(--color-text-primary, #111827); text-decoration: underline; }
/* Layout */
.app-main {
min-height: 100vh;