Aurora:HomePageTesting: Difference between revisions

From EarthMC
Jump to navigation Jump to search
mNo edit summary
No edit summary
Line 1: Line 1:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>EarthMC Wiki Home</title>
    <!-- author - Maxxiimus -->
   
    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #E6EFF3;
            color: #333;
        }
        .sidebar {
            background-color: #E6EFF3;
            color: black;
            min-height: 100vh;
            padding: 20px;
            width: 250px;
            transition: transform 0.3s ease;
        }
        .sidebar a {
            color: black;
            text-decoration: none;
            display: block;
            margin: 10px 0;
        }
     
        .sidebar-toggle {
            display: none; /* Hidden by default */
            position: fixed;
            top: 10px;
            left: 10px;
            background-color: #E6EFF3;
            border: none;
            padding: 10px;
            cursor: pointer;
            z-index: 1000; /* Make sure it is on top */
        }
        .close-btn {
            display: none;
            background-color: transparent;
            border: none;
            color: black;
            font-size: 20px;
            cursor: pointer;
            margin-bottom: 10px;
        }
       
        @media (max-width: 768px) {
            .sidebar {
                transform: translateX(-100%);
                position: fixed;
                top: 0;
                left: 0;
                width: 250px;
                height: 100vh;
                z-index: 1000;
            }
            .sidebar.open {
                transform: translateX(0);
            }
            .sidebar-toggle {
                display: block;
            }
            .close-btn {
                display: block;
            }
        }
        .nav-separator {
            border: none;
            border-top: 1px solid #ccc;
            margin: 10px 0;
        }
        .info-navigation,
        .category-navigation,
        .how-to-edit,
        .additional-info {
            background-color: #F0F0F0;
            border-radius: 5px;
            border-width: 1px;
            border-color: #BCBDBD;
            border-style: solid;
            padding: 10px;
            margin-bottom: 20px;
        }
        .footer {
            margin-top: 20px;
        }
        .small-icon {
            width: 100px;
            height: 100px;
            object-fit: contain;
        }
        .icon-grid {
            margin-left: 20px;
            padding-top: 10px;
        }
        .server-selection button.active {
            background-color: #7f8c8d;
            color: white;
            border-color: #7f8c8d;
        }
        .icon-grid .row {
            display: flex;
            flex-wrap: wrap;
            margin: -10px;
        }
        .icon-grid .col-md-2 {
            padding: 10px;
            flex: 0 0 20%;
        }
        .icon-grid img {
            max-width: 100%;
            max-height: 90px;
            display: block;
            object-fit: contain;
            margin: 0 auto;
        }
        .button-group {
            display: flex;
            justify-content: left;
            gap: 10px;
        }
        .btn {
            padding: 10px 20px;
            font-size: 16px;
            border-width: 1px;
            border-radius: 5px;
            background-color: #D9D9D9;
            color: black;
            cursor: pointer;
            border-color: #767171;
            transition: background-color 0.3s;
        }
        a {
            text-decoration: none;
            color: black;
        }
     
        @media (max-width: 768px) {
            .sidebar {
                padding: 10px;
            }
            .icon-grid .col-md-2 {
                flex: 0 0 50%;
                max-width: 50%;
            }
            .small-icon {
                width: 80px;
                height: 80px;
            }
            .button-group {
                flex-direction: column;
                align-items: center;
            }
        }
        @media (max-width: 576px) {
            .icon-grid .col-md-2 {
                flex: 0 0 100%;
                max-width: 100%;
            }
            .small-icon {
                width: 60px;
                height: 60px;
            }
            .button-group {
                gap: 5px;
            }
        }
    </style>
</head>
<body onload="changeServer('Aurora')">
<body onload="changeServer('Aurora')">
   


    <div class="d-flex">
