Trebalo bi dobiti 9 Mixin knjižnica za dizajnere Sassa
Ako koristite Sass u svom razvojnom tijeku, znate važnost mixinsa. Kada vidite neke stvari koje su napisane više puta i zamorno u CSS-u, tu vam mixins može pomoći da spriječite ponavljajući rad. Mixin sadrži CSS izjave koje možete ponovno upotrijebiti na cijelom web-mjestu.
Postoje mnogi mixini koje su napravili programeri, koji će vam pomoći pri radu sa Sassom u vašem razvoju. Većina pokriva stvari koje se često ponavljaju u CSS-u. Iz prilagođavanje na više preglednika do stvaranje gumba, animacija i efekata prijelaza, pronaći ovo i još mnogo toga u sljedećih 11 mixin knjižnica koje bi trebali dobiti za Sass razvoj.
1. Bourbon
Bourbon je Sass knjižnica koja sadrži mixin, funkcije i dodatke koji vam omogućuju pojednostavljenje stvaranja stilskih listova za korištenje među preglednicima. Za mene je ovo najljepši Sass mixin. Sadrži gotovo sve što vam je potrebno za stil vaše web stranice, a zadržite svoju stilsku tablicu laganu.
Pogledajte cjelokupnu dokumentaciju da biste koristili svaku dostupnu mješavinu i funkciju.
2. Sass CSS3 Mixins
Sass CSS3 Mixins pruža miksine koji rade na različitim preglednicima. Ovdje ćete naći hrpu najboljih mješavina poput pozadine, obruba, okvira, stupca, font-face, transformacije, prijelaza i animacije. To je dovoljno za vaše potrebe oblikovanja. Za korištenje uvezite oznaku css3-mixins.scss i pozovite mixin u CSS klasi.
Preuzmite ovaj mixin ovdje.
3. CssOwl
CssOwl pruža korisne kombinacije za postavljanje položaja elementa (relativnog ili apsolutnog) i dodavanja sadržaja pseudo selektorom ( :nakon i :prije). Ona također pomaže kada želite stvoriti elemente duhova: mixin daje fleksibilnost za postavljanje položaja slike u vašem duhu. Osim Sassa, dostupna je i CssOwl mixin knjižnica za LESS i Stylus.
4. Točka prekida Sass
Točka prekida pomaže vam da medijske upite putem Sassa učinite jednostavnim. S Breakpointom možete stvoriti varijable i dati mu vrijednost koja definira min širine ili max širine medijskih upita. Budući da je varijabla koju ste stvorili ima smisleno ime, možete je jednostavno nazvati za upotrebu u Sassu.
5. Scut
Scut sadrži skup višekratnih Sass mixina, rezerviranih mjesta, funkcija i varijabli koji vam pomažu da lako implementirate uobičajene uzorke stilskih kodova. On pruža kôd najbolje prakse za izradu web-sadržaja poput izgleda stranica i tipografije stila. Možete poništiti ponavljanje kada pišete kôd tako da češće koristite kôd. Tako vam pomažemo da se više organizirate u tom procesu.
6. Šafran
Sa šafranom možete s lakoćom dodati CSS3 animacije i prijelaze. Postoji desetak dostupnih animacija i prijelaza, uključujući izbljeđivanje, izlaz / izlaz, podizanje / udaljavanje, kao i razne efekte kao što su trešnja, drhtanje, odbijanje, i drugi. Da biste koristili Saffron samo uključite mixin u Sass deklaraciju i pozovite ime učinka unutar CSS klase. Saffron možete dobiti tako da ga instalirate pomoću Bowera ili Gem-a, ili ga jednostavno preuzmite iz Githuba.
7. Upišite Postavke
TypeSettings je vrsta alata za Sass. Postavit će veličinu fonta u modularnoj ljestvici koristeći em (umjesto rems-a ili piksela), vertikalni ritam i odgovarajući naslove na temelju omjera. Možete ga instalirati i sa Bower-om, skinuti izdanje ili klonirati repo. Za više pojedinosti pogledajte njegovu stranicu.
8. Sass Line
Sass Line je Sass mixin koji vam pomaže da napravite bolju tipografiju. Koristi rems jedinicu na vašem fontu tako da je možete raditi proporcionalno s osnovnom mrežom. Sass Line koristi precizan vertikalni ritam temeljen na osnovnoj mreži i omogućuje vam postavljanje modularne skale za svaku od svojih točaka prekida kako biste dobili dobre razmjere u svim aspektima vaše web-lokacije.
Idite ovdje da biste saznali više o tome kako ga koristiti.
9. Andy.scss
Andy.scss je kolekcija korisnih Sass miksina, napravljenih da vam pomognu razviti izgled web stranice s lakoćom, a da pritom zadržite svjetlost. Dostupno je na desetke Sass mixina, od pozadina do animacija. Gotovo sva uobičajena svojstva CSS-a ovdje su obuhvaćena. Uzmi ga u Githubu.
Više postova na Sassu:
- Početak rada sa Sassom
- Kopanje u Sass
- Kako sastaviti Sass s uzvišenim tekstom
- Korištenje Bootstrap 3 sa Sass
- Kako izgraditi online VCard s Sass i kompas
- CSS preprocesori u usporedbi: Sass vs. MANJE
- Sintaktički strašni stilovi: korištenje kompasa u Sassu
- Kako pretvoriti CSS u Sass i SCSS
