![[ VKontakte Optimizer ]](http://vkopt.net/forum/images/vkopt/misc/logo.gif){kind=logo}
|
Забыли пароль? Регистрация |
Форум
О проекте
|
|
|
|
|
 |
Опытный
О пользователе
Сообщений: 2,037
ВкоптоКарма: 1,352
|
Небольшие CSS-твики
Мелочи, которые вряд ли будут полезны большинству, но кое-кому может и пригодятся
 Инструкция по установке CSS-твиков:
Не обрезать миниатюры фотографий на профилях и в группах
Миниатюры фотографий на профилях и в группах немного обрезаются, если они слишком большие по высоте. Этот твик исправит это.  Код:
/* Не обрезать миниатюры фотографий на профилях и в группах */
#profile_photos .photos a, #group_photos .group_photos_table a {
height: auto !important;
}
Скрыть кнопку, разворачивающую меню в группах
Скрывает кнопку раскрытия меню в группах.  Актуально, только если во ВкОпте используется функция "Автоматически разворачивать новости в группах (меню группы)". Код:
/* Скрыть кнопку, разворачивающую меню в группах */
.group_wiki_hider {
display: none !important;
}
Скрыть лог VKopt'a у alpha и beta версий
Скрывает лог VKopt'a у alpha и beta версий.  Однако использовать это не рекомендуется, ибо в случае ошибок не получится прибегнуть к логу и сообщить всю информацию об ошибке. Код:
/* Скрыть лог VKopt'a у alpha и beta версий */
#vkDebug {
display: none !important;
}
Скрыть предложение заполнить информацию о профиле
Скрывает блок под аватаркой вашего профиля, предлагающий заполнить информацию о себе.  Код:
/* Скрыть предложение заполнить информацию о профиле */
.profile_rate_warning {
display: none !important;
}
Убрать кнопку 'Показать/скрыть подробную информацию'
Убирает кнопку показа/скрытия подробной информации о пользователе.  Актуально, если вы используете во ВкОпте функцию "Всегда разворачивать информацию о пользователе". Код:
/* Убрать кнопку 'Показать/скрыть подробную информацию' */
#profile_full_link, #profile_info_link {
display: none !important;
}
Сделать менее приметной табличку об изменении номера
Немного уменьшает табличку, которая появляется в шапке сайта при изменении номера мобильного телефона.  Код:
/* Сделать менее приметной табличку об изменении номера */
.top_info_bar .info {
padding: 0px !important;
}
.top_info_bar {
opacity: 0.4 !important;
}
Отображать пункт [VKopt] в виде иконки в левом верхнем углу
Убирает пункт [VKopt] из левого меню и ставит его слева вверху в виде иконки.  Известные недоработки:
Код:
/* Отображать пункт [VKopt] в виде иконки в левом верхнем углу */
#frOpt{
position: fixed !important;
left: 20px !important;
top: 4px !important;
}
#side_bar #frOpt ul {
margin-left: 20px !important;
}
#side_bar #frOpt>a {
font-size: 0px;
background-image: url("http://vkopt.net/download/favicon.ico") !important;
width: 8px !important;
height: 8px !important;
}
.moreDiv {
display: none !important;
}
Не группировать последовательные сообщения в диалогах
Диалоги перестают группировать подряд идущие сообщения от одного пользователя.  Код:
/* Не группировать последовательные сообщения в диалогах */
#im_rows .im_add_row .im_log_author a, #im_rows .im_add_row .im_log_date span, #im_rows .im_add_row .im_log_date a.im_date_link, #im_rows .im_add_row .im_log_author_chat_thumb, #im_rows .im_add_row .im_log_author_chat_name {
display: block !important;
}
Надписи Online зелёного цвета
Заменяет все индикаторы активности пользователя на сайте на аналогичные, но зелёные.   Код:
/* Надписи Online зелёного цвета */
#title .fl_r, .online, .im_status_holder, .fave_online, .im_chatbox_mem_online, .mail_envelope_online, .dialogs_online, .bp_online {
color: #008000 !important
}
.vk_profile_online_status {
color: #42ee42 !important;
}
.fc_tab_online .fc_tab_online_icon, .fc_contact .fc_contact_status, .fc_clist_online_wrap .fc_clist_online {
background-image: url("http://s019.radikal.ru/i633/1211/a1/35499922ad03.png") !important;
}
.mob_onl, b.im_friend_mob_onl, b.dialogs_mob_onl {background-image: url("http://s52.radikal.ru/i136/1211/47/49d498354a71.png") !important;}
.im_status_online {
background-color: #008000 !important;
}
Так же для достижения такого эффекта в диалогах:  удалите последние три строчки в коде выше и вставьте этот листинг: Код:
.im_status_online {
box-shadow:0px 0px 5px 2px #00ff00 !important;
background-color: #00ff04 !important;
border-color: #00ff00 !important;
width: 1px !important;
height: 1px !important;
}
Вернуть заголовкам профилей, страниц групп и публичных страниц старый бледно-жёлтый цвет
Делает верхушку страницы похожей на старую, которая использовалась в интерфейсе ВКонтакте 2009 года. Возможны три варианта: 1. Простой цвет  Код:
/* Вернуть заголовкам профилей, страниц групп и публичных страниц старый бледно-жёлтый цвет [1] */
#header {
background-color: #f0e8ba !important;
}
 Код:
