Названия плагина

sparco1988

sparco1988

Местный
Сообщения
72
Реакции
46
Баллы
188
Здравствуйте! Подскажите, пожалуйста, как называется этот плагин? Или это просто виджет, созданный с помощью HTML?
2025-11-15_11-40-45.png
Большое спасибо всем за поддержку!
 
Сортировать по дате Сортировать по голосам
Виджет html

HTML: 
<div class="quick-access-menu">
    <div class="menu-buttons">
        <a href="/forums/-/create-thread" class="menu-button primary" data-xf-click="overlay" rel="nofollow">СОЗДАТЬ ТЕМУ</a>
        <a href="/resources/add" class="menu-button secondary" data-xf-click="overlay" rel="nofollow">ДОБАВИТЬ РЕСУРС</a>
    </div>

    <div class="web-dev-section">
        <div class="sub-title-with-dots">
            <span class="blue-dot"></span>
            <span class="sub-title-text">Язык кода</span>
            <span class="blue-dot"></span>
        </div>
      
        <div class="web-dev-buttons compact">
            <a href="/" class="web-dev-btn">Lua</a>
            <a href="/" class="web-dev-btn">PHP</a>
            <a href="/" class="web-dev-btn">C#</a>
            <a href="/" class="web-dev-btn">C / C++</a>
        </div>
        <div class="web-dev-buttons compact">
            <a href="/" class="web-dev-btn">JavaScript</a>
            <a href="/" class="web-dev-btn">Python</a>
        </div>
    </div>

    <div class="menu-separator"></div>

    <div class="web-dev-section">
        <div class="sub-title-with-dots">
            <span class="blue-dot"></span>
            <span class="sub-title-text">HTML / CSS</span>
            <span class="blue-dot"></span>
        </div>
      
        <div class="web-dev-buttons compact">
            <a href="/" class="web-dev-btn">Мануалы</a>
            <a href="/" class="web-dev-btn">Шаблоны</a>
        </div>
        <div class="web-dev-single">
            <a href="/" class="web-dev-btn single">Готовые решения / Исходники</a>
        </div>
      
        <div class="sub-title-with-dots">
            <span class="blue-dot"></span>
            <span class="sub-title-text">Xenforo</span>
            <span class="blue-dot"></span>
        </div>
      
        <div class="web-dev-buttons compact">
            <a href="/walls115" class="web-dev-btn">Релизы</a>
            <a href="/walls117" class="web-dev-btn">Стили</a>
            <a href="/walls116" class="web-dev-btn">Плагины</a>
            <a href="/walls118" class="web-dev-btn">Переводы</a>
        </div>
        <div class="web-dev-buttons compact">   
            <a href="/walls121" class="web-dev-btn single">Готовые решения</a>
            <a href="/walls114" class="web-dev-btn single">Помощь</a>
        </div>
    </div>

    <div class="menu-separator"></div>

    <div class="games-section">
        <div class="sub-title-with-dots">
            <span class="blue-dot"></span>
            <span class="sub-title-text">Игровая категория</span>
            <span class="blue-dot"></span>
        </div>
      
        <div class="subforums">
            <div class="subforum-item">
                <div class="subforum-header">
                    <span class="subforum-link">
                        <span class="game-icon">
                            <img src="https://black-resource.ru/data/icons8-minecraft-logo-48.png" alt="Minecraft" width="18" height="18">
                        </span>
                        Minecraft
                    </span>
                    <span class="subforum-arrow">▼</span>
                </div>
                <div class="subforum-content">
                    <div class="subforum-buttons">
                        <a href="/" class="subforum-sublink">Гайды</a>
                        <a href="/" class="subforum-sublink">Другое</a>
                    </div>
                </div>
            </div>
          
            <div class="subforum-item">
                <div class="subforum-header">
                    <span class="subforum-link">
                        <span class="game-icon">
                            <img src="https://black-resource.ru/data/icons8-pubg-48.png" alt="PUBG" width="18" height="18">
                        </span>
                        PUBG
                    </span>
                    <span class="subforum-arrow">▼</span>
                </div>
                <div class="subforum-content">
                    <div class="subforum-buttons">
                        <a href="/forums/gaidy.208/" class="subforum-sublink">Гайды</a>
                        <a href="/forums/drugoye.210/" class="subforum-sublink">Другое</a>
                    </div>
                </div>
            </div>
          
            <div class="subforum-item">
                <div class="subforum-header">
                    <span class="subforum-link">
                        <span class="game-icon">
                            <img src="https://black-resource.ru/data/icons8-rockstar-games-50.png" alt="GTA" width="18" height="18">
                        </span>
                        GTA
                    </span>
                    <span class="subforum-arrow">▼</span>
                </div>
                <div class="subforum-content">
                    <div class="subforum-buttons">
                        <a href="/forums/samp.178/" class="subforum-sublink">SAMP</a>
                        <a href="/forums/crmp.179/" class="subforum-sublink">CRMP</a>
                        <a href="/forums/gta5.180/" class="subforum-sublink">GTA5</a>
                    </div>
                </div>
            </div>

            <div class="subforum-item">
                <div class="subforum-header">
                    <span class="subforum-link">
                        <span class="game-icon">
                            <img src="https://black-resource.ru/data/icons8-dota-2-48.png" alt="Dota 2" width="18" height="18">
                        </span>
                        Dota 2
                    </span>
                    <span class="subforum-arrow">▼</span>
                </div>
                <div class="subforum-content">
                    <div class="subforum-buttons">
                        <a href="/forums/gaidy.192/" class="subforum-sublink">Гайды</a>
                        <a href="/forums/drugoye.200/" class="subforum-sublink">Другое</a>
                    </div>
                </div>
            </div>
          
            <div class="subforum-item">
                <div class="subforum-header">
                    <span class="subforum-link">
                        <span class="game-icon">
                            <img src="https://black-resource.ru/data/icons8-warface-48.png" alt="Warface" width="18" height="18">
                        </span>
                        Warface
                    </span>
                    <span class="subforum-arrow">▼</span>
                </div>
                <div class="subforum-content">
                    <div class="subforum-buttons">
                        <a href="/forums/gaidy.193/" class="subforum-sublink">Гайды</a>
                        <a href="/forums/drugoye.201/" class="subforum-sublink">Другое</a>
                    </div>
                </div>
            </div>
          
            <div class="subforum-item">
                <div class="subforum-header">
                    <span class="subforum-link">
                        <span class="game-icon">
                            <img src="https://black-resource.ru/data/icons8-counter-strike-48.png" alt="Counter-Strike" width="18" height="18">
                        </span>
                        Counter-Strike 2
                    </span>
                    <span class="subforum-arrow">▼</span>
                </div>
                <div class="subforum-content">
                    <div class="subforum-buttons">
                        <a href="/forums/gaidy.194/" class="subforum-sublink">Гайды</a>
                        <a href="/forums/modifikatsii.197/" class="subforum-sublink">Модификации</a>
                        <a href="/forums/drugoye.202/" class="subforum-sublink">Другое</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<style>
