Menene Lily?

Taƙaitaccen bayani

Lily jerin abubuwan gidan yanar gizo ne, kowanne yana cikin salo takwas marasa kai (HTML, Svelte, React, Vue, Angular, Blazor, Nunjucks da Web Components), da kuma jerin cikakkun aikace-aikacen misali da ke nuna yadda ake yi musu ado.

Sigogi marasa kai suna zuwa da babu CSS. Suna ba ka HTML mai ma’ana, matsayi da yanayin ARIA, goyon bayan madannai da kaddarori masu dacewa da ƙasashen duniya. Zane na gani kai ne za ka kawo.

Ka’idojin zane

Mai sauƙin shiga

Kowane ɓangare yana farawa daga HTML mai ma’ana. Ana ƙara ARIA ne kawai a inda HTML shi kaɗai ba zai iya bayyana tsarin ba. Abubuwan suna nufin WCAG 2.2 AAA — ana la’akari da launuka, tazara, mayar da hankali da tafiya ta madannai duka.

Mai haɗuwa

Lily tana fifita ƙananan abubuwa masu manufa ɗaya waɗanda ke shiga juna. Tsare-tsaren haɗaka suna maimaituwa:

• Nav → List → ListItem — don burodin hanya, jerin abubuwan ciki, menu na akodiyon, menu na bishiya da rarraba shafuka
• Form → Field → Input — don kowane tsarin fom mai lakabi, alamu da kurakurai
• Table → Head/Body/Foot → Row → Data — don tebura, kalanda, taswirar Gantt da allunan kanban
• Bar → BarButton — don sandunan kayan aiki, sandunan shafuka, sandunan ayyuka, sandunan ɗawainiya da sandunan menu
• Picker → PickerButton — don masu zaɓen launi, masu zaɓen ƙima, masu zaɓen jigo

Mai iya daidaita ƙasashen duniya

Babu ko ɗaya daga cikin rubutun da mai amfani ke gani da aka rubuta a cikin lamba. Lakabi, masu riƙe wuri, saƙonnin kuskure, rubutun maɓalli — duka sigogi ne. Ɗora tsarin fassararka kuma Lily tana magana da kowane harshe da kake magana.

Marar kai

Abubuwa marasa kai suna da babu CSS, babu wani <style> toshe, babu wasu alamomin zane da ba ka zaɓa ba. Suna bayyana sunan aji ɗaya na kebab-case a kan kowane tushen abu don ka iya kai musu hari yadda kake so — CSS mai ma’ana, Tailwind, CSS-in-JS, shawararka ce.

Cikakkun misalai

Aikace-aikacen misali suna nuna yadda ake yi wa abubuwa ado don amfani na gaske — waɗanne alamomin zane za a saita, waɗanne bambance-bambance za a ƙara, yadda ake haɗa shafuka. Cikakkun aikace-aikacen SvelteKit, Next.js, Nuxt, Blazor da Eleventy ne, ba wuraren gwaji kawai ba.

Tushen kwarin gwiwa

Lily tana ɗaukar tsare-tsare da harshe daga faffadan tarin tsarin zane da aka zaɓa da gangan:

• NHS UK Design System
• GOV.UK Design System
• U.S. Web Design System (USWDS)
• ONSdigital design system
• Design System AU (Australian Government)
• Mozilla Protocol
• Adobe Spectrum
• Ant Design
• Wonderflow Wanda
• DaisyUI
• shadcn/ui
• Reuters graphics components

Lasisi

Lily tana da lasisi da yawa a ƙarƙashin BSD, MIT, Apache-2.0, GPL-2.0, ko GPL-3.0. Zaɓi wanda ya dace da aikinka. Idan babu wanda ya dace, ka tuntube mu.

Tuntuɓa

Shugaban aiki: Joel Parker Henderson — joel@joelparkerhenderson.com.

Ka sami kuskure, kana da ra’ayi, kana son ba da gudummawar wani abu? Buɗe issue ko pull request a GitHub.