<div class="d-flex">
 
        <button class="sidebar-toggle" onclick="toggleSidebar()">☰</button>
        <nav class="sidebar" id="sidebar">
            <button class="close-btn" onclick="toggleSidebar()">✖</button>
            <h4>Wiki Menu</h4>
            <a href="#">Login with discord</a>
            <a href="#">Create a page</a>
            <a href="#">Recent Changes</a>
            <a href="#">Bring to a random page</a>
            <br>
           
            <h6>Tools</h6>
            <hr class="nav-separator">
            <a href="#">What links here</a>
            <a href="#">Related Changes</a>
            <a href="#">Special pages</a>
            <a href="#">Printable version</a>
            <a href="#">Permanent link</a>
            <a href="#">Page Information</a>
        </nav>


<div class="content container my-4">
    <div class="text-center mb-4">
        [[File:EarthMC.net.png|frameless|center|alt=EarthMC Logo|EarthMC Logo|class=img-fluid|style=max-width:100%; max-height: 300px;]]
    </div>


         <div class="content container my-4">
    <div class="info-navigation">
             <div class="text-center mb-4">
         <div class="row text-left">
                 <img src="./src/img/EarthMC.net.png" alt="EarthMC Logo" class="img-fluid" style="max-width:100%; max-height: 300px;" >
             <div class="col-md-12">
                 
                <p>Welcome to the official [[Earthmc Wiki]], a MediaWiki website that any EMC player can participate in. This wiki aims to establish a collection of all things EMC related.</p>
                <p>Log in with your Discord by clicking the link in the top right corner. This will allow you to interact with pages.</p>
                <p>Don’t forget to link your wiki pages to your in-game town or nation with the commands <strong>/t set wikipage</strong> or <strong>/n spawn wikipage</strong> respectively. This will create clickable wiki links by selecting territory on the [[EarthMC map]].</p>
                <p><a href="#">Now let’s create an entry</a> to build the EarthMC wiki!</p>
                 <p style="display: inline-block;">Check out some other important pages:</p> <a href="#"><img src="src/img/MCQuestionMark.png" width="20px" height="20px" alt="AMA/FAQ"> AMA/FAQ</a> <a href="#"><img src="src/img/LinkIcon.png" width="20px" height="20px" alt="Other useful links"> Other useful links</a>
             </div>
             </div>
        </div>
    </div>


    <div class="category-navigation">
        <h3 class="text-center"><strong>EarthMC Info Navigation - Quick access to all relevant EMC info:</strong></h3>
    </div>


            <div class="info-navigation">
    <div class="how-to-edit">
                <div class="row text-left">
        <div class="row" style="margin-left: 20px;">
                    <div class="col-md-12">
            <div class="col-md-2" style="display:inline-block;">
                        <p>Welcome to the official <a href="#">Earthmc Wiki</a>, a mediawiki website that any EMC player can participate in. This wiki aims to establish a collection of all things EMC related.</p>
                <a href="#"><img src="src/img/Earth.webp" class="img-fluid small-icon" alt="About EarthMC"><p>About EarthMC</p></a>
                        <p>Log in with your discord by clicking the link in the top right corner. this will allow you to interact with pages.</p>
                        <p>Dont forget to link your wiki pages to your in-game town or nation with the commands <strong>/t set wikipage</strong> or <strong>/n spawn wikipage</strong> wikipage respectively. This will create clickable wiki links by selecting territory on the  <a href="#">EarthMC map</a>.</p>
                        <p><a href="#">Now lets create an entry</a> to build the EarthMC wiki!</p>
                        <p style="display: inline-block;">Check out some other important pages:</p><a href="#"><img src="./src/img/MCQuestionMark.png" width="20px" height="20px">AMA/FAQ</a><a href="#"><img src="src/img/LinkIcon.png" width="20px" height="20px">Other useful links</a>
                    </div>
                </div>
             </div>
             </div>
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/MinecraftGrassBlockLogo.png" class="img-fluid small-icon" alt="How to join"><p>How to join</p></a>
            </div>
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/MCMap.png" class="img-fluid small-icon" alt="Live Map"><p>Live Map</p></a>
            </div>
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/GoldBlock.png" class="img-fluid small-icon" alt="Server Economy"><p>Server Economy</p></a>
            </div>
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/MCSign.png" class="img-fluid small-icon" alt="Server Chat"><p>Server Chat</p></a>
            </div>
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/Premium.webp" class="img-fluid small-icon" alt="Premium Rank"><p>Premium Rank</p></a>
            </div>                 
        </div>


        <div class="row" style="padding-top: 10px; margin-left: 20px;">
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/MCBookshelf.png" class="img-fluid small-icon" alt="Server Rules"><p>Server Rules</p></a>
            </div>
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/MCQuickshopIcon.png" class="img-fluid small-icon" alt="Quick Shops"><p>Quick Shops</p></a>
            </div>
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/MCEnderpearl.png" class="img-fluid small-icon" alt="Teleporting"><p>Teleporting</p></a>
            </div>
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/mcMMO.png" class="img-fluid small-icon" alt="mcMMO"><p>mcMMO</p></a>
            </div>
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/MEWOverclaimLogo.png" class="img-fluid small-icon" alt="Overclaim"><p>Overclaim</p></a>
            </div>
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/MCNetheriteSword.png" class="img-fluid small-icon" alt="War Info"><p>War Info</p></a>
            </div>
        </div>


             <div class="category-navigation">
        <div class="row" style="padding-top: 10px; margin-left: 20px;">
                 <h3 class="text-center"><strong>EarthMC Info Navigation - Quick access to all relevant EMC info:</strong></h3>
             <div class="col-md-2" style="display:inline-block;">
                 <a href="#"><img src="src/img/MCFireCharge.png" class="img-fluid small-icon" alt="Celeste"><p>Celeste</p></a>
            </div>
            <div class="col-md-2" style="display:inline-block;">
                <a href="#"><img src="src/img/MCCraftingTable.png" class="img-fluid small-icon" alt="Custom Crafting"><p>Custom Crafting</p></a>
             </div>
             </div>
 
             <div class="col-md-2" style="display:inline-block;">
 
                 <a href="#"><img src="src/img/MCVillageHouse.png" class="img-fluid small-icon" alt="Plot Information"><p>Plot Information</p></a>
             <div class="how-to-edit">
                <div class="row" style="margin-left: 20px;">
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/Earth.webp" class="img-fluid small-icon"><p>About EarthMC</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MinecraftGrassBlockLogo.png" class="img-fluid small-icon"><p>How to join</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCMap.png" class="img-fluid small-icon"><p>Live Map</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/GoldBlock.png" class="img-fluid small-icon"><p>Server Economy</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCSign.png" class="img-fluid small-icon"><p>Server Chat</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/Premium.webp" class="img-fluid small-icon"><p>Premium Rank</p></a>
                    </div>                 
                 </div>
 
                <div class="row" style="padding-top: 10px; margin-left: 20px;">
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCBookshelf.png" class="img-fluid small-icon"><p>Server Rules</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCQuickshopIcon.png" class="img-fluid small-icon"><p>Quick Shops</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCEnderpearl.png" class="img-fluid small-icon"><p>Teleporting</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/mcMMO.png" class="img-fluid small-icon"><p>mcMMO</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MEWOverclaimLogo.png" class="img-fluid small-icon"><p>Overclaim</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCNetheriteSword.png" class="img-fluid small-icon"><p>War Info</p></a>
                    </div>
                </div>
               
                <div class="row" style="padding-top: 10px; margin-left: 20px;">
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCFireCharge.png" class="img-fluid small-icon"><p>Celeste</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCCraftingTable.png" class="img-fluid small-icon"><p>Custom Crafting</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCVillageHouse.png" class="img-fluid small-icon"><p>Plot Information</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCFlint.png" class="img-fluid small-icon"><p>Quaters</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCBell.png" class="img-fluid small-icon"><p>Town Info</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCNetherStar.png" class="img-fluid small-icon"><p>Nation Info</p></a>
                    </div>
                </div>
               
                <div class="row" style="padding-top: 10px; margin-left: 20px;">
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCNetherrack.png" class="img-fluid small-icon"><p>The Nether</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/MCpaper.png" class="img-fluid small-icon"><p>Walkthrough</p></a>
                    </div>
                    <div class="col-md-2" style="display:inline-block;">
                        <a href="#"><img src="./src/img/EMCWikiReward.png" class="img-fluid small-icon"><p>Wiki Rewards</p></a>
                    </div>
                </div>
   
             </div>
             </div>
           
             <div class="col-md-2" style="display:inline-block;">
             <div class="category-navigation">
                 <a href="#"><img src="src/img/MCFlint.png" class="img-fluid small-icon" alt="Quarters"><p>Quarters</p></a>
                 <h3 class="text-center"><strong>Wiki Category Navigation - Quick access to valuble Information:</strong></h3>
             </div>
             </div>
 
             <div class="col-md-2" style="display:inline-block;">
             <div class="additional-info">
                <a href="#"><img src="src/img/MCBell.png" class="img-fluid small-icon" alt="Town Info"><p>Town Info</p></a>
                <div class="server-selection">
                    <p style="display: inline-block;">Navigate to the categories of the EarthMC wiki using the &nbsp;&nbsp; <strong>Server Selection</strong>: </p>
                    <button id="aurora-btn" onclick="changeServer('Aurora')">Aurora</button>
                    <button id="nova-btn" onclick="changeServer('Nova')">Nova</button>
                    <button id="classic-btn" onclick="changeServer('Classic')">Classic</button>
                    <p>or search for a specific page.</p>
                </div>
                <br>
   
 
                <div id="selected-category">
                    Your selected category is: <strong> <span id="server-name">Aurora</span> </strong>
                </div>
 
                <br>
 
           
                <div id="icon-container" class="icon-grid text-center row">
               
                </div>  
             </div>
             </div>
 
             <div class="col-md-2" style="display:inline-block;">
             <div class="category-navigation">
                 <a href="#"><img src="src/img/MCNetherStar.png" class="img-fluid small-icon" alt="Nation Info"><p>Nation Info</p></a>
                 <h3 class="text-center"><strong>How to edit The EarthMC Wiki: </strong></h3>
             </div>
             </div>
        </div>


           
        <div class="row" style="padding-top: 10px; margin-left: 20px;">
            <div class="how-to-edit"> 
            <div class="col-md-2" style="display:inline-block;">
                <div class="row" style="padding-top: 10px;">
                <a href="#"><img src="src/img/MCNetherrack.png" class="img-fluid small-icon" alt="The Nether"><p>The Nether</p></a>
                    <div class="col-md-5" style="display:inline-block;">
                        <p class="sentence">Use the following button to create a wiki page:</p>
                        <div class="button-group">
                            <button class="btn">Aurora Page Name</button>
                            <button class="btn">Create Page</button>
                        </div>
                    </div>
                    <div class="col-md-3" style="display:inline-block;">
                        <img src="./src/img/Earth.webp" class="img-fluid small-icon">
                    </div>
                    <div class="col-md-4" style="display:inline-block;">
                        <p>Before Making an edit on the wiki, please <strong>check our <a>rules</a> for the Wiki, violation of these rules may result in being blocked</strong></p>
                    </div>
                </div>  
             </div>
             </div>
 
             <div class="col-md-2" style="display:inline-block;">
 
                 <a href="#"><img src="src/img/MCpaper.png" class="img-fluid small-icon" alt="Walkthrough"><p>Walkthrough</p></a>
             <div class="category-navigation">
                 <h3 class="text-center"><strong>Additional Information: </strong></h3>
             </div>
             </div>
 
             <div class="col-md-2" style="display:inline-block;">
                   
                <a href="#"><img src="src/img/EMCWikiReward.png" class="img-fluid small-icon" alt="Wiki Rewards"><p>Wiki Rewards</p></a>
             <div class="how-to-edit">             
                <div class="row" style="padding-top: 10px;">
                    <div class="col-md-12" style="display:inline-block;">
                        <ul>
                            <li>You can check out <a href="#">help category</a> to learn more about the way articles should be written</li>
                            <li><a href="#">Rewards</a> are available in game for contributing to the Wiki</li>
                            <li>All articles are required to follow thier respective templates, please check out the <a href="#">Template Directory</a> page before creating a page</li>
                            <li>Vandalizing articles in any way is not allowed and will result in a ban. Your changes to the wiki will be reverted anyway.</li>
 
                        </ul>
                    </div>
                </div>
                <div class="row" style="padding-top: 10px;">
                    <div class="col-md-12" style="display:inline-block;">
                        <div class="button-group" style="justify-content: center;">
                            <button class="btn">Recent New Page</button>
                            <button class="btn">Recent Changes</button>
                            <button class="btn">Your Watchlist</button>
                            <button class="btn" style="padding-left: 60px; padding-right: 60px;">Log</button>
                            <button class="btn">Statistics</button>
                        </div>
                    </div>
                </div>
   
             </div>
             </div>
         </div>
         </div>
     </div>
     </div>


 
     <div class="category-navigation">
     <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
        <h3 class="text-center"><strong>Wiki Category Navigation - Quick access to valuable Information:</strong></h3>
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
     </div>
     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>


     <script>
     <div class="additional-info">
