Stylish

Сегодня я хотел бы поделиться с вами своей очередной находкой. Находка касается очередного расширения для Mozilla Firefox - Stylish.
А все началось с того, что сегодня мне окончательно надоело куча лишних рекламных (и не только) колонок на computerra (в результате сама статья становится до ужаса узкой). Обычные вырезалки нежелательного контента мне не подходили, т.к. они, конечно, что то вырезают, но не факт, что остальной контент после этого встанет на место вырезанного (т.е. займет освободившуюся часть)...

Для начала (когда я еще не знал про Stylish) я решил просто проверить, на сколько можно изменить внешний вид computerra подручными средствами. Подручным средством оказался firebug (по моему скоро это расширение станет одним из моих самых любимых). С его помощью я довольно быстро разобрался, что мне надо отключать, какие стили править и т.д. Подытожив я понял что сия махинация возможна, осталось только все это автоматизировать.
Дальше начались долгие поиски. Через некоторое время я уже совсем отчаялся и решил, что изучу наконец - как же пишутся эти самые расширения для Firefox (я же все таки программист как ни как). Но, тем не менее лень меня победила (я же все таки программист как ни как) и закончилось все тем, что я нашел уже готовое расширение для Firefox :D Стоит сказать, что изучение устройства расширений лишним тоже не оказалось;)
Найденным расширением, как несложно догадаться, стало Stylish. После небольшого изучения я приступил к реализации, а именно выбрал создание нового стиля для cumputerra в котором для начала: скрыл верхний баннер, самую правую колонку (это там, где "сегодня в номере" и т.д., в общем, только место зря занимает), третью рекламную колонку а так же начало рекламы от бегуна (пока не придумал как убрать ее конец). В итоге получился следующий код:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("www.computerra.ru") {
#tophban {display: none !important }
#terralab {display: none !important }
#skyright {display: none !important }
#begunRoot {display: none !important }
}

Теперь на странице не отображается ничего лишнего (ну лишнего для меня), но, тем не менее остается куча свободного места, которое можно заполнить основным конентом (ради которого я и посещаю этот сайт). А все дело в том, что в коде заданы жесткие размеры - ничего, сейчас поправим;). Для этого ставим ширину шапки и страницы в 100%, а не 770px, как было:

#top {width: 100% !important }
#page {width: 100% !important }

После этого замечаем, что контент всеравно имеет слишком большой отступ от правого края - этот отступ предназначался для размещения в нем рекламы, но ее то у нас уже нет;) так что уменьшаем отступ:

.content {margin-right: 20px !important }

Ну и на последок я решил просто выравнивать текст в абзацах по ширине (уж не знаю почему мне так больше нравится):

p {text-align: justify !important }

Ну и две картинки, что бы можно было сравнить "до" и "после":

Стоит сказать, что Stylish еще поддерживает и публикацию ваших стилей в общую базу, а так же поиск стилей других пользователей для данного сайта. Т.е. если вы хотите подставить для сайта свой стиль для чего либо, то, сначала посмотрите, нет ли уже аналогичных стилей других пользователей (зачем изобретать велосипед). Сделать это можно вызвав команду Stylish - "Find Styles for this Page". Для computerra уже был один стиль, но он не делал то, что было нужно мне.
P.S. Кстати, когда выравнивал текст по ширине, обнаружил небольшой баг в firebug (ну или в firefox). Дело в том, что материал находится в div с id="article" и я сначала прописал у него text-align: justify !important; тем не менее тег p внутри него не принял этот атрибут, точнее он не заменил свой text-align: left; (который определен для всех p на странице, но выше по иерархии) не смотря на то, что по мнению firebug он это должен был сделать.