Twitter Bootstrap cu alte culori


Am scris în ianuarie pentru prima oară despre Twitter Bootstrap şi au urmat apoi câteva articole mai în detaliu… dar m-am oprit. Însă nu m-am oprit din a folosi acest framework deosebit. În fapt am avut două proiecte deja scrise cu el şi sunt foarte mulţumit! Dacă nu mă înşel, un comentariu al unui cititor spunea cândva ceva de genul: “dar cu Bootstrap nu vor arăta toate siturile la fel?” Ei bine, nu. Bootstrap ne permite chiar din pagina oficială să afectăm în primul rând culorile, dar puţin şi unele dimensiuni (de la fonturi, la elemente, precum înălţimea la nabar).

imagine

Ce trebuie să facem este să pornim de la pagina Customize. Desigur, dacă vrem să reducem dimensiunea framework-ului vom debifa ce nu folosim în proiectul nostru. Dar noi sărim acum la Customize variables, unde vine o listă deloc prietenoasă de variabile ale căror sens este parţial intuibil din nume. Aşa că ce urmează este o dureroasă experienţă de “hai să modific aici aşa… şi aici aşa… şi aici aşa… şi să văd ce iese”. Trecem la ultimul pas, descărcăm, despachetăm, testăm… nu ne place ceva? revenim şi mai modificăm din valori. Ce este incredibil de primitiv e că nici măcar un colorpicker nu ai la dispoziţie! Pe de altă parte sunt sigur că se va investi în curând (nu ştiu exact ce înseamnă “curând”) într-un instrument mai avansat, care nu doar să ofere o soluţie mai bună pentru introdus culorile, dar şi să îţi ofere o previzualizare imediat ce ai modificat ceva.

Până atunci sunt alte instrumente care încearcă să acopere parţial această lipsă. De departe favoritul meu în acest moment este Bootstrap ThemeRoller, chiar dacă nu este teribil de complet. Observaţi mai jos cum am afectat culorile pentru navbar şi dropdown. Dar similar se pot afecta culorile pentru butoane, pentru tabele, pentru alerte… Nu chiar tot, ci probabil ce a considerat autorul că e mai important. De exemplu dacă vreţi să schimbaţi culoarea la hero-unit… nu veţi putea de aici. Desigur, puteţi edita fişierul CSS… dacă ştiţi unde anume. Soluţii cumva similare (fiecare cu plusurile şi minusurile ei) ar fi Style Bootstrap sau Bootstrap Magic. Poate mai sunt şi altele şi ni le împărtăşiţi în comentarii!

imagine

Eu închei cu o ultimă propunere, un sit care vine cu teme de-a gata: Bootswatch. Evident că – cu ştiinţă! – mai puteţi apoi modifica temele. Poate nu vă place fontul implicit, sau sunt alte motivaţii. Dar e un bun punct de plecare, afectând adesea radical tema iniţială oferită de Bootstrap. Deci… ca să revin la întrebare… se poate să modifici interfaţa cum vrei tu, dar evident că un ochi format tot va recunoaşte Bootstrap în spatele unei webaplicaţii (plus că oricând poţi arunca o privire în sursă). Dar temerea că toate vor arăta la fel cu Bootstrap nu e întemeiată.

imagine imagine


Apreciază articolul:

1 stea2 stea3 stea4 stea5 stea (2 evaluări, media: 5,00 din 5)
Loading...Loading...

0 comentarii


Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile necesare sunt marcate *