Како хаковати и персонализовати Фирефок Девелопер Тоолс Тхеме
Теме су особна ствар за нас програмере, не ради се само о уљепшавању уредника или алата. Ради се о изради екрана на који ћемо гледати (без пуно трептања) подношљивији да раде сатима и продуктивно. Фирефок има две теме за развојне алате: тамну и светлу. Оба су велика, али опције су и даље ограничене без начина да их персонализујете.
Сада, Фирефок користи комбинацију КСУЛ-а и ЦСС-а за свој кориснички интерфејс, што значи да се већина његовог изгледа може подесити само помоћу ЦСС-а. Мозилла омогућава корисницима да конфигуришу изглед својих производа помоћу ЦСС датотеке под називом "усерЦхроме.цсс". Можете додајте прилагођена правила стила у ЦСС датотеку и то ће се одразити на Мозилла производе.
У овом посту користићемо исту ЦСС датотеку за персонализацију развојних алата у Фирефоку.
Прво, морамо да пронађемо ЦСС фајл, или га направимо и ставимо на право место. Један брз начин проналажења фасцикле у којој ће се налазити "усерЦхроме.цсс" је одлазак на абоут: суппорт
у претраживачу и кликом на дугме "Прикажи фасциклу" поред ознаке "Фолдер профила". Ово ће отворити тренутни фолдер профила Фирефок-а.
У мапи профила видјет ћете мапу под називом "цхроме". Ако га нема, направите га и креирајте "усерЦхроме.цсс" у њему. Сада када је подешавање датотеке завршено, пређимо на код.
: роот.тхеме-дарк --тхеме-боди-бацкгроунд: # 050607! --тхеме-сидебар-бацкгроунд: # 101416! импортант; --тхеме-таб-тоолбар-бацкгроунд: # 161А1Е! --тхеме-тоолбар-бацкгроунд: # 282Е35! импортант; - тхеме-селецтион-бацкгроунд: # 478ДАД! - тхеме-боди-цолор: # Д6Д6Д6! --тхеме-боди-цолор-алт: # Д6Д6Д6! --тхеме-цонтент-цолор1: # Д6Д6Д6! --тхеме-цонтент-цолор2: # Д6Д6Д6! --тхеме-цонтент-цолор3: # Д6Д6Д6! - тхеме-хигхлигхт-греен: # 8БФ9А6! - тхеме-хигхлигхт-блуе: # 00Ф9ФФ! - тхеме-хигхлигхт-блуегреи: вхите! --тхеме-хигхлигхт-лигхторанге: # ФФ5А2Ц! - тхеме-хигхлигхт-оранге: иеллов; - тхеме-хигхлигхт-ред: # ФФ1247! --тхеме-хигхлигхт-пинк: # Ф02898!
Оно што видите изнад је код који сам додао у датотеку "усерЦхроме.цсс" да бих променио изглед алатки програмера из овог
на ово:
Хтела сам само да побољшам контраст мало више са тамнијом позадином и светлијим текстом у тамној теми (такође нисам добар у колор шемама), па сам остао са неким основним бојама које се обично користе у тамним темама. Ако сте бољи са бојама, експериментишите сами са бојама које сматрате прикладним да бисте пронашли бољу подударност са темом коју користите.
Код је само листа ЦСС варијабли боја које се користе за бојење различитих делова корисничког интерфејса ДевТоолс-а. Пронашли смо код у датотеци под називом "вариаблес.цсс" у компримованој датотеци под називом “омни.ја”:
У оперативном систему Виндовс датотека се налази на адреси:
Ф: /фирефок/бровсер/омни.ја
. Заменити Ф: са диск јединицом на којој сте инсталирали Фирефок.
У ОСКС-у, датотека се налази на адреси:
~ / Апплицатионс / Фирефок.апп / Садржаји / Ресоурцес / бровсер / омни.ја
.
Ово су компресоване Јава датотеке. У оперативном систему Виндовс можете преименовати .ја
екстензија до .зип
и користите изворни услужни програм за вађење Виндовс Екплорера да бисте истоварили датотеке у њему. У ОСКС-у, идите на Терминал и покрените унзип омни.ја
. Имајте на уму да направите копију датотеке у другом директоријуму пре него што то учините.
Када је омни.ја извађен, можете пронаћи датотеку на /цхроме/девтоолс/скин/вариаблес.цсс
; да, Фирефок ДевТоолс скин је под именом именом хром
. Ин тхе вариаблес.цсс, видећете хрпу варијабли боја које се користе и за светле и за тамне теме на следећи начин
: роот.тхеме-лигхт -тхеме-боди-бацкгроунд: #фцфцфц; --тхеме-сидебар-бацкгроунд: # ф7ф7ф7; --тхеме-цонтраст-бацкгроунд: # е6б064; --тхеме-таб-тоолбар-бацкгроунд: #ебецед; --тхеме-тоолбар-бацкгроунд: # ф0ф1ф2; - позадина за избор теме: # 4ц9ед9; - тематска селекција-позадина-полупрозирна: ргба (76, 158, 217, .23); -тхеме-селецтион-цолор: # ф5ф7фа; - боја-раздвајача: #аааааа; --тхеме-цоммент: # 757873; - тематска боја-тијела: # 18191а; --тхеме-боди-цолор-алт: # 585959; --тхеме-цонтент-цолор1: # 292е33; -тхеме-цонтент-цолор2: # 8фа1б2; --тхеме-цонтент-цолор3: # 667380; - тхеме-хигхлигхт-греен: # 2цбб0ф; - тхеме-хигхлигхт-блуе: # 0088цц; - тхеме-хигхлигхт-блуегреи: # 0072аб; - тхеме-хигхлигхт-пурпле: # 5б5ффф; --тхеме-хигхлигхт-лигхторанге: # д97е00; - тхеме-хигхлигхт-оранге: # ф13ц00; - тхеме-хигхлигхт-ред: # ед2655; --тхеме-хигхлигхт-пинк: # б82ее5; / * Боје које се користе у графиконима, као што су алати за извођење. Сличне боје за Цхромеову временску линију. * / - тем-графови-зелени: # 85д175; - тематски графикони-плави: # 83б7ф6; - тхеме-грапхс-блуегреи: # 0072аб; - тем-графови-пурпле: # б693еб; - теми-графови-жути: # ефц052; - тхеме-грапхс-оранге: # д97е00; - тем-графови-црвени: # е57180; - теми-графови-сиви: #цццццц; - тематски графикони - пуни црвени: # ф00; - тематски графикони - плаво: # 00ф; : роот.тхеме-дарк - тхеме-боди-бацкгроунд: # 14171а; -тхеме-сидебар-бацкгроунд: # 181д20; -тхеме-цонтраст-бацкгроунд: # б28025; -тхеме-таб-тоолбар-бацкгроунд: # 252ц33; -тхеме-тоолбар-бацкгроунд: # 343ц45; - тема-селекција-позадина: # 1д4ф73; - тематска селекција-позадина-полупрозирна: ргба (29, 79, 115, .5); -тхеме-селецтион-цолор: # ф5ф7фа; - боја-раздвајача: црна; --тхеме-цоммент: # 757873; -тхеме-боди-цолор: # 8фа1б2; --тхеме-боди-цолор-алт: # б6бабф; --тхеме-цонтент-цолор1: # а9бацб; -тхеме-цонтент-цолор2: # 8фа1б2; -тхеме-цонтент-цолор3: # 5ф7387; - тхеме-хигхлигхт-греен: # 70бф53; - тхеме-хигхлигхт-блуе: # 46афе3; - тхеме-хигхлигхт-блуегреи: # 5е88б0; - тхеме-хигхлигхт-пурпле: # 6б7абб; --тхеме-хигхлигхт-лигхторанге: # д99б28; - тхеме-хигхлигхт-оранге: # д96629; - тхеме-хигхлигхт-ред: # еб5368; --тхеме-хигхлигхт-пинк: # дф80фф; / * Боје које се користе у графиконима, као што су алати за извођење. Углавном сличне неким "врхунским" бојама. * / - теми-графови-зелени: # 70бф53; - тематски графикони плави: # 46афе3; - тхеме-грапхс-блуегреи: # 5е88б0; - тхеме-грапхс-пурпле: # дф80фф; - тематски-жути: # д99б28; - тхеме-грапхс-оранге: # д96629; - тематски-црвени: # еб5368; - тематски графови-сиви: # 757873; - тематски графикони - пуни црвени: # ф00; - тематски графикони - плаво: # 00ф;
Изаберите тему и променљиве које желите да циљате и додајте их у свој "усерЦхроме.цсс".
Ево још неких снимака екрана мог развојних алата.