Rediģējiet savu CSS dizainu pārlūkprogrammā ar CSS George
Vai esat kādreiz gribējis veikt tiešus labojumus jūsu pārlūkprogrammā, neatgriežoties atpakaļ uz CSS failiem? Viens risinājums ir Chrome izstrādātāju rīki, bet daži izstrādātāji dod priekšroku vienkāršākai darbplūsmai.
Tieši tur CSS George Šis bezmaksas pārlūka rediģēšanas rīks darbojas virs LESS un tas ir ierosināts a vienkāršs JavaScript fails.
Lielākā daļa izstrādātāju dod priekšroku a pārlūkprogrammas redaktors tā kā ne visi izmanto LESS precompiler. Bet CSS George nedarbojas LESS vidē var ātri uzstādīt caur npm.
Ja jums ir uzstādīts npm, jūs varat palaist šo vienkāršo kodu pievienot avota failus jūsu pašreizējam projektam:
npm instalēt --save-dev css-george
Vai arī varat velciet George.js failu no GitHub, kur tas ir izvietots blakus visiem citiem avota failiem. Viss projekts ir brīvs un atvērts, lai jūs varētu lejupielādējiet pilnu kopiju no GitHub, ja nevēlaties izmantot npm.
Ar .js failu, kas pievienots jūsu vietnes galvenei, varat sākt izpilda Džordža funkcijas tieši no pārlūka. Uz atveriet redaktora logu, noklikšķiniet uz tildes taustiņa, kas ir pieejams no Shift + ', kas atrodas vairuma tastatūru augšējā kreisajā stūrī. A jauns logs jāparādās šādam:
No šī ekrāna varat rediģēt LESS mainīgos izmanto visu, sākot no krāsām, līdz fontu izmēriem vai fontu ģimenēm.
Šis ir LESS spraudnis kļūst par nepieciešamību jo jums ir jāpasaka CSS George kādi mainīgie lielumi jāiekļauj. Kad viņi ir izveidoti, jūs varat vienkārši atveriet CSS George pārlūka redaktoru un dodieties uz pilsētu.
Es ceru, ka tas ir acīmredzams, ka šis rīks nevajadzētu jāiekļauj runtime. Ja vien jūs īpaši nevēlaties apmeklētājus rediģējiet lapas krāsu un stilu, kas parasti nav laba ideja. Bet vietējās pārbaudes, CSS George ir reta rīks, kas piedāvā lietderību visiem frontend izstrādātājiem.
Jūs varat redzēt to dzīvot CSS George demonstrācijas lapā vai lejupielādējiet pilnu kopiju caur npm vai no GitHub repo.
