SearchApi Design System
x
1
2
3
<span class="grid size-5 shrink-0 place-items-center rounded-sm bg-surface-sunk
           text-xs font-medium leading-none tracking-tight text-ink-muted"
    role="img" aria-label="Yandex">Ya</span>
1
render BrandIconComponent.new(icon: nil, label: "Yandex", letter: "Ya", decorative: false)

A lettermark is not an image element, so it names itself through aria-label rather than through a .</p> </div> </div> </div> </section><section x-ref="params" data-tab-panel="params" x-bind:class="{ hidden: !isActive($el) }" class="h-full" data-component="tab-panels-panel" x-cloak="true"> <div id="panel-params" data-panel="params" class="h-full" data-component="inspector-panel"> <div class="p-4 w-full h-full bg-lookbook-prose-bg" id="params-editor-blank-slate"> <div class=" prose prose-sm text-lookbook-prose-text bg-lookbook-prose-bg prose-a:text-lookbook-prose-link prose-headings:font-semibold prose-h1:font-bold" data-component="prose"> <p><em class='opacity-50'>No params configured.</em></p> </div> </div> </div> </section> </div> </div> </div> </div> </div></main> </div> </div> <div class="absolute opacity-0 bg-black inset-0 top-[39px] z-[-1] transition-opacity" x-bind:class="($store.layout.mobile && !sidebarHidden) && '!opacity-30 !z-[1000]'" data-cloak></div> </div> </body> </html>