Как сделать share кнопки Яндекса классными ?

20.9.2017 - 4126 просмотров ;)

Все знают что share.yandex.ru кнопки имеют 2 унылых размера, мелкие и еще мельче.

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

Для такого хака иконок от Яндекс нужно всего лишь подключить в свой код дополнительный стиль:

.ya-share2__container_size_m .ya-share2__icon { width: 3vw; height: 3vw; }

Данный стиль воткнуть в самый конец HTML и наслаждаться видом:

Красотень !

 

А вот как резиново все растягивается:

 

Если кнопки со счетчиками, то смотрится все не менее круто:

Но если кнопки с лайками будут очень большими, тогда цифры будут казаться мелкими, и это мы сейчас исправим, добавьте строчку с CSS правило:

.ya-share2__container_size_m .ya-share2__counter { font-size: 2vw !important ; line-height: 3vw !important; }

Итоговый код:

 .ya-share2__container_size_m .ya-share2__icon { width: 6vw; height: 6vw; }
 .ya-share2__container_size_m .ya-share2__counter { font-size: 2vw !important ; line-height: 3vw !important; }

 

Тогда кнопки будут выглядеть вот так:

 

Что за единица измерения vw ?

 

Статьи из раздела, Видеочат рулетка