Module:Sidebar

Documentation for this module may be created at Module:Sidebar/doc

local p = {}

function p.getSidebar()
    local css = [[
        <style>
            /* Game Card Sidebar Styling */
            .sidebar-game-card {
                background: var(--card-bg-main);
                border-radius: var(--border-radius-md);
                border: 1px solid var(--theme-border-color);
                box-shadow: var(--shadow-sm);
                margin-bottom: 15px;
                overflow: hidden;
                transition: all var(--transition-base) ease;
            }
            
            .sidebar-game-card:hover {
                box-shadow: var(--shadow-md);
                border-color: var(--teal-300);
            }
            
            .sidebar-card-header {
                background: linear-gradient(90deg, var(--teal-700) 0%, var(--teal-900) 100%);
                padding: 10px 15px;
                display: flex;
                flex-direction: column;
            }
            
            .sidebar-card-title {
                font-size: 1em;
                font-weight: 900;
                letter-spacing: 1px;
                color: #fff;
                text-shadow: 0 0 8px rgba(162, 242, 225, 0.4);
                margin: 0;
            }
            
            .sidebar-card-line {
                height: 2px;
                width: 40px;
                background: var(--teal-200);
                margin-top: 5px;
                border-radius: 1px;
            }
            
            .sidebar-card-content {
                padding: 12px 15px;
            }
            
            .sidebar-card-list {
                margin: 0;
                padding: 0;
                list-style: none;
            }
            
            .sidebar-card-item {
                padding: 6px 0;
                border-bottom: 1px dotted var(--theme-border-color--subtle);
            }
            
            .sidebar-card-item:last-child {
                border-bottom: none;
            }
            
            .sidebar-card-item a {
                color: var(--theme-page-text-color);
                text-decoration: none;
                font-weight: 500;
                transition: all var(--transition-fast) ease;
                display: block;
                padding: 3px 5px;
                border-radius: 3px;
            }
            
            .sidebar-card-item a:hover {
                color: var(--theme-link-color);
                background: var(--theme-page-background-color--secondary);
                padding-left: 10px;
            }
            
            /* Logo styling */
            .sidebar-logo-card {
                background: linear-gradient(90deg, var(--teal-700) 0%, var(--teal-900) 100%);
                border-radius: var(--border-radius-md) var(--border-radius-md) 0 0;
                padding: 20px;
                text-align: center;
                margin-bottom: 15px;
                border: 1px solid var(--theme-border-color);
                border-bottom: none;
            }
            
            .sidebar-logo-card a {
                display: inline-block;
                transition: transform var(--transition-base) ease;
            }
            
            .sidebar-logo-card a:hover {
                transform: scale(1.05);
            }
        </style>
    ]]
    
    local html = css .. [[
        <div class="sidebar-logo-card">
            <a href="/wiki/Main_Page" title="Visit the main page" class="mw-wiki-logo"></a>
        </div>
        
        <div class="sidebar-game-card">
            <div class="sidebar-card-header">
                <div class="sidebar-card-title">NAVIGATION</div>
                <div class="sidebar-card-line"></div>
            </div>
            <div class="sidebar-card-content">
                <ul class="sidebar-card-list">
                    <li class="sidebar-card-item"><a href="/wiki/Main_Page">Home</a></li>
                    <li class="sidebar-card-item"><a href="/wiki/Special:RecentChanges">Recent changes</a></li>
                    <li class="sidebar-card-item"><a href="/wiki/Special:WhatLinksHere/Main_Page">What links here</a></li>
                    <li class="sidebar-card-item"><a href="/wiki/Special:Upload">Upload file</a></li>
                    <li class="sidebar-card-item"><a href="/wiki/Special:CreatePage">Add new page</a></li>
                    <li class="sidebar-card-item"><a href="/wiki/Special:Random">Random page</a></li>
                </ul>
            </div>
        </div>
        
        <div class="sidebar-game-card">
            <div class="sidebar-card-header">
                <div class="sidebar-card-title">TOOLS</div>
                <div class="sidebar-card-line"></div>
            </div>
            <div class="sidebar-card-content">
                <ul class="sidebar-card-list">
                    <li class="sidebar-card-item"><a href="/wiki/Special:WhatLinksHere/Main_Page">What links here</a></li>
                    <li class="sidebar-card-item"><a href="/wiki/Special:RecentChangesLinked/Main_Page">Related changes</a></li>
                    <li class="sidebar-card-item"><a href="/wiki/Special:UploadWizard">Upload file</a></li>
                    <li class="sidebar-card-item"><a href="/wiki/Special:SpecialPages">Special pages</a></li>
                    <li class="sidebar-card-item"><a href="javascript:print();">Printable version</a></li>
                    <li class="sidebar-card-item"><a href="/w/index.php?title=Main_Page&amp;oldid=27708">Permanent link</a></li>
                    <li class="sidebar-card-item"><a href="/w/index.php?title=Main_Page&amp;action=info">Page information</a></li>
                </ul>
            </div>
        </div>
    ]]
    
    return html
end

return p