Как сделать такие кнопки

[NeArtemkut]

Я хочу сделать такие кнопки, но не понимаю как, помогите плиз 

[by_ix]

ссылку, где увидели.

[NeArtemkut]

Только что, by_ix сказал:

ссылку, где увидели.

Закрылся форум уже

[by_ix]

by_ix где именно нужно? на сайте или на форуме? и иконка эта тоже нужна?

[NeArtemkut]

1 час назад, by_ix сказал:

by_ix где именно нужно? на сайте или на форуме? и иконка эта тоже нужна?

На форуме. Иконка не обязательно.

Мне нужно такое оформление кнопки.

[NeArtemkut]

В 16.01.2022 в 21:20, by_ix сказал:

by_ix где именно нужно? на сайте или на форуме? и иконка эта тоже нужна?

Реально ли сделать такое на форуме?

[Desti]

В 16.01.2022 в 22:07, NeArtemkut сказал:

Закрылся форум уже

wayback maсhine всех помнит

[by_ix]

NeArtemkut 
не до конца понимаю, где именно они нужны такие.
пробуйте так, скажете потом, что не нужно или что добавить.
в custom.css
.ipsNavBar_secondary > li[data-role="navBarItem"] {
    background: rgb(255, 255, 255);
    border-radius: 10px;
    color: black;
    max-height: 48px;
    border-bottom: 3px solid rgba(0, 0, 0, 0.38);
}

[Desti]

3 минуты назад, by_ix сказал:

border-bottom: 3px solid rgba(0, 0, 0, 0.38);

там, скорее, shadow, а не border

[NeArtemkut]

13 часов назад, by_ix сказал:

NeArtemkut 
не до конца понимаю, где именно они нужны такие.
пробуйте так, скажете потом, что не нужно или что добавить.
в custom.css
.ipsNavBar_secondary > li[data-role="navBarItem"] {
    background: rgb(255, 255, 255);
    border-radius: 10px;
    color: black;
    max-height: 48px;
    border-bottom: 3px solid rgba(0, 0, 0, 0.38);
}

Мне нужно заменить на эти кнопки, сделать их такими как на сайте reallyworld.ru

[NeArtemkut]

@by_ix

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

[by_ix]

NeArtemkut 

.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a {
    background: white;
    border-radius: 12px;
    color: black;
    border-bottom: #e0e0e0 4px solid;
    padding: 0px 20px;
    line-height: 50px;
}

 

В 19.01.2022 в 00:18, Desti сказал:

shadow

border.

[NeArtemkut]

28 минут назад, by_ix сказал:

NeArtemkut 

.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a {
    background: white;
    border-radius: 12px;
    color: black;
    border-bottom: #e0e0e0 4px solid;
    padding: 0px 20px;
    line-height: 50px;
}

 

border

Можно сделать красивое выделение? (Как показано выше в скринах(

[by_ix]

NeArtemkut что не так? как на скрине показано, так и сделано.
 

[NeArtemkut]

3 минуты назад, by_ix сказал:

NeArtemkut что не так? как на скрине показано, так и сделано.
 

Вот такое :

[by_ix]

В 17.01.2022 в 03:09, NeArtemkut сказал:

Иконка не обязательно.

изначально спросил у вас.

[NeArtemkut]

1 минуту назад, by_ix сказал:

изначально спросил у вас.

Тупанул я... Простите...

Edited January 19, 2022 by NeArtemkut

[by_ix]

NeArtemkut 

/* menu */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a {
    background: white;
    border-radius: 12px;
    color: black;
    border-bottom: #e0e0e0 4px solid;
    line-height: 50px;
}
/* fa */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a::before {
    font: normal normal normal 14px/1 FontAwesome;
    display: inline-block;
    background-color: #fc9404;
    color: #fff;
    -webkit-box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.25);
    border-radius: 6px;
    text-align: center;
    font-size: 15px;
    padding: 8px 10px;
    margin-right: 10px;
}
/* site */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a[data-navitem-id="16"]::before {
    content: "\f0ac";
}
/* forum */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a[data-navitem-id="1"]::before {
    content: "\f015";
}
/* activity */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a[data-navitem-id="2"]::before {
    content: "\f1ea";
}
/* rules */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a[data-navitem-id="17"]::before {
    content: "\f15c";
}

 

[NeArtemkut]

14 часов назад, by_ix сказал:

NeArtemkut 

/* menu */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a {
    background: white;
    border-radius: 12px;
    color: black;
    border-bottom: #e0e0e0 4px solid;
    line-height: 50px;
}
/* fa */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a::before {
    font: normal normal normal 14px/1 FontAwesome;
    display: inline-block;
    background-color: #fc9404;
    color: #fff;
    -webkit-box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.25);
    border-radius: 6px;
    text-align: center;
    font-size: 15px;
    padding: 8px 10px;
    margin-right: 10px;
}
/* site */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a[data-navitem-id="16"]::before {
    content: "\f0ac";
}
/* forum */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a[data-navitem-id="1"]::before {
    content: "\f015";
}
/* activity */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a[data-navitem-id="2"]::before {
    content: "\f1ea";
}
/* rules */
.ipsNavBar_primary.ipsLayout_container > .ipsClearfix > .ipsNavBar_active > a[data-navitem-id="17"]::before {
    content: "\f15c";
}

 

А как разместить кнопки рядом с логотипом, и чтобы было ровно все

[NeArtemkut]

@by_ix 

[by_ix]

переместить их туда в шаблоне.