Современный облачный хостинг провайдер | Aéza
Контакты ООО "АЕЗА ГРУПП" ИНН 2312304914 ОГРН 1212300056430
Добавление иконок Font Awesome в меню пользователя

Добавление иконок Font Awesome в меню пользователя

Обзор Обсуждение
Точно всё делали?
В extra.less.
Less: 
.menu--account {
    .menu-footer {
        display: none;
    }
}

hide_menu.png
Хотя в данном случае, лучше модификацией бы, но думаю у Вас и так нормально будет, учитывая пользователей.
 
  • Мне нравится
Реакции: Hope
Mirovinger, Здесь менять?(это единственное, что я увидел, что может по коду подойти)

Код: 
 /* Скрыть в хедере надписи и оставить только значки: оповещение, поиск, переписка */
.p-navgroup {
    &-linkText {
        --alerts &, // оповещение
        --search &, // поиск
        --conversations & // переписка
        {
            .p-navgroup-link& {
                display: none; 
            }
        }
    }
    &.p-discovery {
        margin: 0;  // отступ поиска
    }
}
 
Последнее редактирование:
s7ranger, в самый самый низ добавил, пишет ошибку(
 
Информативно! Спасибо за информацию.
 
Hope, ок, информативные спрошу.) в какой раздел нужно добавить этот код, который порекомендовал администратор?

Код: 
 .menu--account {
    .menu-footer {
        display: none;
    }
}
Безымянный1.jpg2.png3.png4.pngБезымянный5.jpgБезымянный6.jpgБезымянный7.jpg
 
Просто ошибки быть не может, я дал простой код, а вот на содержимое из шаблона, можно посмотреть, под спойлер опубликуйте.
 
CSMNT написал(а):
Captain, заходил и туда,там не нашел тоже. Полазил, менял значение, где думал, что оно и менял там, где не нужно. Но, к сожалению, проблема не решилась.
Нажмите для раскрытия...
Отправьте ссылку на Ваш форум, отправлю Вам less-код.
 
CSMNT написал(а):
в самый самый низ добавил, пишет ошибку(
Нажмите для раскрытия...
Если добавляете правильно и при этом получаете ошибку, то скорее всего какой-то конфликт с другим кодом в extra.less. Покажите хотя бы скриншотом как и куда вы добавили этот код и какую ошибку получаете. Или как Вам написал Mirovinger, дайте полный код своего шаблона extra.less (только уберите его под спойлер).
 
Inspires написал(а):
Отправьте ссылку на Ваш форум, отправлю Вам less-код.
Нажмите для раскрытия...
Да Вы что, а вот почитать тему, что уже ответ дан, как бы нет желания?
Mirovinger написал(а):
Точно всё делали?
В extra.less.
Less: 
.menu--account {
    .menu-footer {
        display: none;
    }
}

Посмотреть вложение 86836
Хотя в данном случае, лучше модификацией бы, но думаю у Вас и так нормально будет, учитывая пользователей.
Нажмите для раскрытия...
 
s7ranger, ошибки нет уже, я за фигурную скобку просто ставил, я просто не знаю, в какой раздел вставить. В шаблоне extra_less нет вообще ничего по поводу меню пользователя( ну я не нашел). в шаблоне account_visitor_menu , где я добавлял иконки, там что-то есть похожее, но там такой код, что сложно понять, что куда добавлять и менять

Mirovinger, я не спорю, что ответ дан) Спасибо огромное, но вот куда прилепить кусок кода этого в extra _less. Я немного выше описал, что в этом шаблоне я не нашел ничего связаного с меню пользователя. Даже скрины все предоставил с комментариями.
 
Последнее редактирование модератором:
Mirovinger, Вот код.
Код: 
/* Иконки входа и регистрации */
.p-navgroup-link.p-navgroup-link--textual.p-navgroup-link--logIn:before {
    font-family: FontAwesome;
    content: "\f090";
    color: #E6BB5C;
    padding-right: 5px;
}
.p-navgroup-link.p-navgroup-link--textual.p-navgroup-link--register:before {
    font-family: FontAwesome;
    content: "\f084";
    color: #E6BB5C;
    padding-right: 5px;
}
/**********/


/* Вывод списка форумов в 3 столбика */
.node .node-subNodeFlatList li {
  float: left;
  margin: 2px 10 2px 10%;
  width: 70%;
}


/*  Иконку раздела и блока с последним сообщение на уровне заголовка раздела */
.node-body {
    .node-icon,
    .node-extra {
      vertical-align:  top;
    }  
}




/*  Иконки для виджета статистики форума */
.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";
        }
    }
}




