12

D`ark Pikabu eye safe

Полгода обкатки и проверок и наконец можно почитать пикабу ночью без напряга для глаз.
Учтено оооч много всего, настроек немного, но все нужные.
О фичах показано и рассказано на превьюшечках ниже.

Также стиль распространяется на хабр, basecamp, vc.ru и еще пару сайтов, на которые лично я захожу постоянно и хочется единообразия.

Вот, например картинка сравнения разных тем этого стиля


Два шага для того чтобы воспользоваться стилем:

1. Нажать зеленую кнопку и установить расширение для браузера
https://chrome.google.com/webstore/detail/stylish/fjnbnpbmke...

2. Выбрать по вкусу настройки и нажать большую зеленую кнопку для активации стиля
https://userstyles.org/styles/127222/d-ark-pikabu-eye-safe


Вы в любой момент сможете отключить стиль, нажав на галочку в меню приложения

0
Автор поста оценил этот комментарий

Привет, пользовался стилем долго, как-то убрал затенение картинок, винду поменял, не могу убрать, подскажи как , бесит что пипец

раскрыть ветку (1)
1
Автор поста оценил этот комментарий

Привет! Да, сайт стайлиша обновился и убил главный функционал. Если хочется убрать затемнение, то удали эти строки из настроек стиля. Они близко к верху находятся



.b-community-header[data-has-bg="1"] div.community-header-bg, .xyz_wrapper, #navbar .nav_panel .logo, div#facebook_like_box, .fb_iframe_widget, img, img[src*=gif], .b-video__preview, .b-gifx__player_show_yes { transition: 0.4s; -webkit-filter: brightness(0.6) saturate(40%); }


.b-community-header[data-has-bg="1"] div.community-header-bg:hover, #navbar .nav_panel .logo:hover, img:hover, .b-video__preview:hover, img[src*=gif]:hover, div.img-viewer>div.iv-frame>img, td.header-logo > a > div > #logo:hover, .addlink_button img, .b-gifx__player_show_yes:hover { transition: 0.4s; -webkit-filter: brightness(1.0) saturate(100%); }



div.img-viewer>div.iv-frame>img { transition: 0s !important }


td.header-logo > a > div > #logo, td.header-logo > a > div > #logo_shadow { -webkit-filter: brightness(0.6) saturate(100%); }


td.header-logo > a > div > #logo, td.header-logo > a > div > #logo_shadow{ -webkit-filter: brightness(0.75) saturate(100%); }


.i-sprite_sign_twitter:hover, .i-sprite--sign__twitter:hover, .i-sprite_sign_vk:hover, .i-sprite--sign__vk:hover, .i-sprite_sign_google:hover, .i-sprite--sign__google:hover, .i-sprite_sign_facebook:hover, .i-sprite--sign__facebook:hover { -webkit-filter: brightness(1.1) saturate(120%); }


[style="border: 1px solid #d7d7d7; border-radius: 3px; width: 298px;"] { border: none !important }


[id="facebook_page_block"] { -webkit-filter: brightness(0.4) saturate(40%); }



.b-story__show-all-images, .b-story__show-all-videos,.b-gtpost-panel-adding__button i, .b-gtpost-panel-adding__button i:hover { -webkit-filter: invert(1) !important; }


/*Затемняем картинки*/



вот как зайти в настройки:

Иллюстрация к комментарию
показать ответы
0
DELETED
Автор поста оценил этот комментарий

Прекрасно! А возможность самому менять цвет (хотя бы в коде) будет реализована?

раскрыть ветку (1)
1
Автор поста оценил этот комментарий

Dыносить эту возможность на страницу активации стиля не хочу, так как это создаст путаницу для новичков.

А в коде... ну, вы можете залезть, и поменять значения, но особого смысла нет, набор цветов для каждой из тем у меня строго определен. Если очень хочется, вы можете поменять var(--color9) на код цвета вида #000000

Иллюстрация к комментарию
Иллюстрация к комментарию
показать ответы
0
Автор поста оценил этот комментарий
А с планшетом как быть?(
раскрыть ветку (1)
1
Автор поста оценил этот комментарий

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

DELETED
Автор поста оценил этот комментарий

Привет.

Не мог бы ты сделать "новые сообщения" ярче или отличными от оригинала?

Это, пожалуй, единственный косяк твоего стиля. Непрочитанные сообщения почти не видно на черном фоне.

Иллюстрация к комментарию
раскрыть ветку (1)
1
Автор поста оценил этот комментарий
Привет. Ок, гляну что можно сделать с ними
показать ответы
0
Автор поста оценил этот комментарий

код изменился? как теперь убрать затемнение картинки?


теперь вместо простыни выше, только


.b-community-header[data-has-bg="1"] div.community-header-bg, .xyz_wrapper, #navbar .nav_panel .logo, div#facebook_like_box, .fb_iframe_widget, img, img[src*=gif], .b-video__preview, .b-gifx__player_show_yes, .b-logo, .avatar__default, .player__preview, .background { transition: 0.4s; -webkit-filter: brightness(0.6) saturate(40%); }



.b-community-header[data-has-bg="1"] div.community-header-bg:hover, #navbar .nav_panel .logo:hover, img:hover, .b-video__preview:hover, img[src*=gif]:hover, div.img-viewer>div.iv-frame>img, td.header-logo > a > div > #logo:hover, .addlink_button img, .b-gifx__player_show_yes:hover, .b-logo:hover, .avatar__default:hover, .player__preview:hover, .background:hover { transition: 0.4s; -webkit-filter: brightness(1.0) saturate(100%); }


/*Затемняем картинки*/

раскрыть ветку (1)
0
Автор поста оценил этот комментарий

Нет, код не изменился.
Убрать затемнение картинки вы можете всё также в преднастройках стиля на сайте userstyles. Просто у них кнопка преднастроек переехала туда, где должна была быть изначально — вверх.

показать ответы
0
Автор поста оценил этот комментарий

Здравствуйте, опять не могу сделать не затемненные картинки, по этому методу, всегда так делал, но перестало работать, вы еще занимаетесь стилем и не реально сделать 1 кнопку, чтобы убирать затемнение, оно вообще не нужно?

раскрыть ветку (1)
0
Автор поста оценил этот комментарий

Подсветка меняется вполне хорошо и работает стабильно.
Возможность изменять параметры сильно зависит от браузера, к сожалению, разработчики стайлиша не торопятся исправлять эту проблему. Пока это хорошо работает только в хроме и файрфоксе.
По-умолчанию отключать подсветку картинок слишком нецелесообразно. В ночном стиле наименее приятно когда на полностью темном фоне появляется яркая белая картинка.

показать ответы
0
Автор поста оценил этот комментарий

привет, а ты по стилю ютуба шаришь? Black youtube by panos тема, перестала быть черной, да и другие черные перестали, ютуб что ли обновился, сегодня

раскрыть ветку (1)
0
Автор поста оценил этот комментарий

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

показать ответы
0
Автор поста оценил этот комментарий

Благодарю за ответы и стиль)

раскрыть ветку (1)
0
Автор поста оценил этот комментарий

Незачто. Лучшая благодарность — это его использование и фитбек)

показать ответы
0
Автор поста оценил этот комментарий

поставил 13, похоже на норму, когда вы назвали цифру, понял где искать, было 16 по умолчанию

Иллюстрация к комментарию
раскрыть ветку (1)
0
Автор поста оценил этот комментарий

ага, у меня стиль кастомный, не только черный, но в нем можно задавать шрифт, его размер, ширину постов и затемнение картинок, сверху у меня вынесены главные вещи, которые влияют на конкретно выбранный стиль

показать ответы
0
Автор поста оценил этот комментарий

ну я им с самого начала пользовался на 125-150 (лежа) и было нормально, а после бага стало крупно на тех же настройках

раскрыть ветку (1)
0
Автор поста оценил этот комментарий

Это не после бага, это я шрифт увеличил и посты расширил. Сменить можете в Advanced Style Settings
https://userstyles.org/styles/127222/d-ark-pikabu-eye-safe

0
Автор поста оценил этот комментарий

у меня стоит 125% при белом режиме это норм, 150 ставлю когда лежа смотрю ( с вашим стилем так же было до сегодня), монитор 27 дюймов, черный текст при 125% выглядит как 150% белый и если поставить 110 уходит в центр и комменты мелкие становятся, хотел скинуть 2 скрина, но почему-то там выглядит одинаково

Иллюстрация к комментарию
Иллюстрация к комментарию
раскрыть ветку (1)
0
Автор поста оценил этот комментарий

Видимо, я понимаю что-то не так. Визуально всё выглядит полностью идентично, за исключением размера шрифта, возможно у черного просто вы выставили 15 размер, а на белом 16.


Рассчет этого стиля идет на использование 100% разрешения (мыльные картинки в топку, как и иконки, и иже с ними).

Иллюстрация к комментарию
Иллюстрация к комментарию
показать ответы
0
Автор поста оценил этот комментарий

баг с кривыми кнопками починили, а что со шрифтами, огромный текст, если в браузере уменьшить, то на центр пост уезжает, комменты норм, только в постах

раскрыть ветку (1)
0
Автор поста оценил этот комментарий

Можете приложить скриншоты проблемы? У меня просто таких сложностей нет и не встречалось.

Вчера сменил тип стиля по умолчанию, потому что читать мелкий текст 13 размера в узких постах почти невозможно без напряга глаз, поэтому сейчас ширина постов с верхнюю панель с названием поста, а шрифт 16.

показать ответы
0
DELETED
Автор поста оценил этот комментарий

Спасибо, стиль шикарный. Намного лучше оригинала.

раскрыть ветку (1)
0
Автор поста оценил этот комментарий

Пока сделал так, посмотрю как обкатается)

Иллюстрация к комментарию
показать ответы

Темы

Политика

Теги

Популярные авторы

Сообщества

18+

Теги

Популярные авторы

Сообщества

Игры

Теги

Популярные авторы

Сообщества

Юмор

Теги

Популярные авторы

Сообщества

Отношения

Теги

Популярные авторы

Сообщества

Здоровье

Теги

Популярные авторы

Сообщества

Путешествия

Теги

Популярные авторы

Сообщества

Спорт

Теги

Популярные авторы

Сообщества

Хобби

Теги

Популярные авторы

Сообщества

Сервис

Теги

Популярные авторы

Сообщества

Природа

Теги

Популярные авторы

Сообщества

Бизнес

Теги

Популярные авторы

Сообщества

Транспорт

Теги

Популярные авторы

Сообщества

Общение

Теги

Популярные авторы

Сообщества

Юриспруденция

Теги

Популярные авторы

Сообщества

Наука

Теги

Популярные авторы

Сообщества

IT

Теги

Популярные авторы

Сообщества

Животные

Теги

Популярные авторы

Сообщества

Кино и сериалы

Теги

Популярные авторы

Сообщества

Экономика

Теги

Популярные авторы

Сообщества

Кулинария

Теги

Популярные авторы

Сообщества

История

Теги

Популярные авторы

Сообщества

Недвижимость и ремонт

Теги

Популярные авторы

Сообщества