const servers = {
        <div class="server-selection">
    Aurora: [
            <p style="display: inline-block;">Navigate to the categories of the EarthMC wiki using the &nbsp;&nbsp; <strong>Server Selection</strong>: </p>
        { src: './src/img/MCBell.png', title: 'Towns', link: '#' },
            <button id="aurora-btn" onclick="changeServer('Aurora')">Aurora</button>
        { src: './src/img/MCNetherStar.png', title: 'Nations', link: '#' },
            <button id="nova-btn" onclick="changeServer('Nova')">Nova</button>
        { src: './src/img/MCShield.png', title: 'Alliances', link: '#' },
            <button id="classic-btn" onclick="changeServer('Classic')">Classic</button>
        { src: './src/img/MCDiamondSword.webp', title: 'Wars', link: '#' },
            <p>or search for a specific page.</p>
        { src: './src/img/MCPlayerhead.png', title: 'Players', link: '#' },
         </div>
        { src: './src/img/MCChest.png', title: 'Miscellaneous', link: '#' },
         <br>
        { src: './src/img/minecraftbow.webp', title: 'Battles', link: '#' },
        { src: './src/img/MCFlintandsteal.png', title: 'Conflicts', link: '#' },
        { src: './src/img/MCGoldIngot.png', title: 'Businesses', link: '#' },
        { src: './src/img/MCBookandQuill.png', title: 'Organizations', link: '#' },
       
     
    ],
    Nova: [
    { src: './src/img/MCBell.png', title: 'Towns', link: '#' },
        { src: './src/img/MCNetherStar.png', title: 'Nations', link: '#' },
        { src: './src/img/MCShield.png', title: 'Alliances', link: '#' },
        { src: './src/img/MCDiamondSword.webp', title: 'Wars', link: '#' },
        { src: './src/img/MCPlayerhead.png', title: 'Players', link: '#' },
        { src: './src/img/MCChest.png', title: 'Miscellaneous', link: '#' },
        { src: './src/img/minecraftbow.webp', title: 'Battles', link: '#' },
        { src: './src/img/MCFlintandsteal.png', title: 'Conflicts', link: '#' },
        { src: './src/img/MCGoldIngot.png', title: 'Businesses', link: '#' },
        { src: './src/img/MCBookandQuill.png', title: 'Organizations', link: '#' },
    ],
    Classic: [
    { src: './src/img/MCBell.png', title: 'Towns', link: '#' },
        { src: './src/img/MCNetherStar.png', title: 'Nations', link: '#' },
         { src: './src/img/MCShield.png', title: 'Alliances', link: '#' },
         { src: './src/img/MCDiamondSword.webp', title: 'Wars', link: '#' },
        { src: './src/img/MCPlayerhead.png', title: 'Players', link: '#' },
        { src: './src/img/MCChest.png', title: 'Miscellaneous', link: '#' },
        { src: './src/img/minecraftbow.webp', title: 'Battles', link: '#' },
        { src: './src/img/MCFlintandsteal.png', title: 'Conflicts', link: '#' },
        { src: './src/img/MCGoldIngot.png', title: 'Businesses', link: '#' },
        { src: './src/img/MCBookandQuill.png', title: 'Organizations', link: '#' },
    ]
};


        <div id="selected-category">
            Your selected category is: <strong> <span id="server-name">Aurora</span> </strong>
        </div>
        <br>


        <div id="icon-container" class="icon-grid text-center row"></div>   
    </div>


