Logo
Belgi — M harfi oçiq kitobdek kesilgan blok, çap-yuqorida xatçöp lentasi: «bu yerdan öqişni davom ettiring». Içida mayda «Oçiq manba». Siçqonça olib borilsa, blok kengayib töliq nom — MANBAA çiqadi.
Animatsiya
Adaptiv holatlar orasida aylanadigan jonli belgi: har holatda 1 soniya töxtaydi; ötişda avval yozuv sönadi, keyin blok şaklini özgartiradi, blok töxtagaç yangi yozuv çiqadi — bir vaqtda bitta harakat (töliq aylaniş ~26 soniya). Lenta blok bilan birga yuradi.
<script src="https://manbaa.uz/manbaa-logo.js" defer></script>
<manbaa-logo fit></manbaa-logo> <!-- fit — maydon markazida; sarlavha va satr ichida fit'siz -->
<style> manbaa-logo { --logo-fg: #000; --logo-bg: #fff; --logo-accent: #F0A358; width: 600px; } </style>
<!-- Qorong'i fon: --logo-fg: #fff; --logo-bg: #000; --logo-accent: #7C49F4 -->
<!-- loop="false" · static · speed="1.5" -->Asosiy belgi
Ölçamlar
S — juda kiçik joylar uçun (sarlavha, belgiça): M içidagi «Oçiq manba» yozuvi bölmaydi — bu ölçamda öqilmaydi. M, L, X va XL — yozuv bilan.
Hover — kengayiş
Siçqonçani belgiga olib boring (klaviaturada — Tab bilan fokus). Blok 132 → 462 birlikka silliq kengayadi, mayda yozuv sönadi, katta «MANBAA» çiqadi. Sarlavhada kengayiş menyuni öngga suradi. «Harakatni kamaytiriş» yoqilgan qurilmada kengaymaydi.
Ixçam variant
Lenta va uç qatorli nom — hujjat, slayd, hamkor sayt va bosma uçun.
Ranglar
- Töq sariq
#F0A358Lenta (asosiy)--mb-logo-lenta - Oç binafşa
#A57FFELenta (muqobil), qoronği rejim havolasi--mb-binafsha (qorong‘i) - Binafşa
#7C49F4Lenta (ixçam karta), havola va tugma--mb-binafsha - Qora
#000000Blok (yoruğ fonda); qoronği fonda — oq--mb-logo-blok
Tokenlar — src/styles/brand-manbaa.css: --mb-logo-blok, --mb-logo-ichki, --mb-logo-lenta, --mb-logo-lenta-binafsha (qoronği rejimda blok oq, yozuv qora). Brend binafşasi — FoxUI'dagi Manbaa sahifasida.
Adaptiv holatlar
Joyiga qarab: kvadrat, keng lenta, tik ustun, uç qatorli nom. Figma: 7:133.
Işlatiş
---
import Logo from '../components/Logo.astro';
---
<!-- Sarlavha: S (yozuvsiz), kengayganda menyuni suradi -->
<Logo olcham="S" sur />
<!-- Footer / qorong'i fon: M, lenta binafsha -->
<Logo olcham="M" lenta="binafsha" />
<!-- Faqat belgi (kengaymaydi), boshqa havola -->
<Logo olcham="L" hover={false} href="/haqida" label="Manbaa haqida" />
<!-- O'lchamlar: S 34 · M 48 · L 64 · X 96 · XL 128 px (S — M ichidagi yozuvsiz) -->Favikon va ilova ikonlari (favicon.svg, 180/192/512 px) — node scripts/logo-ikonlar.mjs bilan şu vektordan yasaladi; favikonda mayda yozuv yöq (16 px da öqilmaydi).