Аутоматизујте селекторе нтх-цхилд са Фамили.сцсс Микинс
Сасс је најбољи начин за управљање модерним ЦСС-ом и микин либрариес може уштедети још више времена током развојног циклуса.
Ови миксини раде аутоматизовани кодови или функције које зовете у главним Сасс фајловима. Неки микини су опћенитији, док су други врло специфични, као што је Фамили.сцсс либрари.
Ова бесплатна библиотека нуди 26 микинс фор руннинг комплекс : нтх-цхилд
селектора без меморисања тог кода.
Већина програмера зна за : нтх-цхилд
селектор и по дефаулту, то свакако није компликовано. Ви једноставно проћи нумерички селектор, на пример : нтх-цхилд (2) \ т
где се припадна правила стила примењују на свако друго дете родитељског елемента.
Међутим, ово може бити много сложеније када желите да одаберете динамички елементи (као што је прва и задња) или када желите да изаберете мала шачица елемената (као прво троје деце).
Овде Фамили.сцсс може да помогне. То је веома мала библиотека и садржи 26 решења за детекторе за децу од основног до супер комплексног. Сваки микин има демо на почетној страници, који можете прегледати и филтрирати по потреби.
Ево неких занимљиви примјери да покажете шта ова библиотека може да уради:
после првог (5)
- изаберите све елементе након првих 5 децеод краја (3)
- изаберите елемент од 3. до последњег дететасве-али (3)
- одаберите сва дјеца осим трећеуједначено (3, 12)
- изаберите све чак и децу између 3. и 12. елемената
Постоје десетине које можете прегледати, а свака од њих има демо да би вам помогла да визуализујете како функционишу.
Неколико напредних миксина ослањају се на количинске упите који бирају елементе који су “барем” или “Највише” фиксни на одређени опсег. На пример, можете изабрати сву децу за родитељске елементе који имају најмање 5 деце (или више њих).
Ове идеје могу бити збуњујуће када читате о њима, али ливе демос заиста би било кристално јасно.
Да би копао, можеш преузмите копију ове микин библиотеке из ГитХуб репоа, заједно са свим овим демосима. И, можете подијелити своје мисли или питања са креатором пројекта на Твиттеру @ЛукиВЈ.