function changeServer(serverName) {
    <div class="category-navigation">
    const container = document.getElementById('icon-container');
        <h3 class="text-center"><strong>How to edit The EarthMC Wiki: </strong></h3>
     container.innerHTML = '';
     </div>


     const serverNameElem = document.getElementById('server-name');
     <div class="how-to-edit"> 
    serverNameElem.textContent = serverName;
        <div class="row" style="margin-left: 20px;">
 
            <div class="col-md-2" style="display:inline-block;">
 
                <a href="#"><img src="src/img/MCAnvil.png" class="img-fluid small-icon" alt="How to Edit"><p>How to Edit</p></a>
    document.querySelectorAll('.server-selection button').forEach(button => {
             </div>
        button.classList.remove('active');
             <div class="col-md-2" style="display:inline-block;">
    });
                <a href="#"><img src="src/img/MCBookshelf.png" class="img-fluid small-icon" alt="Editing Guidelines"><p>Editing Guidelines</p></a>
    document.getElementById(`${serverName.toLowerCase()}-btn`).classList.add('active');
            </div>
 
            <div class="col-md-2" style="display:inline-block;">
    const icons = servers[serverName];
                <a href="#"><img src="src/img/MCPiston.png" class="img-fluid small-icon" alt="Template"><p>Template</p></a>
    let rowDiv = document.createElement('div');
            </div>
    rowDiv.className = 'row';
            <div class="col-md-2" style="display:inline-block;">
 
                <a href="#"><img src="src/img/MCPickaxe.png" class="img-fluid small-icon" alt="Editing Tools"><p>Editing Tools</p></a>
    icons.forEach((icon, index) => {
            </div>
        if (index > 0 && index % 5 === 0) {
         </div>
            container.appendChild(rowDiv);
     </div>
             rowDiv = document.createElement('div');
</div>
             rowDiv.className = 'row';
</div>
        }
 
        const colDiv = document.createElement('div');
        colDiv.className = 'col-md-2';
   
 
        const a = document.createElement('a');
        a.href = icon.link;
        a.title = `More about ${icon.title}`;
 
        const img = document.createElement('img');
        img.src = icon.src;
        img.className = 'img-fluid';
        img.alt = icon.title;
        img.width = 200;
        img.height = 200;
 
        const p = document.createElement('p');
        p.textContent = `${icon.title}`;
 
        a.appendChild(img);
        a.appendChild(p);
 
         colDiv.appendChild(a);
        rowDiv.appendChild(colDiv);
     });
 
    container.appendChild(rowDiv);
}
 