/* Разделительная линия между закрепленными и обычными темами */
.structItemContainer-group--sticky {
    border-bottom: 6px solid;
    color: xf-diminish(@xf-borderColor, 6%);
}


/* Font Awesome иконки для Action Bar  */
.actionBar-action--edit:before, .actionBar-action--report:before, .actionBar-action--ip:before, .actionBar-action--delete:before, .actionBar-action--spam:before, .actionBar-action--warn:before, .actionBar-action--history:before
{
display: inline-block;
font-family: FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
margin-right: 5px;
}
.actionBar-action--edit:before
{
content: "\f040";
}
.actionBar-action--report:before
{
content: "\f071";
}
.actionBar-action--ip:before
{
content: "\f002";
}
.actionBar-action--delete:before
{
content: "\f00d";
}
.actionBar-action--spam:before
{
content: "\f024";
}
.actionBar-action--warn:before
{
content: "\f12a";
}
.actionBar-action--history:before
{
content: "\f1da";
}




/* Добавление иконок Font Awesome в меню настроек пользователя   */
[data-template^="account_"] {
    .p-body-sideNav {
        [class^="block"]:before {
          display: inline-block;
          font-family: FontAwesome;
          margin-right: 1px;
        }
      
        h3[class^="block"]:before {
          content: "\f0da";
        }
      
        [class^="block"] {
      
            &[href^="/members/"]:before {
              content: "\f007";
            }
          
            &[href$="/alerts"]:before {
              content: "\f0f3";
            }
          
            &[href$="/likes"]:before {
              content: "\f004";
            }
          
            &[href$="/account-details"]:before {
              content: "\f007";
            }
          
            &[href$="/security"]:before {
              content: "\f084";
            }
          
            &[href$="/privacy"]:before {
              content: "\f023";
            }
          
            &[href$="/preferences"]:before {
              content: "\f085";
            }
          
            &[href$="/signature"]:before {
              content: "\f040";
            }
          
            &[href$="/connected-accounts/"]:before {
              content: "\f0c0";
            }
          
            &[href$="/following"]:before {
              content: "\f234";
            }
          
            &[href$="/ignored"]:before {
              content: "\f235";
            }
          
            &[href^="/logout/"]:before {
              content: "\f08b";
            }
        }
    }
}



/* Скрыть в хедере надписи и оставить только значки: оповещение, поиск, переписка */
.p-navgroup {
    &-linkText {
        --alerts &, // оповещение
        --search &, // поиск
        --conversations & // переписка
        {
            .p-navgroup-link& {
                display: none; 
            }
        }
    }
    &.p-discovery {
        margin: 0;  // отступ поиска
    }
}

/*Раскрашеваем иконки */
.block.block--category.block--category3 .block-header {
    background: #009ACF;
    color: #ffffff;
}

.block.block--category.block--category15 .block-header {
    background: #009ACF;
    color:  #ffffff;
}

.block.block--category.block--category53 .block-header {
    background: #009ACF;
    color: #ffffff;
}

.block.block--category.block--category60 .block-header {
    background: #009ACF;
    color: #ffffff;
}


/* Добавление иконок в постбит сообщения */
.message-userExtras {
    .pairs {

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

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

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

        &:nth-child(3) dt:before {
            content: "\f091";
        }
         &:nth-child(4) dt:before {
            content: "\f279";
        }
    }
}
 
Вроде всё нормально.
Less: 
/* Иконки входа и регистрации */
.p-navgroup-link {
    &:before {
        font-family: FontAwesome;
        color: #E6BB5C;
        padding-right: 5px;
    }

    &.p-navgroup-link--logIn:before {
        content: "\f090";
    }

    &.p-navgroup-link--register:before {
        content: "\f084";
    }
}
/**********/

/* Вывод списка форумов в 3 столбика */
.node .node-subNodeFlatList li {
    float: left;
    margin: 2px 10 2px 10%;
    width: 70%;
}


/*  Иконку раздела и блока с последним сообщение на уровне заголовка раздела */
.node-body {
    .node-icon,
    .node-extra {
        vertical-align:  top;
    } 
}

/*  Иконки для виджета статистики форума */
.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";
        }
    }
}




/* Разделительная линия между закрепленными и обычными темами */
.structItemContainer-group--sticky {
    border-bottom: 6px solid;
    color: xf-diminish(@xf-borderColor, 6%);
}


