imagine-fundal

Blog / ClassColorJS - foloseste culori RGB folosind clase HTML!
facebook instagram whatsapp tiktok twitter

ClassColorJS este un script folositor, creat de echipa codulluiandrei pentru a scrie mai ușor culori RGB (red - green - blue = roșu - verde - albastru), folosind clase HTML (proprietatea class="content" a elementelor).

De ce?

Framework-uri moderne precum Bootstrap și Tailwind folosesc același sistem de clase, însă nu au toate culorile pe care noi ni le-am dorit la scrierea interfeței 2.0 și nu numai. Ca urmare, dacă programatorul dorește să schimbe mai ușor culoarea acesta poate folosi ClassColorJS, fără inline, external sau internal CSS, doar clasa si culoarea.

Cum functioneaza?

Folosind JavaScript, programul analizeaza clasele elementelor care contin si clasa ccjs (class color js). Dupa detectarea elementelor acestea sunt filtrate pentru a obtine strict comanda necesara, spre exemplu, daca dorim sa coloram in rosu un paragraf vom scrie: ccjs c-255-0-0, unde reprezinta codul pentru culoare de text si 255, 0 si 0 sunt elementele alcatuitoare codului RGB (255 rosu, 0 verde, 0 albastru). La final, ClassColor seteaza culoarea textului la RGB-ul introdus.

Care sunt comenzile?

c-roșu-verde-albastru (ex: c-255-0-0) pentru a schimba culoarea textului

bg-roșu-verde-albastru (ex: bg-0-255-0) pentru a seta culoarea fundalului

bc-roșu-verde-albastru (ex: bc-0-0-255) pentru a seta culoarea marginilor (border) Atenție, border-ul trebuie declarat separat!

Cum pot folosi aplicația?

Poți descărca sursa ca distributable (dist) de pe GitHub și o poți adăuga în folderul radăcină (root) al paginii web la care vei folosi programul sau poți importa (la finalul etichetelor <body> și <⁄body>) codul folosind următoarea linie HTML: 

imagine

pbinfo / 122

imagine

pbinfo / 939

imagine

pbinfo / 666