|
|
| (17 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| <style> | | <noinclude>{{/doc}}</noinclude>__NOTOC__ |
| .mainpage-section {
| | <div class="mainpage-recent-updates tile-row"> |
| margin-bottom: 30px;
| |
| }
| |
|
| |
| .tile-row {
| |
| display: flex;
| |
| flex-wrap: wrap;
| |
| justify-content: center;
| |
| gap: 15px;
| |
| margin-bottom: 20px;
| |
| }
| |
|
| |
| .tile-halves {
| |
| width: calc(33.33% - 15px);
| |
| min-width: 150px;
| |
| border-radius: 8px;
| |
| overflow: hidden;
| |
| box-shadow: 0 4px 8px rgba(0,0,0,0.1);
| |
| transition: transform 0.3s ease, box-shadow 0.3s ease;
| |
| background-color: #fff;
| |
| margin-bottom: 15px;
| |
| }
| |
|
| |
| .tile-halves:hover {
| |
| transform: translateY(-5px);
| |
| box-shadow: 0 8px 16px rgba(0,0,0,0.15);
| |
| }
| |
|
| |
| .tile-image {
| |
| width: 100%;
| |
| height: auto;
| |
| overflow: hidden;
| |
| }
| |
|
| |
| .tile-image img {
| |
| width: 100%;
| |
| height: auto;
| |
| transition: transform 0.5s ease;
| |
| display: block;
| |
| }
| |
|
| |
| .tile-halves:hover .tile-image img {
| |
| transform: scale(1.05);
| |
| }
| |
|
| |
| .tile-bottom {
| |
| padding: 10px;
| |
| background-color: #202020;
| |
| text-align: center;
| |
| }
| |
|
| |
| .link-button h2 {
| |
| margin: 0;
| |
| font-size: 18px;
| |
| color: #caaa61;
| |
| font-weight: 600;
| |
| padding: 5px 0;
| |
| }
| |
|
| |
| .section-title {
| |
| color: #caaa61;
| |
| text-align: center;
| |
| margin-bottom: 20px;
| |
| font-size: 24px;
| |
| font-weight: bold;
| |
| text-transform: uppercase;
| |
| letter-spacing: 1px;
| |
| padding-bottom: 10px;
| |
| border-bottom: 2px solid #caaa61;
| |
| }
| |
|
| |
| @media (max-width: 768px) {
| |
| .tile-halves {
| |
| width: calc(50% - 15px);
| |
| }
| |
| }
| |
|
| |
| @media (max-width: 480px) {
| |
| .tile-halves {
| |
| width: 100%;
| |
| }
| |
| }
| |
| </style>
| |
| | |
| <div class="mainpage-section">
| |
| <h1 class="section-title">Server Informatie</h1>
| |
| <div class="mainpage-recent-updates tile-row"> | |
| <div class="tile-halves"> | | <div class="tile-halves"> |
| <div class="tile-top tile-image">[[File: Rules3.png|link= Server Rules|alt=Rules]]</div> | | <div class="tile-top tile-image">[[File: Rulesbook.png|link=Rules|alt=Rules]]</div> |
| <div class="tile-bottom link-button"><h2>[[ Server Rules]]</h2></div> | | <div class="tile-bottom link-button"><h2 style="text-align:center">[[Rules]]</h2></div> |
| </div> | | </div> |
| <div class="tile-halves"> | | <div class="tile-halves"> |
| <div class="tile-top tile-image">[[File: Donation4.png|link=Donating|alt= Donating]]</div> | | <div class="tile-top tile-image">[[File: donation.png|link=Donating|alt= Donator Perks]]</div> |
| <div class="tile-bottom link-button"><h2>[[ Donating]]</h2></div> | | <div class="tile-bottom link-button"><h2>[[ Donator Perks]]</h2></div> |
| </div> | | </div> |
| <div class="tile-halves"> | | <div class="tile-halves"> |
| <div class="tile-top tile-image">[[File: Voting.png|link=Voting|alt=Voting]]</div> | | <div class="tile-top tile-image">[[File: voting.png|link=Voting|alt=Voting]]</div> |
| <div class="tile-bottom link-button"><h2>[[Voting]]</h2></div> | | <div class="tile-bottom link-button"><h2>[[Voting]]</h2></div> |
| </div> | | </div> |
| </div>
| |
| </div> | | </div> |
| | | <div class="mainpage-contents tile-row"> |
| <div class="mainpage-section">
| | <div class="contents-equipment tile-halves"> |
| <h1 class="section-title">Gameplay Informatie</h1>
| | <div class="tile-top tile-image">[[File:Achievements.png|link=Achievements]]</div> |
| <div class="mainpage-contents tile-row"> | | <div class="tile-bottom link-button"><h2>[[Achievements]]</h2></div> |
| <div class="tile-halves"> | |
| <div class="tile-top tile-image">[[File:Achievements.png|link=Achievements]]</div> | |
| <div class="tile-bottom link-button"><h2>[[Achievements ]]</h2></div> | |
| </div>
| |
| <div class="tile-halves">
| |
| <div class="tile-top tile-image">[[File:Afkzone.png|link=Afk Zone]]</div>
| |
| <div class="tile-bottom link-button"><h2>[[Afk Zone]]</h2></div>
| |
| </div>
| |
| <div class="tile-halves">
| |
| <div class="tile-top tile-image">[[File:Bosses1.png|link=Bosses]]</div>
| |
| <div class="tile-bottom link-button"><h2>[[Bosses]]</h2></div>
| |
| </div>
| |
| <div class="tile-halves">
| |
| <div class="tile-top tile-image">[[File:Droprates.png|link=Drop Rates]]</div>
| |
| <div class="tile-bottom link-button"><h2>[[Drop Rates]]</h2></div>
| |
| </div>
| |
| <div class="tile-halves">
| |
| <div class="tile-top tile-image">[[File:Exprates.png|link=Experience Rates]]</div>
| |
| <div class="tile-bottom link-button"><h2>[[Experience Rates]]</h2></div>
| |
| </div> | | </div> |
| <div class="tile-halves"> | | <div class="contents-guides tile-halves"> |
| <div class="tile-top tile-image">[[File: Gamemodes.png|link= Game Modes]]</div> | | <div class="tile-top tile-image">[[File: challenges.png|link= Challenges]]</div> |
| <div class="tile-bottom link-button"><h2>[[ Game Modes]]</h2></div> | | <div class="tile-bottom link-button"><h2>[[ Challenges]]</h2></div> |
| </div> | | </div> |
| <div class="tile-halves"> | | <div class="contents-guides tile-halves"> |
| <div class="tile-top tile-image">[[File: Minigames.png|link= Minigames]]</div> | | <div class="tile-top tile-image">[[File: robot.png|link= Auto-Leveling]]</div> |
| <div class="tile-bottom link-button"><h2>[[ Minigames]]</h2></div> | | <div class="tile-bottom link-button"><h2>[[ Auto-Leveling]]</h2></div> |
| </div> | | </div> |
| <div class="tile-halves"> | | <div class="contents-guides tile-halves"> |
| <div class="tile-top tile-image">[[File: Slayer.png|link= Slayer]]</div> | | <div class="tile-top tile-image">[[File: ironman.png|link= Game Modes]]</div> |
| <div class="tile-bottom link-button"><h2>[[ Slayer]]</h2></div> | | <div class="tile-bottom link-button"><h2>[[ Game Modes]]</h2></div> |
| </div> | | </div> |
| <div class="tile-halves"> | | <div class="contents-quests tile-halves"> |
| <div class="tile-top tile-image">[[File: Home.png|link= Home Area]]</div> | | <div class="tile-top tile-image">[[File: Minigames.png|link= Minigames]]</div> |
| <div class="tile-bottom link-button"><h2>[[ Home Area]]</h2></div> | | <div class="tile-bottom link-button"><h2>[[ Minigames]]</h2></div> |
| </div> | | </div> |
| <div class="tile-halves"> | | <div class="contents-bestiary tile-halves"> |
| <div class="tile-top tile-image">[[File: Upgrades.png|link= Item Upgrades]]</div> | | <div class="tile-top tile-image">[[File: slayer.png|link= Slayer]]</div> |
| <div class="tile-bottom link-button"><h2>[[ Item Upgrades|Item Upgrades]]</h2></div> | | <div class="tile-bottom link-button"><h2>[[ Slayer]]</h2></div> |
| </div> | | </div> |
| <div class="tile-halves"> | | <div class="contents-minigames tile-halves"> |
| <div class="tile-top tile-image">[[File: Skillguides.png|link= Skills]]</div> | | <div class="tile-top tile-image">[[File: scythe.png|link= Gear Progression]]</div> |
| <div class="tile-bottom link-button"><h2>[[ Skill Guides]]</h2></div> | | <div class="tile-bottom link-button"><h2>[[ Gear Progression]]</h2></div> |
| </div> | | </div> |
| <div class="tile-halves"> | | <div class="contents-minigames tile-halves"> |
| <div class="tile-top tile-image">[[File: Skillzone.png|link= Skilling Area]]</div> | | <div class="tile-top tile-image">[[File: upgrade.png|link= Upgrade Anvil]]</div> |
| <div class="tile-bottom link-button"><h2>[[ Skilling Area]]</h2></div> | | <div class="tile-bottom link-button"><h2>[[ Upgrade Anvil]]</h2></div> |
| </div> | | </div> |
| </div>
| |
| </div> | | </div> |