/* Font Awesome иконки для Action Bar  */
.actionBar-action {
    &:before {
        display: inline-block;
        font-family: FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        margin-right: 5px;
    }
    &--edit:before
        {
            content: "\f040";
            }
        &--report:before
        {
            content: "\f071";
            }
        &--ip:before
        {
            content: "\f002";
            }
        &--delete:before
        {
            content: "\f00d";
            }
        &--spam:before
        {
            content: "\f024";
            }
        &--warn:before
        {
            content: "\f12a";
            }
        &--history:before
        {
            content: "\f1da";
            }
}




/* Добавление иконок Font Awesome в меню настроек пользователя   */
[data-template^="account_"] {
    .p-body-sideNav {
        [class^="block"]:before {
            display: inline-block;
            font-family: FontAwesome;
            margin-right: 1px;
        }

        h3[class^="block"]:before {
            content: "\f0da";
        }

        [class^="block"] {

            &[href^="/members/"]:before {
                content: "\f007";
            }

            &[href$="/alerts"]:before {
                content: "\f0f3";
            }

            &[href$="/likes"]:before {
                content: "\f004";
            }

            &[href$="/account-details"]:before {
                content: "\f007";
            }

            &[href$="/security"]:before {
                content: "\f084";
            }

            &[href$="/privacy"]:before {
                content: "\f023";
            }

            &[href$="/preferences"]:before {
                content: "\f085";
            }

            &[href$="/signature"]:before {
                content: "\f040";
            }

            &[href$="/connected-accounts/"]:before {
                content: "\f0c0";
            }

            &[href$="/following"]:before {
                content: "\f234";
            }

            &[href$="/ignored"]:before {
                content: "\f235";
            }

            &[href^="/logout/"]:before {
                content: "\f08b";
            }
        }
    }
}



/* Скрыть в хедере надписи и оставить только значки: оповещение, поиск, переписка */
.p-navgroup {
    &-linkText {
        --alerts &, // оповещение
        --search &, // поиск
        --conversations & // переписка
        {
            .p-navgroup-link& {
                display: none;
            }
        }
    }
    &.p-discovery {
        margin: 0;  // отступ поиска
    }
}

/*Раскрашеваем иконки */
.block.block--category.block--category3 .block-header {
    background: #009ACF;
    color: #ffffff;
}

.block.block--category.block--category15 .block-header {
    background: #009ACF;
    color:  #ffffff;
}

.block.block--category.block--category53 .block-header {
    background: #009ACF;
    color: #ffffff;
}

.block.block--category.block--category60 .block-header {
    background: #009ACF;
    color: #ffffff;
}


/* Добавление иконок в постбит сообщения */
.message-userExtras {
    .pairs {

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

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

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

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

/* ================== */
.menu--account {
    .menu-footer {
        display: none;
    }
}
 
  • Мне нравится
Реакции: Hope
%D0%91%D0%B5%D0%B7%D1%8B%D0%BC%D1%8F%D0%BD%D0%BD%D1%8B%D0%B9-jpg.86776
Mirovinger, да, все хорошо, спасибо, я просто хочу подвинуть 2 столбик, в сторону, куда указала стрелочка для того, что бы Полученные симпатии были в один ряд.
 
CSMNT написал(а):
что бы Полученные симпатии были в один ряд.
Нажмите для раскрытия...
Даже если подвинете, они в любом случае не будут всегда в один ряд, так как на форум заходят с разных устройств и с разными размерами экрана. Например, Вы сейчас делаете под экран своего монитора, а посмотрите как это выглядит на другом мониторе, разных планшетах/смартфонах. Оно Вам надо писать код под все разрешения экранов? Проще тогда написать Симпатии вместо Полученные Симпатии.
 
Mirovinger, СУПЕР, спасибо огромное)))))))) (не заметил тогда)
 
Войдите или зарегистрируйтесь для ответа.
Современный облачный хостинг провайдер | Aéza
Контакты
ООО "АЕЗА ГРУПП" ИНН 2312304914 ОГРН 1212300056430 г. Краснодар, ул. Маяковского 160, офис 2.4

Похожие темы

TechSide
  • Закрыта
  • Решено
XF 2.2 Не отключаются модификации шаблона
Ответы
6
Просмотры
421
TechSide
TechSide
A
[AH] Font Awesome
Ответы
0
Просмотры
388
azeri
A
M
Добавление иконок Font Awesome в меню пользователя 2
Ответы
13
Просмотры
2K
Mirovinger
M
M
Добавление иконок Font Awesome в постбит сообщений
Ответы
15
Просмотры
1K
facish
facish
M
Добавление иконок Font Awesome в меню настроек пользователя
2 3
Ответы
52
Просмотры
3K
Mirovinger
M
Назад
Сверху Снизу