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

Изменение стиля ссылок

Тема в разделе "Модификации шаблонов", создана пользователем SeM13, 01.04.2011.

Загрузка
  1. SeM13

    SeM13 Создатель системы

    Регистрация:
    05.01.11
    Сообщения:
    747
    Симпатии:
    258
    Версия XF:
    1.1.3
    Код:
    a {
      display: inline-block;
      padding: 4px;
      outline: 0;
      color: #3a599d;
      -webkit-transition-duration: 0.25s;
      -moz-transition-duration: 0.25s;
      -o-transition-duration: 0.25s;
      transition-duration: 0.25s;
      -webkit-transition-property: -webkit-transform;
      -moz-transition-property: -moz-transform;
      -o-transition-property: -o-transform;
      transition-property: transform;
      -webkit-transform: scale(1) rotate(0);
      -moz-transform: scale(1) rotate(0);
      -o-transform: scale(1) rotate(0);
      transform: scale(1) rotate(0);
    }
    a:hover {
      background: #3a599d;
      text-decoration: none;
      color: #fff;
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      -o-border-radius: 4px;
      border-radius: 4px;
      -webkit-transform: scale(1.05) rotate(-1deg);
      -moz-transform: scale(1.05) rotate(-1deg);
      -o-transform: scale(1.05) rotate(-1deg);
      transform: scale(1.05) rotate(-1deg);
    }
    a:nth-child(2n):hover {
      -webkit-transform: scale(1.05) rotate(1deg);
      -moz-transform: scale(1.05) rotate(1deg);
      -o-transform: scale(1.05) rotate(1deg);
      transform: scale(1.05) rotate(1deg);
    }
    Была использована функциональность каждого браузера (так как у каждого есть свой собственный префикс.) Продолжительность перехода установлена в 250 миллисекунд, и масштабирование/вращение установлено по умолчанию. Даже ссылки вращаются в различных сторонах, чтобы добавить немного больше стиля!
     
    Averus, RedCobra, arelav и 2 другим нравится это.
  2. Romchik®

    Romchik® The Power of Dreams Команда форума

    Регистрация:
    26.09.10
    Сообщения:
    5 746
    Симпатии:
    5 311
    Версия XF:
    1.5.18
    Я правильно понимаю, что это не вопрос, а скорее обмен опытом?
     
  3. CyberAP

    CyberAP Местный

    Регистрация:
    05.10.10
    Сообщения:
    2 604
    Симпатии:
    1 660
    Версия XF:
    1.5.10
    Это уже готовое решение, я бы сказал.
     
  4. SeM13

    SeM13 Создатель системы

    Регистрация:
    05.01.11
    Сообщения:
    747
    Симпатии:
    258
    Версия XF:
    1.1.3
    Пардон ошибся.
    Да готовое уже.
     
  5. Виталий Смирнов

    Виталий Смирнов Местный

    Регистрация:
    08.04.11
    Сообщения:
    75
    Симпатии:
    8
    а в каком файле это меняется? хочется посмотреть, что получилось
     
  6. SeM13

    SeM13 Создатель системы

    Регистрация:
    05.01.11
    Сообщения:
    747
    Симпатии:
    258
    Версия XF:
    1.1.3
    Можешь в экстра засунуть.
    Вообще, подумай перед тем как пихать, в экстра засунешь применяться ко всем ссылкам что есть на форуме, так что может что то да сломаться. Найди себе нужный шаблон css и впи[ой] туда код.
     
  7. Unrealist

    Unrealist Местный

    Регистрация:
    26.05.11
    Сообщения:
    18
    Симпатии:
    7
    Куда его впихнуть так чтобы только разделы/подразделы и темы имели данную фичу + чтоб разделы которые в столбик на главной форума не искревлялись?
     
    Иван Гончаров нравится это.
  8. SeM13

    SeM13 Создатель системы

    Регистрация:
    05.01.11
    Сообщения:
    747
    Симпатии:
    258
    Версия XF:
    1.1.3
    Куда нибудь с префиксом thead? это предположение. Смотреть в падлу :) Но судя что в ксене можно подойти с логической части, то вообще не проблема.
     
  9. Unrealist

    Unrealist Местный

    Регистрация:
    26.05.11
    Сообщения:
    18
    Симпатии:
    7
    Если вставить в триад то когда заходишь в тему опять-же всё становится под этот стиль
     
  10. Romchik®

    Romchik® The Power of Dreams Команда форума

    Регистрация:
    26.09.10
    Сообщения:
    5 746
    Симпатии:
    5 311
    Версия XF:
    1.5.18
    Вопрос неверный немного. Вставлять код нужно так и так в EXTRA.css. Надо просто сам код немного поменять. Чтобы он не глобально ко всем ссылкам применялся, как в примере из первого сообщения, а только к необходимым классам.
    Для категорий это должно быть так скорей всего:
    Код:
    .nodeList .categoryStrip .nodeTitle a {
      ...
    }
    .nodeList .categoryStrip .nodeTitle a:hover {
      ...
    }
    Для разделов:
    Код:
    .node .nodeTitle a {
      ...
    }
    .node .nodeTitle a:hover {
      ...
    }
    
    Возможно это затронет и подразделы в столбик, тут нужно на конкретном форуме смотреть.

    Кстати, наверно и без правки EXTRA.css можно обойтись, если найти необходимый стиль в настройках стиля и просто там изменить и дописать значения.

    В общем вектор задан - двигайтесь :)
     
    SeM13 нравится это.
  11. Unrealist

    Unrealist Местный

    Регистрация:
    26.05.11
    Сообщения:
    18
    Симпатии:
    7
    Спасибо разобрался решение:
    Вставить в конец Extra.css
    Спасибо
    Romchik®

    за помощь
    Код:
    .node .nodeTitle a {
      display: inline-block;
      padding: 4px;
      outline: 0;
      color: #3a599d;
      -webkit-transition-duration: 0.25s;
      -moz-transition-duration: 0.25s;
      -o-transition-duration: 0.25s;
      transition-duration: 0.25s;
      -webkit-transition-property: -webkit-transform;
      -moz-transition-property: -moz-transform;
      -o-transition-property: -o-transform;
      transition-property: transform;
      -webkit-transform: scale(1) rotate(0);
      -moz-transform: scale(1) rotate(0);
      -o-transform: scale(1) rotate(0);
      transform: scale(1) rotate(0);
    }
    .node .nodeTitle a:hover {
      background: #3a599d;
      text-decoration: none;
      color: #fff;
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      -o-border-radius: 4px;
      border-radius: 4px;
      -webkit-transform: scale(1.05) rotate(-1deg);
      -moz-transform: scale(1.05) rotate(-1deg);
      -o-transform: scale(1.05) rotate(-1deg);
      transform: scale(1.05) rotate(-1deg);
    }
    a:nth-child(2n):hover {
      -webkit-transform: scale(1.05) rotate(1deg);
      -moz-transform: scale(1.05) rotate(1deg);
      -o-transform: scale(1.05) rotate(1deg);
      transform: scale(1.05) rotate(1deg);
    }
     
    Logan22, Lex, RedCobra и 2 другим нравится это.
  12. RedCobra

    RedCobra Read only

    Регистрация:
    09.12.11
    Сообщения:
    74
    Симпатии:
    2
    Версия XF:
    1.1.3
    Спасибо хорошая вещь)
     
  13. KakBeOlolo

    KakBeOlolo Местный

    Регистрация:
    08.10.11
    Сообщения:
    510
    Симпатии:
    93
    Версия XF:
    1.1.2
    Помойму из-за этого у меня перестал работать ТайгаЧат, что делать?

    При удалении кода, чат все равно не работает (нельзя отправить сообщение и нет написанных ранее сообщений).

    Чат переустанавливал, права проверял
     
  14. RedCobra

    RedCobra Read only

    Регистрация:
    09.12.11
    Сообщения:
    74
    Симпатии:
    2
    Версия XF:
    1.1.3
    да при этом дополнении тига чат кривой.
    но мне как бы он и не нужен. :)
     
  15. KakBeOlolo

    KakBeOlolo Местный

    Регистрация:
    08.10.11
    Сообщения:
    510
    Симпатии:
    93
    Версия XF:
    1.1.2
    Только в чем проблема, после удаления кода из екстра.ксс он не начинает работать :cry:
     

Поделиться этой страницей