.quick-access-menu {
    background-color: transparent;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}
.menu-buttons {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}

.menu-button {
    flex: 1;
    padding: 8px 12px;
    border: none;
    border-radius: 6px;
    text-decoration: none;
    text-align: center;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    display: block;
    line-height: 1.2;
    white-space: nowrap;
    min-width: 0;
}
.menu-button.primary {
    background: #228e5d;
    color: white;
}

.menu-button.primary:hover {
    background: #228e5d;
    transform: translateY(-1px);
}

.menu-button.secondary {
    background: #228e5d;
    color: white;
}

.menu-button.secondary:hover {
    background: #228e5d;
    transform: translateY(-1px);
}

.web-dev-section {
    margin-bottom: 16px;
}
.sub-title-with-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 12px 0 8px 0;
}
.sub-title-text {
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    white-space: nowrap;
}
.green-dot {
    width: 6px;
    height: 6px;
    background: #228e5d;
    border-radius: 50%;
    display: inline-block;
}
.web-dev-buttons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    margin-bottom: 8px;
}
.web-dev-section .web-dev-buttons:nth-of-type(1) {
    grid-template-columns: 1fr 1fr 1fr 1fr;
}
.web-dev-section .web-dev-buttons:nth-of-type(2) {
    grid-template-columns: 1fr 1fr;
}
.web-dev-single {
    display: flex;
    margin-bottom: 12px;
}
.web-dev-btn {
    padding: 6px 8px;
    background: rgba(23, 23, 23, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    text-decoration: none;
    text-align: center;
    font-size: 13px;
    font-weight: 700;
    color: white;
    cursor: pointer;
    transition: all 0.2s ease;
    display: block;
    line-height: 1.2;
    white-space: nowrap;
}
.web-dev-btn:hover {
    background: rgba(34, 142, 93, 0.8);
    border-color: #228e5d;
    color: white;
}

.web-dev-btn.single {
    width: 100%;
    font-size: 13px;
    font-weight: 700;
}

.web-dev-btn.with-arrow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 8px;
}