/* Вернуть заголовкам профилей, страниц групп и публичных страниц старый бледно-жёлтый цвет [2] */
#header {
background-image: url("http://savepic.org/1811154.jpg") !important;
padding-top: 12px !important;
}
3. Самый качественный вариант  Код:
/* Вернуть заголовкам профилей, страниц групп и публичных страниц старый бледно-жёлтый цвет [3] */
#header_wrap1 {
border: solid #F3F3F3 !important;
border-image: initial !important;
border-width: 0px 1px !important;
}
#header {
position: relative !important;
font-weight: bold !important;
font-size: 11px !important;
padding: 4px 10px !important;
background: #F2EAB8 url(http://vkontakte.ru/images/headeryell.gif) top left repeat-x !important;
color: black !important;
border: 1px solid #D1C992 !important;
border-image: initial !important;
}
#header h1 {
margin: 0px !important;
font-size: 11px !important;
overflow: hidden !important;
}
Использовать несколько сразу - не следует. Замена иконкой таблички о вашем текущем Online статусе
Заменяет табличку о вашем текущем онлайн статусе иконкой.    Цвет иконки символизирует текущий статус (Зелёный - Online, Красный - Offline, Жёлтый - Неопределено) Код:
/* Замена иконкой таблички о вашем текущем Online статусе */
div.vkUOnline, div.vkUOffline, div.vkUUndef {
content: none !important;
color: transparent !important;
border: none !important;
background: none !important;
width: 26px !important;
height: 26px !important;
margin-left: 4px !important;
margin-bottom: -4px !important;
opacity: 0.7 !important;
background-repeat: no-repeat !important;
}
div.vkUOnline {
background-image: url("http://ipic.su/img/img3/fs/online.1325960317.png") !important;
}
div.vkUOffline {
background-image: url("http://ipic.su/img/img3/fs/offline.1325960265.png") !important;
}
div.vkUUndef {
background-image: url("http://ipic.su/img/img3/fs/undefined.1325960364.png") !important;
}
Сердечки красного цвета
Делает все сердечки из системы "Мне нравится" красными.   Код:
/* Сердечки красного цвета */
.like_wrap div, #pv_like_icon, #mv_like_icon, .post_like_icon, .fw_like_icon, .like_wrap i {
background-image: url("http://savepic.net/1410876.gif") !important;
}
.post_like_link, span.like_link, #mv_like_wrap .fl_l, #pv_like_wrap .fl_l, .fw_like_link {
color: rgba(255, 0, 0, 0.7) !important;
}
.post_like_count, .like_count, #mv_like_count, #pv_like_count, .fw_like_count {
color: rgba(255, 0, 0, 0.9) !important;
font-weight: bold !important;
}
.post_like:hover {
background-color: rgba(255, 0, 0, 0.1) !important;
}
.pvs_hh_fg {
background-image: url("http://ipic.su/img/img3/fs/post_hh.1325808053.png") !important;
}
Скрыть надпись 'Мне нравится', скруглить края рамки лайка и сделать сердечко менее заметным
Убирает надпись "Мне нравится" у лайков, оставляя только сердечко и счётчиков лайков, скругляет края рамки у лайков к постам и делает сердечко менее заметным, когда на нём нет наведения указателя мыши.  Код:
/* Скрыть надпись 'Мне нравится', скруглить края рамки лайка и сделать сердечко менее заметным */
div.post_like_wrap {
opacity: 0.4 !important;
}
div.post_like_wrap:hover {
opacity: 1 !important;
}
.post_like {
border-radius: 5px !important;
-o-border-radius: 5px !important;
-moz-border-radius: 5px !important;
-webkit-border-radius: 5px !important;
}
span.post_like_link, .like_link, #pv_like_wrap span.fl_l:first-child, #mv_like_wrap span.fl_l:first-child {
display: none !important;
}
Скрыть надпись 'Мне не нравится', скруглить края рамки дислайка и сделать менее заметным
Код:
/* Дизлайк 1 апреля 2013 */
.post_dislike {
border-radius: 5px !important;
-o-border-radius: 5px !important;
-moz-border-radius: 5px !important;
-webkit-border-radius: 5px !important;
}
span.dislike_link, span.post_dislike_link, span.fw_dislike_link, #pv_dislike_wrap span.fl_l:first-child, #mv_dislike_wrap span.fl_l:first-child {
display: none !important;
}
Замена фона в темах
Замена фона в темах. (обычно этот код должен работать. точно работает на скинах Opera System и Bubbles) Код:
html body{ background:url("http://cs10787.userapi.com/u13391307/137964159/w_f7b25ecf.jpg") fixed no-repeat 50% 50% !important; background-size:cover !important;}
Код:
html body, #page_wrap{ background:url("http://cs10787.userapi.com/u13391307/137964159/w_f7b25ecf.jpg") fixed no-repeat 50% 50% !important;background-size:cover !important;}
Расширенная фильтрация новостей
Возможно создание своих правил фильтрации с помощью CSS-твиков. Для работы созданного твика в вкопте должна быть активна основная галка фильтра, и сняты галки со всех пунктов фильтрации.  Подробности: класс .vk_feed_filter добавляется ко всем постам до кторых дотянулся скрипт. так же вместе с ним могут быть добавлены классы: .vk_feed_photo .vk_feed_video .vk_feed_audio .vk_feed_graff .vk_feed_poll .vk_feed_note .vk_feed_text .vk_feed_links .vk_feed_group .vk_feed_friend .vk_feed_repost например чтобы скрыть всё и показать те, где есть аудио, нужен такой код: Код:
.vk_feed_filter{display:none !important}
.vk_feed_filter.vk_feed_audio{display : block !important} /*классы пробелами не разделять. они все разом к одному элементу приписаны*/
Изменение высоты контакт-листа
Устанавливает указанную высоту для черного окошка со списком друзей.  Код:
/* Изменение высоты контакт-листа с онлайн пользователями */
#fc_contacts {
height: 252px !important
}
Белый/Тёмный фон и увеличение окна выбора смайлов Изменение названий пунктов в левом меню Изменение шрифта сайта Увеличить размер миниатюр в списке документов Перенос списка открытых вкладок диалогов вправо Мини-чат с закосом под metro Знаете что-то сами: пишите. Я так же буду рыться и искать P.S. Инструкция по установке CSS-кодов
Последний раз редактировалось vladsima; 14.07.2013 в 23:12. Причина: up |
|
Оффлайн
|
|
)
| 42 пользователя(ей) сказали cпасибо: | 3dmax, alex464, alexxsim, ArckTick, Cramer, Dalek, denisska, Dr_Den, evg, evgeniy.trifonov, FaNaTuK, hasta2010, JohnTR, KiberПсих, Mangust732, MAV, Mr.Smit, Nickolia46, Pasha_49, PoherFace, psih2.2.8, Reliance, Reydan-46, saniel, Sintezmaniac, SmowiN, tery, vall_gorr, ves_nik, VitaliyShayko, Vostan1, Wirmis, yurok, Андрей Белявский, Ареопагит, Вэлл, Гавр, Даниил Хохряков, Дмитрій Лисак, Женя Плеханов, Минор, Петян |
|
Мимо проходил, заглянул)
О пользователе
Сообщений: 3
ВкоптоКарма: 0
|
Можно ли убрать эту кнопочку в контакт-листе ?
|
|
Оффлайн
|
|
Опытный
О пользователе
Сообщений: 169
ВкоптоКарма: 94
|
Цитата:
Код:
.fc_tab_close_wrap.fl_r { display: none !important; }
|
|
|
Оффлайн
|
|
|
Опытный
О пользователе
Сообщений: 169
ВкоптоКарма: 94
|
Цитата:
Код:
#rb_box_fc_clist > .fc_tab_wrap > .fc_tab_head > .fc_tab_close_wrap.fl_r {display:none !important; visibility:hidden !important; height:0px !important;}
|
|
|
Оффлайн
|
|
Знаток
О пользователе
Сообщений: 59
ВкоптоКарма: 22
|
Ребят, отредактируйте этот код так, чтоб аватарки стали полностью круглыми, пожалуйста.
Код:
/* Небольшое закругление всех аватарок */
.im_photo_holder a img, .dialogs_photo a img, td.image a img, img.reply_image, a.fw_post_thumb img, a.fw_reply_thumb img, a.ava img, div.fl_l.pv_thumb a img, div.gift_thumb a img, .mv_thumb a img, img.apps_wide_img, .mail_photo a img, div.people_cell a img, div.event_block a img, img.feedback_row_photo, a.bp_thumb img, .wdd_imgs img, .post_image img, .bd_day_events a img, img.reply_form_image {
border-radius: 3px !important;
-o-border-radius: 3px !important;
-moz-border-radius: 3px !important;
-webkit-border-radius: 3px !important;
}
img.im_log_author_chat_thumb, .common_friends a img, img.published_by_photo, div.fl_l.thumb a img, img.feed_post_field_photo, div.fave_link_image img, .fc_msgs_wrap a.fc_msgs_author img.fc_msgs_author, table.like_stats a img, img.feedback_group_photo, img.blst_img, .published_by_photo img, .im_friend img, table.flist_cell td.flist_item_img img, img.settings_bl_photo {
border-radius: 2px !important;
-o-border-radius: 2px !important;
-moz-border-radius: 2px !important;
-webkit-border-radius: 2px !important;
}
div.user_block a img, div.fl_l.group_row_photo a img, div.mail_envelope_photo a img, a.fave_user_image img, a.fave_face img, div.feed_friend_image a img, div.photo .bg_img img {
border-radius: 4px !important;
-o-border-radius: 4px !important;
-moz-border-radius: 4px !important;
-webkit-border-radius: 4px !important;
}
#profile_avatar img, #group_avatar img, .content a img {
border-radius: 5px !important;
-o-border-radius: 5px !important;
-moz-border-radius: 5px !important;
-webkit-border-radius: 5px !important;
}
div.fave_face_name {
border-bottom-left-radius: 4px !important;
-o-border-bottom-left-radius: 4px !important;
-moz-border-bottom-left-radius: 4px !important;
-webkit-border-bottom-left-radius: 4px !important;
border-bottom-right-radius: 4px !important;
-o-border-bottom-right-radius: 4px !important;
-moz-border-bottom-right-radius: 4px !important;
-webkit-border-bottom-right-radius: 4px !important;
}
|
|
Оффлайн
|
|
Мимо проходил, заглянул)
О пользователе
Сообщений: 3
ВкоптоКарма: 0
|
как мне посредством css заменить иконку скачивания на текст "[ Скачать ]" и чтоб этот текст показывался лишь только тогда когда я наведу указатель на время(длительность) трека?
P.S. Фишечка Поставить галочку вервификации в вк на свою стр. Открыть vk_page.js и воткнуть код в функцию vkProfilePage() Код:
html='<a href="/verify" id="HackVerefy" class="page_verified" onmouseover="pageVerifiedTip(this, {mid: '+cur.oid+'})"></a>';
if (cur.oid==remixmid()){
if( !ge('HackVerefy') ){
ge('title').appendChild(vkCe('c',{},html));
}
}
|
|
Оффлайн
|
|
|
Мимо проходил, заглянул)
О пользователе
Сообщений: 3
ВкоптоКарма: 0
|
Доброго времени суток
Помогите сделать так, когда открываешь диалог в контакт листе, НЕ нужно было разфиксировать мини-чат) Удобней будет и практичней. Пмогите.. второй день роюсь в коде, не могу понять в чем дело.    зы. что б убрать булавочку с мини-чата вот Код:
.fc_tab_pin { display: none !important; }
|
|
Оффлайн
|
|
 |
Нижняя навигация
|
||||||
|
||||||
| Метки |
| css, твики |
| Здесь присутствуют: 6 (пользователей: 0 , гостей: 6) | |
| Опции темы | |
| Опции просмотра | |
Линейный вид
|
|
Часовой пояс GMT +4, время: 21:41.