Veb-sayt hazırlayarkən ən çox vaxt aparan məqamlardan biri düymələrin dizaynıdır. İstər sadə, istər gradientli, istərsə də ikonlu düymələr olsun – hər bir variantı ayrıca CSS-də yazıb səhifəni yeniləmək çox da rahat deyil. Bir tərtibatçı bu problemi həll etmək üçün sadə, lakin effektiv bir brauzer aləti hazırlayıb.
Alət https://uni928.github.io/Uni928PublicHTMLs/index78.html ünvanında əlçatandır. Heç bir quraşdırma tələb olunmur – səhifəni açırsınız, bir-birindən fərqli düymə dizaynlarını görürsünüz və bəyəndiyinizi seçirsiniz. Düymələr real interaktiv elementlər kimi təqdim edilib, yəni hover, focus və pressed vəziyyətlərini birbaşa brauzerdə müqayisə edə bilərsiniz.
Necə işləyir?
Alətin əsas özəlliyi kopyalama iş axınıdır. İstənilən düyməyə kliklədiyiniz zaman həmin dizayn üçün minimal HTML nümunəsi kopyalanır. Bu nümunəyə lazımi CSS də daxildir, ona görə də kodu yeni fayla yapışdırıb dərhal sınaqdan keçirə bilərsiniz. Əlavə olaraq səhifədə sürətli kopyalama paneli, kodun ön izləməsi və uğurlu kopyalamadan sonra vizual rəy də var.
Kolleksiyada işıqlı, tünd, gradientli, konturlu, yumru, həbşəkilli, ikonlu və daha eksperimental dizaynlar yer alır. Hər bir düymə ayrıca sınaqdan keçirilə bilər – bu, xüsusilə rəng kombinasiyalarını müqayisə etmək və ya prototip hazırlamaq üçün əlverişlidir.
Kimlər üçün faydalıdır?
Bu alət xüsusilə sürətli prototip hazırlayan, kiçik statik saytlar quran, açılış səhifələri sınaqdan keçirən və ya CSS dizayn ideyaları axtaran tərtibatçılar üçün nəzərdə tutulub. Kopyalanan kod həmçinin GitHub Pages layihələrində və ya fərdi interfeyslərdə başlanğıc nöqtəsi kimi istifadə edilə bilər.
Xülasə, bu tam bir UI framework deyil, amma praktik düymə ideyaları toplusudur. Sənədləşməni vərəqləmək və ya dizaynı sıfırdan qurmaq əvəzinə, səhifəni açıb bəyəndiyiniz düyməni seçir və bir kliklə onun işlək nümunəsini əldə edirsiniz.
Mənbə: Dev.to (https://dev.to/uni928/a-button-showcase-with-one-click-html-copy-5gi7)