function toggleSidebar() {
    const sidebar = document.getElementById('sidebar');
    sidebar.classList.toggle('open');
}


    </script>
</body>
</body>
</html>

Revision as of 15:28, 28 August 2024

<body onload="changeServer('Aurora')">

Welcome to the official Earthmc Wiki, a MediaWiki website that any EMC player can participate in. This wiki aims to establish a collection of all things EMC related.

Log in with your Discord by clicking the link in the top right corner. This will allow you to interact with pages.

Don’t forget to link your wiki pages to your in-game town or nation with the commands /t set wikipage or /n spawn wikipage respectively. This will create clickable wiki links by selecting territory on the EarthMC map.

<a href="#">Now let’s create an entry</a> to build the EarthMC wiki!

Check out some other important pages:

<a href="#"><img src="src/img/MCQuestionMark.png" width="20px" height="20px" alt="AMA/FAQ"> AMA/FAQ</a> <a href="#"><img src="src/img/LinkIcon.png" width="20px" height="20px" alt="Other useful links"> Other useful links</a>

EarthMC Info Navigation - Quick access to all relevant EMC info:

<a href="#"><img src="src/img/Earth.webp" class="img-fluid small-icon" alt="About EarthMC">

About EarthMC

</a>
<a href="#"><img src="src/img/MinecraftGrassBlockLogo.png" class="img-fluid small-icon" alt="How to join">

