Font Awesome иконки для виджета "Статистика форума" 2

[Mirovinger]

Mirovinger добавил(а) новый ресурс:

Font Awesome иконки для виджета "Статистика форума" 2 - Font Awesome иконки для виджета "Статистика форума"

Добавим всё тоже, как здесь - Font Awesome иконки для виджета "Статистика форума", только средствами css.
Добавляем шаблон extra.less.

.p-body-sidebar {
    [data-widget-definition="forum_statistics"] .pairs {...

Узнать больше об этом ресурсе...

 

[Dead Master]

последние две скобки

  }
}

стаскивают ник пользователя


без них кажет все как надо, но пропадают иконки

 

[Mirovinger]

Извините конечно, Вам дать почитать про синтаксис less?
Что бы Вы поняли, что сломали и пытаетесь делать?
Как Вы выразились, стаскивают не скобки, а иконка, так как удлиняется строка, и длинная ника большая.

Специально для Вас, будет подрезан ник.

.p-body-sidebar {
    [data-widget-definition="forum_statistics"] .pairs {

        dt:before {
          font-family: FontAwesome;
          padding-right: 2px;
        }

        &:nth-child(1) dt:before {
          content: "\f07c";
        }

        &:nth-child(2) dt:before {
          content: "\f0e0";
        }

        &:nth-child(3) dt:before {
          content: "\f0c0";
        }

        &:nth-child(4) dt:before {
          content: "\f2bd";
        }
       
        .username {
          display: inline-block;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          width: 50px;
        }
    }
}

 

[Hope]

Ни иконки, и ничего такого, ник съедет на новую строку даже без иконок, если он будет длинным.

 

[Mirovinger]

Да, я скрин хотел приложить, но не стал, просто в приведённом выше случае, ломает иконка, а так да, при очень большом нике, это и так сломается.

 

[Dead Master]

Специально для Вас, будет подрезан ник.

спс конечно, но оно мне как то без надобности, у меня этого не стоит, и я не особо грежу всеми этими иконками
просто поставил, для теста, увидел, написал спросил, ответ получил, на ус намотал :)

 

[GrungeS]

а можно сделать с одними иконками без текста?

 

[Skaiman]

а можно сделать с одними иконками без текста?

Сделать модификацию и заменить фразы на иконки, по моему здесь уже писали об этом.

 

[Mirovinger]

Mirovinger обновил(а) ресурс Font Awesome иконки для виджета "Статистика форума" 2 новой записью:

Only FA-icon

Код обновлён, добавлен вариант только с FA-иконками.

Узнать больше об этом обновлении...

 

[root]

Font Awesome 5. Первый вариант:

.p-body-sidebar {
    [data-widget-definition="forum_statistics"] .pairs {

        dt:before {
          font-family: 'Font Awesome 5 Pro';
          padding-right: 2px;
        }

        &:nth-child(1) dt:before {
          content: "\f07c";
        }

        &:nth-child(2) dt:before {
          content: "\f0e0";
        }

        &:nth-child(3) dt:before {
          content: "\f0c0";
        }

        &:nth-child(4) dt:before {
          content: "\f2bd";
        }
    }
}

Второй вариант:

.p-body-sidebar {
    [data-widget-definition="forum_statistics"] .pairs {

        dt {
            text-indent: -9999px;
            position: relative;

            &:before {
                font-family: 'Font Awesome 5 Pro';
                position: absolute;
                text-indent: 0;
                left: 2px;
            }
        }

        &:nth-child(1) dt:before {
            content: "\f07c";
        }

        &:nth-child(2) dt:before {
            content: "\f0e0";
        }

        &:nth-child(3) dt:before {
            content: "\f0c0";
        }

        &:nth-child(4) dt:before {
            content: "\f2bd";
        }
    }
}

 

[Mirovinger]

Mirovinger обновил(а) ресурс Font Awesome иконки для виджета "Статистика форума" 2 новой записью:

XF2.1.x + FA5

• Совместимость с XenForo 2.1.x
• Рефакторинг

Узнать больше об этом обновлении...

 

[Jimo]

У меня на 2.1.5 не работает это, правда статистику форума я вниз опустил к подвалу.

 

[Skaiman]

.p-body-sidebar

 

[DioFix]

У меня на 2.1.5 не работает это, правда статистику форума я вниз опустил к подвалу.

Все работает проверь на дефолтном стиле)

 

[West14]

bcode, а теперь читаем внимательно вопрос и видим уточнение.

правда статистику форума я вниз опустил к подвалу.

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

 

[Jimo]

Тут еще не понятно, в модификации шаблона есть 2 вкладки под код, найти и заменить. Так вот изначально в шаблоне extra.less нет никакого кода.

 

[West14]

Jimo, не нужно экстру модифицировать, прямо в неё вставляйте.

 

[Skaiman]

Jimo, где там про модификацию написано, там код для версии 2.0 и 2.1, просто добавить в extra.less

[data-widget-definition="forum_statistics"] .pairs {

    dt:before {
        .m-faBase();
        padding-right: 2px;
    }

    &:nth-child(1) dt {
        .m-faBefore("\f07c");
    }

    &:nth-child(2) dt {
        .m-faBefore("\f0e0");
    }

    &:nth-child(3) dt {
        .m-faBefore("\f0c0");
    }

    &:nth-child(4) dt {
        .m-faBefore("\f2bd");
    }
}

 

[Jimo]

bcode, а теперь читаем внимательно вопрос и видим уточнение.

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

Не, ты наверно не правильно понял. Вот сейчас скрином покажу:

 

[Skaiman]

Не, ты наверно не правильно понял.

Так то тебя сложно понять :)