.btn-arrow {
    font-size: 10px;
    color: #228e5d;
    margin-left: 4px;
    font-weight: bold;
    transition: transform 0.2s ease;
}

.xf-buttons-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    margin-bottom: 8px;
}

.xf-button-item {
    position: relative;
}

.xf-button-header {
    cursor: pointer;
}

.xf-button-header.active .btn-arrow {
    transform: rotate(180deg);
}

.xf-submenu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 10;
    margin-top: 4px;
}

.xf-button-header.active + .xf-submenu {
    display: block;
}

.xf-submenu-buttons {
    display: flex;
    flex-direction: column;
    gap: 4px;
    background: rgba(23, 23, 23, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    padding: 6px;
}

.xf-submenu-btn {
    padding: 4px 6px;
    background: rgba(34, 142, 93, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    text-decoration: none;
    color: #fff;
    font-size: 11px;
    text-align: center;
    transition: all 0.2s ease;
    line-height: 1.2;
    white-space: nowrap;
}

.xf-submenu-btn:hover {
    background: rgba(34, 142, 93, 0.6);
    border-color: #228e5d;
}

.xf-single-item {
    position: relative;
    margin-bottom: 12px;
}

.xf-single-item .xf-submenu {
    width: 100%;
}

.menu-separator {
    border-top: 1px solid rgba(221, 221, 221, 0.3);
    margin: 8px 0;
}

.games-section {
    margin-bottom: 16px;
}

.subforums {
    margin-top: 8px;
}

.subforum-item {
    margin-bottom: 8px;
}

.subforum-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: rgba(23, 23, 23, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.subforum-header:hover {
    background: rgba(34, 142, 93, 0.3);
}

.subforum-link {
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

.subforum-arrow {
    font-size: 10px;
    color: #228e5d;
    transition: transform 0.2s ease;
    font-weight: bold;
}

.subforum-header.active .subforum-arrow {
    transform: rotate(180deg);
}

.subforum-content {
    display: none;
    margin-top: 4px;
}

.subforum-header.active + .subforum-content {
    display: block;
}

.subforum-buttons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    padding-left: 16px;
}

.subforum-sublink {
    padding: 6px 8px;
    background: rgba(23, 23, 23, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    text-decoration: none;
    color: #fff;
    font-size: 12px;
    text-align: center;
    transition: all 0.2s ease;
    line-height: 1.2;
    white-space: nowrap;
}

.subforum-sublink:hover {
    background: rgba(34, 142, 93, 0.3);
    border-color: #228e5d;
}
.game-icon {
    margin-right: 8px;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}

.game-icon img {
    width: 18px;
    height: 18px;
    display: block;
}
</style>
<script>
function toggleSubforum(element) {
    const header = element.closest('.subforum-header');
    const content = header.nextElementSibling;
    
    header.classList.toggle('active');
    
    if (header.classList.contains('active')) {
        content.style.display = 'block';
    } else {
        content.style.display = 'none';
    }
}

function toggleXfSubmenu(element) {
    const header = element.closest('.xf-button-header');
    const submenu = header.nextElementSibling;
    
    header.classList.toggle('active');
    
    if (header.classList.contains('active')) {
        submenu.style.display = 'block';
    } else {
        submenu.style.display = 'none';
    }
}
</script>
 
За 0 Против
Для ответа нужно войти/зарегистрироваться
Назад
Верх Низ