add logo and project name

This commit is contained in:
Pavel Sviderski
2025-01-10 14:07:44 +10:00
parent d922f7bfed
commit fa54584128
3 changed files with 97 additions and 29 deletions
+27 -29
View File
@@ -15,37 +15,35 @@
<!-- Site header -->
<header class="absolute top-2 md:top-6 w-full z-30">
<div class="px-4 sm:px-6">
<div class="max-w-3xl mx-auto">
<div class="flex items-center justify-between h-14 border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.white))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg px-3">
<!-- Site branding -->
<div class="shrink-0 mr-4">
<!-- Logo -->
<a class="flex items-center justify-center bg-white w-8 h-8 rounded shadow-sm shadow-zinc-950/20"
href="index.html">
<img src="./images/logo.png" width="24" height="24" alt="Logo">
</a>
</div>
<!-- Desktop navigation -->
<nav class="flex grow">
<!-- Desktop sign in links -->
<ul class="flex grow justify-end flex-wrap items-center">
<li>
<a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-3 lg:px-5 py-2 flex items-center transition"
href="login.html">Log in</a>
</li>
<li class="ml-1">
<a class="btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow"
href="request-demo.html">Request Demo</a>
</li>
</ul>
</nav>
<div class="max-w-6xl mx-auto px-4 sm:px-6">
<div class="flex items-center justify-between h-14">
<!-- Site branding -->
<div class="shrink-0 mr-4">
<a class="flex items-center" href="index.html">
<img class="w-8 h-8 rounded shadow-sm shadow-zinc-950/20" src="./images/logo.svg"
alt="Logo">
<span class="ml-2 font-semibold text-lg text-zinc-900">uncloud</span>
</a>
</div>
<!-- Desktop navigation -->
<nav class="flex grow">
<!-- Desktop sign in links -->
<ul class="flex grow justify-end flex-wrap items-center">
<li>
<a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-3 lg:px-5 py-2 flex items-center transition"
href="login.html">Log in</a>
</li>
<li class="ml-1">
<a class="btn-sm text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow"
href="request-demo.html">Request Demo</a>
</li>
</ul>
</nav>
</div>
</div>
</header>