How to join

</a>
<a href="#"><img src="src/img/MCMap.png" class="img-fluid small-icon" alt="Live Map">

Live Map

</a>
<a href="#"><img src="src/img/GoldBlock.png" class="img-fluid small-icon" alt="Server Economy">

Server Economy

</a>
<a href="#"><img src="src/img/MCSign.png" class="img-fluid small-icon" alt="Server Chat">

Server Chat

</a>
<a href="#"><img src="src/img/Premium.webp" class="img-fluid small-icon" alt="Premium Rank">

Premium Rank

</a>
<a href="#"><img src="src/img/MCBookshelf.png" class="img-fluid small-icon" alt="Server Rules">

Server Rules

</a>
<a href="#"><img src="src/img/MCQuickshopIcon.png" class="img-fluid small-icon" alt="Quick Shops">

Quick Shops

</a>
<a href="#"><img src="src/img/MCEnderpearl.png" class="img-fluid small-icon" alt="Teleporting">

Teleporting

</a>
<a href="#"><img src="src/img/mcMMO.png" class="img-fluid small-icon" alt="mcMMO">

mcMMO

</a>
<a href="#"><img src="src/img/MEWOverclaimLogo.png" class="img-fluid small-icon" alt="Overclaim">

Overclaim

</a>
<a href="#"><img src="src/img/MCNetheriteSword.png" class="img-fluid small-icon" alt="War Info">

