2021 Main Page Design

:If you're looking for our older main page design, see 2020 Main Page Design.
The 2021 Main Page Design is a full and modern design for the wiki main page. It uses the Rubik font and modern-looking boxes with a color scheming really similar to the wiki (although the accent color has to be adjusted to each box).
The design is also compatible for UCX for both the light and dark themes of a wiki.
Some of the smaller/less active wikis, or at least wikis with bad main page designs, that go under JustLeafy's radar, may have their main page design converted to this one if left unprotected. Sometimes, permission would be asked for using this design in a more active community. Any admins left on those wikis, however, can feel free to change the design of their main page if needed.
== Differences ==
A few key differences between this and the 2020 Main Page Design is that this main page design uses headings and the border color as accent colors, while the background is basically a very opaque black, opaque enough to practically look like a different shade of the wiki's page background color, so links don't need to be restyled to a different color. Moreover, the welcome mat shows statistics, no background, and more, and the modules uses Fandom's modern-style icons.
== Features ==
*Welcome mat (left column)
*Information for the main topic (left column)
*Navigation (left column)
*Featured article (right column)
*Discussions
== Instructions ==
=== Icons and styles ===
Before using this main page design, make sure to use Unai01's FandomIcons stylesheet from the Fandom Developers Wiki. If you're an administrator on your wiki, make sure to copy and paste the following import in your wiki's MediaWiki:Common.css page.
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:FandomIcons.css&only=styles";
Next, try testing out the icons in a sandbox page if necessary, so that you can learn how to output Fandom icons. Use the Fandom Design System assets page for a full list of icons with their names.
What you need to do is put the name of the desired icon (for example, the "info" icon can be displayed by using the following code):
info
It outputs the following:
info
=== Designing the main page ===
If your wiki isn't blue and white/default-themed, you'll have to make adjustments for the colors.
*Try opening developer tools (inspect element) on the current browser you're using, then right-click on the "Edit" button, the header, or any element with an accent color, then use the color picker (this varies by the inspect element tool by browsers, because for example, Firefox has a color picker button and no colored square before the hex code in the styles, while Chrome has a colored square before the hex code).
*Copy that hex code and paste it while replacing the current hex code on all of the opening tags. Use "CTRL+F" to locate all of the targetted old hex code.
Next, press "CTRL+F" and type in the name of the topic that was copied from this main page design and replace it with the name of the topic of the wiki you're using this page on.
Finally, the rest is up to you. Make sure to add other content inside the tags, like information about the main topic, the navigation, or a featured article. You're definitely free to add/remove sections however you like.
If you're stuck with something or need help, contact JustLeafy.
== Sample ==
Here is the code used on the MrBeast Wiki's main page.
<mainpage-leftcolumn-start />
Welcome to the...
MRBEAST WIKI
Founded by DarkUnknownWarrior on February 13, 2018
Adopted by JustLeafy on October 2, 2020
pages  {{NUMBEROFARTICLES}} articles      images  {{NUMBEROFFILES}} files      pencil  {{NUMBEROFEDITS}} edits
<!-- Wiki Description Module -->
info   ABOUT THE WIKI
This is an encyclopedic resource of everything about [[MrBeast]] that anybody can edit! This wiki includes documentation on MrBeast along with his crew members, affiliates, YouTubers he collaborated with, projects, video plot summaries, challenge results, and more!
Note that we are not endorsed with MrBeast or any affiliates. Also, pages for MrBeast's videos, especially the ones that are expensive challenges, contain results and spoilers, so read at your own risk. Moreover, some articles (in particular, the ones about MrBeast's old videos) may contain strong or inappropriate language that is not suitable for younger viewers.
<!-- MrBeast Information Module -->
question   WHO IS MRBEAST?
[[File:MrBeastLogo.jpg|thumb]]
Jimmy Donaldson (born: {{birthdate|1998|5|7}}), mainly known by the name MrBeast (formerly known as MrBeast6000), is an American YouTuber residing in Greenville, North Carolina.
He is currently known for doing a wide variety of [[:Category:Expensive challenges|expensive challenge videos that reward thousands of dollars]], [[:Category:Donation videos|donation videos involving a lot of money]], [[:Category:Challenge videos|videos either with arduous tasks or survival]], [[:Category:Creative videos|original vlogging videos]] and more.
He started this channel in 2012 at the age of 13. He was initially known for uploading the "Worst Intros" series, a series of videos where he laughed at kids with worst intros, but this series was entirely deleted because they don't reflect his genuine passion and personality later on. Over the years, as he gained more sponsor money, he became a lot more generous and helpful to others.
With unrelenting passion and devotion to finishing arduous, yet creative, challenges, Jimmy has become an extremely popular YouTuber in recent years, and one of the most subscribed non-corporate YouTube channels, having over 45 million subscribers as of middle October 2020. His main channel is the 23rd most subscribed channel in the world and the 10th most subscribed channel in the United States.
[[MrBeast|book   READ MORE]]
<!-- Beast Gang Navigation -->
users   BEAST GANG
<gallery hideaddbutton="true" position="center" spacing="small" columns="4" orientation="square" widths="150" bordersize="none">
BeastPortrait.png|link=MrBeast|[[MrBeast|JIMMY DONALDSON (MRBEAST)]]
Chris.jpg|link=Chris Tyson|[[Chris Tyson|CHRIS TYSON]]
Chandler Hallow.png|link=Chandler Hallow|[[Chandler Hallow|CHANDLER HALLOW]]
JouH8iB- 400x400.jpg|link=Karl Jacobs|[[Karl Jacobs|KARL JACOBS]]
</gallery>
<!-- Did You Know That -->
question   DID YOU KNOW THAT
*Chris owns 4 cats?
*MrBeast helped a lot of struggling restaurants by buying them and make them work for MrBeast Burger?
*MrBeast has invested two million dollars into helping smaller creators?
*Karl made his first real physical appearance in MrBro and not in MrBeast?
*Karl had been attending college, and 5 weeks before he was to graduate, he had been offered a job with MrBeast, which eventually led to him dropping out of college and taking the opportunity?
<mainpage-endcolumn />
<mainpage-rightcolumn-start />
<!-- Discord server -->
discord   Discord Server
Whether it could be used for discussing MrBeast, the wiki, or just chatting in an off-topic manner and for fun, all of this is available in our official Discord server!
Get Invite
<!-- Featured Article -->
pin   FEATURED ARTICLE: JEFF
[[File:Jeff.png|thumb|center|250px]]
Jeff, or Jeff Island, officially known and named as Golding Cay Island or simply Golding Cay, is the island that was bought by [[MrBeast]]. It was mentioned in [[I Spent $1,000,000 on Lottery Tickets and WON]] and it appeared in [[I Bought a Private Island]], as well as [[Last to Leave $800,000 Island Keeps It]], where [[Chandler]] accomplished a whole series of challenges to win this island as a reward. However, eventually, he had to sell this island because he couldn't pay the taxes.
[[Jeff|book   READ MORE]]
<!-- External Links -->
external   External Links
Make sure to check out the external links and social media of MrBeast!
*youtube YouTube channel
*instagram Instagram
*twitter Twitter
*TikTok
*discord Discord server
*reddit Reddit
<mainpage-endcolumn />
[[Category:{{SITENAME}}]]
== Wikis that will soon use this design () ==
This is a wide variety of these wikis that are going to have this main page design by JustLeafy. All of these wikis are either smaller/abandoned wikis or wikis founded by JustLeafy.
Category:Code