Починим немного новые вырвиглазные реакции DTF – сделаем их ч/б или почти ч/б (инструкция внутри) + небольшой бонус

Так как на сайте добавили новые реакции, которые слишком отвлекают внимание, давайте попробуем сделать их не такими навязчивыми.

Правило для расширения Stylus для браузера будет ниже.

А пока примеры, как будет выглядеть с исправлением:

/* Делаем панель реакции менее яркой */ .reactions { filter: grayscale(100%) }

Наложение "100%" фильтра - даст полностью ч/б.
Наложение "70%" фильтра - оставит немного цвета.

Я для себя пока выбрал 70%.

Скачиваем расширение Stylus – для Firefox, или для Chrome
Открываем сайт DTF, и нажимаем на иконку расширения в панели браузера;
Нажимаем в меню "Создать правило для / Write style for" – курсором выбираем "dtf.ru" (внимательно выбирайте только основной домен "dtf.ru", без адреса страницы через знак "/" после него)
В открывшемся окне создания стиля вставляем код который приведён выше, и сохраняем через кнопку "Сохранить / Save" или "Ctrl+S"

Возвращаемся на сайт, и видим что цвет новой панели со реакциями стал не таким бросающимся в глаза

Кому не нравится вот эта полоса слева от ленты:

Её тоже можно исправить, сделав невидимой.
Чтобы появлялать только при наведении курсора, и то тонкой и аккуратной.

Правило для Stylus (вставляем в тот же стиль для DTF, ниже/выше предыдущего правила, через перенос строки):

/* Исправление полосы прокрутки слева от ленты */ .sidebar { /* For Firefox */ scrollbar-width: thin; scrollbar-color: transparent transparent; &:hover { scrollbar-color: rgba(128, 128, 128, 0.3) transparent; /* Серый полупрозрачный цвет */ } /* For WebKit browsers */ &::-webkit-scrollbar { width: 6px; height: 6px; } &::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, 0.5); transition: background-color 0.3s; } &::-webkit-scrollbar-thumb:hover { background-color: rgba(0, 0, 0, 0.3); } &::-webkit-scrollbar-track { background-color: transparent; } }

Вот что получится

Станет (<b>без наведения курсора</b> на левую панель)<br />

Станет (<b>при наведении курсора</b> на левую панель)<br />

#ПравимDTF

10 комментариев

Roanoac

6 июня

Идеально подойдет подсайту "жизнь"

Ответить

Drake Escalate

Да живы пока, все живы

nev3rfail

https://userstyles.world/style/16646/quick-and-dirty-fix-for-new-icons-on-dtf-ru
Уменьшил размер, уменьшил паддинги, сфлоатил и мне прям нравится даже. Имхо проблема больше в том что они место по вертикали отжирают а не в том что они вырвиглазные цветами.
Установка: установить stylus. пройти по ссылке. нажать install.
Установка на мобилки: перейти по ссылке с мобильного фаерфокса, нажать get stylus, затем нажать install.

P.S.: Оно чуть поплывет на мобилках — кнопка "ответить" уедет под кнопку "свернуть" если слишком много реакций будет. Но давайте посмотрим правде в глаза, не будет тут у комментов слишком много реакций. :D
P.S.: это что, блоки кода в редакторе пдф?