War Info

</a>
<a href="#"><img src="src/img/MCFireCharge.png" class="img-fluid small-icon" alt="Celeste">

Celeste

</a>
<a href="#"><img src="src/img/MCCraftingTable.png" class="img-fluid small-icon" alt="Custom Crafting">

Custom Crafting

</a>
<a href="#"><img src="src/img/MCVillageHouse.png" class="img-fluid small-icon" alt="Plot Information">

Plot Information

</a>
<a href="#"><img src="src/img/MCFlint.png" class="img-fluid small-icon" alt="Quarters">

Quarters

</a>
<a href="#"><img src="src/img/MCBell.png" class="img-fluid small-icon" alt="Town Info">

Town Info

</a>
<a href="#"><img src="src/img/MCNetherStar.png" class="img-fluid small-icon" alt="Nation Info">

Nation Info

</a>
<a href="#"><img src="src/img/MCNetherrack.png" class="img-fluid small-icon" alt="The Nether">

The Nether

</a>
<a href="#"><img src="src/img/MCpaper.png" class="img-fluid small-icon" alt="Walkthrough">

Walkthrough

</a>
<a href="#"><img src="src/img/EMCWikiReward.png" class="img-fluid small-icon" alt="Wiki Rewards">

Wiki Rewards

</a>

Wiki Category Navigation - Quick access to valuable Information:

Navigate to the categories of the EarthMC wiki using the    Server Selection:

           <button id="aurora-btn" onclick="changeServer('Aurora')">Aurora</button>
           <button id="nova-btn" onclick="changeServer('Nova')">Nova</button>
           <button id="classic-btn" onclick="changeServer('Classic')">Classic</button>

or search for a specific page.

       
           Your selected category is:  Aurora 
       

How to edit The EarthMC Wiki:

<a href="#"><img src="src/img/MCAnvil.png" class="img-fluid small-icon" alt="How to Edit">

How to Edit

</a>
<a href="#"><img src="src/img/MCBookshelf.png" class="img-fluid small-icon" alt="Editing Guidelines">

Editing Guidelines

</a>
<a href="#"><img src="src/img/MCPiston.png" class="img-fluid small-icon" alt="Template">

Template

</a>
<a href="#"><img src="src/img/MCPickaxe.png" class="img-fluid small-icon" alt="Editing Tools">

Editing Tools

</a>

</body>