Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!

Решено [Родина РП] Меню быстрого доступа

Статус
В этой теме нельзя размещать новые ответы.
Ноя
2,005
6,665
Команда форума
Администратор
HTML:
<div class="rfq-menu">
    <a class="rfq-btn" href="http://forum.rodina-rp.com/forums/526/">
        <span>Правила проекта</span>
    </a>
    <a class="rfq-btn" href="http://forum.rodina-rp.com/index.php?forums/Жалобы.77/">
        <span>Жалобы Центральный округ</span>
    </a>
    <a class="rfq-btn" href="http://forum.rodina-rp.com/index.php?forums/Жалобы.56/">
        <span>Жалобы Южный округ</span>
    </a>
    <a class="rfq-btn" href="http://forum.rodina-rp.com/index.php?forums/Северный-округ.112/">
        <span>Жалобы Северный округ</span>
    </a>
    <a class="rfq-btn" href="http://forum.rodina-rp.com/index.php?forums/Восточный-округ.154/">
        <span>Жалобы Восточный округ</span>
    </a>
    <a class="rfq-btn" href="https://forum.rodina-rp.com/forums/261/">
        <span>Жалобы Западный округ</span>
    </a>
    <a class="rfq-btn" href="https://forum.rodina-rp.com/forums/332/">
        <span>Жалобы Приморский округ</span>
    </a>
    <a class="rfq-btn" href="https://forum.rodina-rp.com/forums/380/">
        <span>Жалобы Федеральный округ</span>
    </a>
    <a class="rfq-btn" href="https://forum.rodina-rp.com/forums/481/">
        <span>Жалобы Москва</span>
    </a>
    <a class="rfq-btn" href="https://forum.rodina-rp.com/forums/575/">
        <span>Жалобы СПб</span>
    </a>
</div>
Less:
.p-body-sidebar
{
    .rfq-menu
    {
        --rfq-accent: #e54545;
        --rfq-base: #141416;
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding: 0;

        > .rfq-btn:first-child
        {
            background: #8c1835;
            border-color: #d9204f;
            color: #fff !important;
            font-weight: 700;
            box-shadow: 0 1px 0 rgba(255,255,255,.06) inset, 0 0 0 1px color-mix(in srgb, var(--rfq-accent) 35%, transparent) inset;

            &:hover
            {
                background: color-mix(in srgb, var(--rfq-accent) 28%, var(--rfq-base) 72%) !important;
                border-color: color-mix(in srgb, var(--rfq-accent) 82%, #000 18%) !important;
                filter: none;
            }

            &:focus
            {
                box-shadow: 0 0 0 2px color-mix(in srgb, var(--rfq-accent) 35%, transparent);
            }
        }
    }

    .rfq-btn
    {
        display: block;
        width: 100%;
        box-sizing: border-box;
        padding: 10px 12px;
        border-radius: 8px;
        background: #141416;
        border: 1px solid #8c1835;
        color: #fff;
        text-decoration: none;
        font-weight: 600;
        font-size: 13px;
        line-height: 1.28;
        transition: border-color .14s ease, background-color .14s ease, filter .14s ease;

        &:hover
        {
            border-color: #ff5a5a;
            background: #16171a;
            filter: brightness(1.02);
        }

        &:focus
        {
            outline: none;
            box-shadow: 0 0 0 2px rgba(229,69,69,.35);
        }

        span
        {
            display: block;
            white-space: normal;
            overflow-wrap: anywhere;
            line-height: 1.28;
            text-align: center;
        }
    }

    @media (max-width: @xf-responsiveNarrow)
    {
        .rfq-btn
        {
            padding: 9px 10px;
            font-size: 13.5px;
        }
    }
}
 
Фев
274
456
Активный
Статус
В этой теме нельзя размещать новые ответы.
Сверху