Add custom SVG logo: interlocking O/E mark + wordmark. Update nav and footer.

This commit is contained in:
Hermes Agent
2026-08-07 16:58:06 +00:00
parent 815bd60575
commit 16bc61420b
3 changed files with 45 additions and 4 deletions
+28
View File
@@ -0,0 +1,28 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480 120" fill="none">
<defs>
<linearGradient id="logoGrad" x1="0" y1="0" x2="1" y2="1">
<stop offset="0%" stop-color="#4338ca"/>
<stop offset="100%" stop-color="#3b82f6"/>
</linearGradient>
</defs>
<!-- Icon mark: interlocking O and E with connection dot -->
<g transform="translate(8, 10)">
<!-- Outer ring (O) -->
<rect x="4" y="4" width="92" height="92" rx="22" stroke="url(#logoGrad)" stroke-width="7" fill="none"/>
<!-- Inner bar (E) -->
<rect x="28" y="28" width="44" height="44" rx="11" fill="url(#logoGrad)" opacity="0.15"/>
<path d="M36 50h28M36 38h20M36 62h16" stroke="url(#logoGrad)" stroke-width="5.5" stroke-linecap="round"/>
<!-- Connection dot -->
<circle cx="72" cy="28" r="9" fill="url(#logoGrad)"/>
<circle cx="72" cy="28" r="3.5" fill="#fff"/>
</g>
<!-- Wordmark -->
<g transform="translate(120, 18)">
<!-- Odoo -->
<text x="0" y="36" font-family="'Inter','-apple-system',sans-serif" font-weight="700" font-size="32" fill="#0f172a" letter-spacing="-0.5">Odoo</text>
<!-- Expertos -->
<text x="0" y="72" font-family="'Inter','-apple-system',sans-serif" font-weight="300" font-size="26" fill="#64748b" letter-spacing="1.5">Expertos</text>
</g>
<!-- Tagline -->
<text x="360" y="82" font-family="'Inter','-apple-system',sans-serif" font-weight="400" font-size="9" fill="#94a3b8" letter-spacing="0.5" text-anchor="end">Proyectos + Expertos Odoo</text>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

+12
View File
@@ -0,0 +1,12 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" fill="none">
<defs>
<linearGradient id="fg" x1="0" y1="0" x2="1" y2="1">
<stop offset="0%" stop-color="#4338ca"/>
<stop offset="100%" stop-color="#3b82f6"/>
</linearGradient>
</defs>
<rect x="2" y="2" width="60" height="60" rx="16" fill="url(#fg)"/>
<rect x="10" y="10" width="44" height="44" rx="11" fill="#fff" opacity="0.15"/>
<path d="M18 32h28M18 24h20M18 40h16" stroke="#fff" stroke-width="5" stroke-linecap="round"/>
<circle cx="46" cy="22" r="5" fill="#fff" opacity="0.9"/>
</svg>

After

Width:  |  Height:  |  Size: 580 B

+5 -4
View File
@@ -10,6 +10,7 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<meta property="og:type" content="website"> <meta property="og:type" content="website">
<meta property="og:title" content="Odoo Expertos — Proyectos, expertos y conocimiento Odoo"> <meta property="og:title" content="Odoo Expertos — Proyectos, expertos y conocimiento Odoo">
<meta property="og:description" content="Conectamos proyectos Odoo con expertos hispanohablantes."> <meta property="og:description" content="Conectamos proyectos Odoo con expertos hispanohablantes.">
@@ -91,8 +92,8 @@
<nav class="glass-nav fixed top-0 left-0 right-0 z-50" style="height:64px;"> <nav class="glass-nav fixed top-0 left-0 right-0 z-50" style="height:64px;">
<div class="container h-full flex items-center justify-between"> <div class="container h-full flex items-center justify-between">
<a href="/" class="flex items-center gap-2.5" style="text-decoration:none;"> <a href="/" class="flex items-center gap-2.5" style="text-decoration:none;">
<div style="width:32px;height:32px;background:linear-gradient(135deg,#4338ca,#3b82f6);border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;color:#fff;">OE</div> <img src="/favicon.svg" alt="Odoo Expertos" width="28" height="28" style="display:block;">
<span style="font-weight:600;font-size:1rem;color:#0f172a;">Odoo Expertos</span> <span style="font-weight:700;font-size:1rem;color:#0f172a;letter-spacing:-0.3px;">Odoo <span style="font-weight:300;color:#64748b;">Expertos</span></span>
</a> </a>
<div class="hidden md:flex items-center gap-8"> <div class="hidden md:flex items-center gap-8">
<a href="/#blog" style="color:#475569;font-size:0.875rem;font-weight:500;text-decoration:none;transition:color 0.2s;" onmouseover="this.style.color='#4338ca'" onmouseout="this.style.color='#475569'">Blog</a> <a href="/#blog" style="color:#475569;font-size:0.875rem;font-weight:500;text-decoration:none;transition:color 0.2s;" onmouseover="this.style.color='#4338ca'" onmouseout="this.style.color='#475569'">Blog</a>
@@ -256,8 +257,8 @@
<div class="grid md:grid-cols-4 gap-12 mb-12"> <div class="grid md:grid-cols-4 gap-12 mb-12">
<div> <div>
<div style="display:flex;align-items:center;gap:10px;margin-bottom:16px;"> <div style="display:flex;align-items:center;gap:10px;margin-bottom:16px;">
<div style="width:28px;height:28px;background:linear-gradient(135deg,#4338ca,#3b82f6);border-radius:6px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11px;color:#fff;">OE</div> <img src="/favicon.svg" alt="Odoo Expertos" width="24" height="24" style="display:block;">
<span style="font-weight:600;color:#fff;">Odoo Expertos</span> <span style="font-weight:700;font-size:1rem;color:#fff;letter-spacing:-0.3px;">Odoo <span style="font-weight:300;color:#64748b;">Expertos</span></span>
</div> </div>
<p style="color:#64748b;font-size:0.875rem;line-height:1.7;max-width:280px;">Conectamos proyectos Odoo con expertos hispanohablantes. Conocimiento y talento verificado.</p> <p style="color:#64748b;font-size:0.875rem;line-height:1.7;max-width:280px;">Conectamos proyectos Odoo con expertos hispanohablantes. Conocimiento y talento verificado.</p>
</div> </div>