Terraria Wiki

  • Discussions are now available on the Terraria Wiki.
  • Miss the old Hydra Skin? Try out our Hydralize gadget! Visit the preferences page while logged in and turn on the gadget.

READ MORE

Terraria Wiki
Advertisement

View this page in other languages: Deutschfrançaismagyar한국어polskiportuguêsрусскийукраїнська中文


CSS and JavaScript changes must comply with the wiki design rules.


Note: After saving, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* CSS placed here will only affect users of the FandomDesktop skin */

.theme-fandomdesktop-light {
	--theme-page-text-color: #000;
	--theme-page-text-color--rgb: 0,0,0;
	--theme-accent-label-color: #063b5e;
	--theme-page-background-color--secondary: #f5f5f5;
	--theme-border-color: #b3b3b3;
}
.theme-fandomdesktop-dark {
	--theme-accent-label-color: #fff;
	--theme-page-background-color--secondary: #1e1f28;
	
	--custom-accent-border-color: var(--theme-accent-color--hover);

	--custom-note-dark-color: #bbb;
	--custom-note-light-color: #ddd;

	--custom-notice-blue-background-color: var(--theme-accent-color);
	--custom-notice-blue-border-color: var(--custom-accent-border-color);
	--custom-notice-red-background-color: hsl(0, 80%, 12%);
	--custom-notice-red-border-color: hsl(0, 80%, 26%);
	--custom-notice-purple-background-color: hsl(228, 80%, 12%);
	--custom-notice-purple-border-color: hsl(243, 80%, 26%);
	--custom-notice-green-background-color: hsl(84, 80%, 12%);
	--custom-notice-green-border-color: hsl(84, 80%, 26%);
	--custom-notice-yellow-background-color: hsl(58, 80%, 12%);
	--custom-notice-yellow-border-color: hsl(58, 80%, 18%);
	--custom-notice-orange-background-color: hsl(28, 80%, 12%);
	--custom-notice-orange-border-color: hsl(28, 80%, 26%);
	--custom-notice-pink-background-color: hsl(324, 80%, 12%);
	--custom-notice-pink-border-color: hsl(324, 80%, 26%);

	--custom-template-expert-color: #ffba75;

	--custom-modetabs-expert-background-color: #594634;
	--custom-modetabs-expert-border-color: #847457;
	--custom-modetabs-expert-label-color: #fff;
	--custom-modetabs-master-background-color: #6a3d3f;
	--custom-modetabs-master-border-color: #a45e5e;
	--custom-modetabs-master-label-color: #fff;
}

/* Rubik font is blurred and hard to read.
 * Helvetica font looks weird under 14px+bold.
 * Align with Hydra.
 */
.resizable-container,
.page-content h1, .page-content h2, .page-content h3, .page-content h4, .page-content h5, .page-content h6,
.fandom-sticky-header,
#WikiaBar,
.search-modal,
.ve-fd-header{
    font-family: sans-serif; 
}

/* temp fix for redlink error */
a[classname~="new"] {
    color: var(--theme-alert-color);
}

/* fix position:fixed issue for touch screen */
html, body{
	overflow: auto;
}

/* ================================================================== */
/* Dark theme-specific styles */
/* ================================================================== */

/* Make certain icons and logos more visible */
.theme-fandomdesktop-dark .math-image,
.theme-fandomdesktop-dark .mwe-math-fallback-image-inline,
.theme-fandomdesktop-dark .sound-title::after,
.theme-fandomdesktop-dark img[data-image-name*="Playstation"], /* For Playstation 3, Playstation 4, etc */
.theme-fandomdesktop-dark img[data-image-name="PS.svg"],
.theme-fandomdesktop-dark img[data-image-name="Amazon.svg"],
.theme-fandomdesktop-dark img[data-image-name="Android.svg"],
.theme-fandomdesktop-dark img[data-image-name="Pickaxe mask.png"],
.theme-fandomdesktop-dark img[data-image-name="Axe mask.png"],
.theme-fandomdesktop-dark img[data-image-name="Hammer mask.png"],
.theme-fandomdesktop-dark img[data-image-name="Auto icon.png"] {
	filter: hue-rotate(180deg) invert(100%);
}
.theme-fandomdesktop-dark img[data-image-name="3DS.svg"] {
	filter: hue-rotate(180deg) invert(100%) saturate(450%) contrast(150%);
}
.theme-fandomdesktop-dark img[data-image-name="Tux.svg"] {
	filter: drop-shadow(0 0 1px #f2f2f2);
}

/* More visible +byte diff */
.theme-fandomdesktop-dark .mw-plusminus-pos {
	color: var(--theme-success-color);
}
/* More visible -byte diff */
.theme-fandomdesktop-dark .mw-plusminus-neg {
	color: var(--theme-alert-color);
}

/* ================================================================== */
/* Main layout */
/* ================================================================== */

/* Override background set in Common.css */
html body {
	background-image: none;
	background-color: var(--theme-body-background-color);
	font-size: 14px;
}
div#content {
	background-color: unset;
	color: unset;
	border-top: 0;
	border-bottom: 0;
	margin-right: unset;
	line-height: calc(24/14); 
}
@media(max-width:980px) {
	div#content {
		margin: auto;
	}
}
.page-content p, .page-content section{
	line-height: calc(24/14); 
}
.page-content h1, .page-content h2, .page-content h3, .page-content h4, .page-content h5, .page-content h6{
	margin: 0.5em 0;
	padding: 0;
	align-items: center;
}
.page-content h2{
	margin-top: 0.75em;
}
.page-content li{
	margin-bottom: 1px;
}

.community-header-wrapper{
	height: 120px;
	font-size: 16px;
}
.fandom-community-header__top-container{
	padding-bottom: 6px;
}
.community-header-wrapper .wds-tabs__tab-label{
	height: 28px;
}
.fandom-community-header__community-name, .page-counter{
	text-shadow: 0 0 5px rgba(0,0,0,0.4);
}
.fandom-community-header .wiki-tools{
	box-shadow: 0 0 5px rgba(0,0,0,0.4);
}
.fandom-community-header .wiki-tools > .wds-button{
	box-shadow: inset 0 0 5px rgba(0,0,0,0.4);
}
/* Increase max width of local nav dropdowns (to prevent advanced mechanics/guides from wrapping) */
.fandom-community-header__local-navigation .wds-dropdown__content,
.fandom-community-header__local-navigation .wds-dropdown__content .wds-list.wds-is-linked .wds-dropdown-level-2 .wds-dropdown-level-2__content {
	max-width: 220px;
}

table {
	border-collapse: separate;
}

code {
	background-color: var(--theme-page-background-color);
	border: 1px solid rgba(var(--theme-border-color--rgb), 0.75);
	border-radius: 2px;
	padding: 1px 4px;
}
/* hydra style selflink */
.page-content .mw-parser-output a.mw-selflink{
	color: currentColor;
	font-weight: bold;
	text-decoration: none;
}

/* Restore Hydra-style terraria tables */
.terraria {
	border-spacing: revert;
}
.terraria > caption:after {
    width: calc(100% + 8px); /* captions have a 4px border on each side */
}

.oo-ui-textInputWidget-type-text > input.oo-ui-inputWidget-input,
.oo-ui-textInputWidget-type-search > input.oo-ui-inputWidget-input {
	border-radius: 0;
	border-width: 1px;
}

/* Slightly increase margin between "x pages" counter and wiki tool buttons */
.page-counter {
	margin-right: 16px;
}

/* Style QuickBar buttons for logged-out users */
.WikiaBarWrapper .wikia-bar-anon .wikiabar-button {
	background-color: transparent;
	border: none;
	color: var(--theme-accent-label-color);
	line-height: inherit;
}

.oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElemenrect-progressive > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button,
.oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus, .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button
{
	border-color: currentColor;
}
.oo-ui-tagItemWidget{
	box-sizing: content-box;
}

/* Less space between history entries in the page history */
#pagehistory li {
	margin-bottom: 2px;
	padding: 0 1px;
}
#pagehistory li.selected{
	border-style: dashed;
}

.page-header__subtitle .mw-history-subtitle{
	display: inline;
}

img.lazyloaded {
    transition: opacity 0s;
}

/* ================================================================== */
/* Page layout */
/* ================================================================== */
@media only screen and (min-width:1024px) {
	html:not(.ve-activated) .page.has-right-rail .page__main {
	    border-radius: 3px;
	}
	html:not(.ve-activated) .page.has-right-rail .page__right-rail{
		margin-left: -3px;
	}
	html:not(.ve-activated) .page.has-right-rail .page__right-rail.is-rail-hidden {
	    width: 0px;
	}
}
@media only screen and (max-width:1023px) {
	html:not(.ve-activated) .page.has-right-rail .page__right-rail {
	    margin-top: -3px;
	    position: relative;
	    overflow: hidden;
	}
	html:not(.ve-activated) .page.has-right-rail .page__right-rail .right-rail-toggle{
		display: flex;
	}
	.right-rail-toggle{
		width: 28px;
		transform: rotate(270deg);
		top: -4px;
		right: 12px;
		transition: .3s;
	}
	.right-rail-toggle:hover {
		right: 8px;
	}
	html:not(.ve-activated) .page.has-right-rail .page__right-rail.is-rail-hidden {
	    padding: 6px 18px;
	    height: 32px;
	}
	.is-rail-hidden .right-rail-toggle {
    	background-color: rgba(var(--theme-page-dynamic-color-1--rgb),.1);
    	right: 12px;
	}
	.is-rail-hidden .right-rail-toggle:hover {
		right: 8px;
	}
}
@media only screen and (min-width:769px) and (max-width:1279px){
	.fandom-community-header .fandom-community-header__local-navigation .medium-navigation{
		display: none;
	}
	.fandom-community-header .fandom-community-header__local-navigation .large-navigation{
		display: flex;
	}
}
@media only screen and (max-width:600px) {
	.rail-module__list.activity-items{
		grid-template-columns: 100%;
	}
}
@media only screen and (max-width:600px) {
	.rail-module__list.activity-items{
		grid-template-columns: 100%;
	}
}


.page__main{
	padding: 24px;
	padding-top: 16px;
	box-shadow: 0 0 4px rgba(255,255,255,0.25);
}
.page-side-tool{
	box-shadow: 0 0 6px 0 rgba(0,0,0,.25);
	width: 32px;
	height: 32px;
}
.is-content-expanded .resizable-container{
	width: auto;
	margin-left: 24px;
	margin-right: 16px;
}
@media only screen and (max-width:1279px) {
 .page-side-tools__wrapper {
	transform:translateX(-50%);
 }
}

.page-footer{
	margin-top: 2em;
}
.page-footer__languages{
	display: block;
	border: 0;
	padding: 1em 0;
}
.page-footer .page-footer__languages > *{
	padding: 0;
	display: inline-flex;
}
.page-footer .page-footer__languages header{
	font-size: inherit;
}
.page-footer .page-footer__languages header:after{
	content: ":";
}
.page-footer .page-footer__languages header svg{
	display: none;
}
.page-footer__languages.wds-collapsible-panel.wds-is-collapsed .wds-collapsible-panel__content{
	padding: 0;
	display: inline-flex;
}
.page-footer__categories{
	border-bottom: 0;
	margin-top: -1em;
}
.page-footer__categories header{
	display: none;
}
.page-footer__categories.wds-collapsible-panel.wds-is-collapsed .wds-collapsible-panel__content{
	display: block;
}
#articleCategories .container{
    padding: 5px 8px;
    background-color: var(--theme-accent-color);
    border: 1px ridge var(--theme-border-color);
    border-radius: .3em;
    font-size: inherit;
}
.CategorySelect.articlePage .categories{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	font-size: 14px;
}
#articleCategories .container li {
    padding: 0 0.5em 0 0;
    flex: 0 0 auto;
    margin: 3px 0.5em 3px 0;
}
#articleCategories .container li > *{
	vertical-align: middle;
}
.CategorySelect.articlePage .category, .CategorySelect.articlePage .last, .CategorySelect.articlePage .placeholder, .CategorySelect.articlePage .special-categories-label{
	float: none;
}
#articleCategories.CategorySelect.articlePage .special-categories-label{
	padding: 0;
	border-right: 0;
}
#articleCategories.CategorySelect.articlePage .special-categories-label::after{
	content: ':';
	vertical-align: middle;
}
.CategorySelect.articlePage .add{
	font-size: 10px;
	line-height: 12px;
	padding: 2px 10px;
	min-height: 0;
}
#articleCategories.CategorySelect.articlePage .last input{
	margin-bottom: 0;
	line-height: 1;
	vertical-align: middle;
}
.CategorySelect.articlePage > .toolbar{
	margin-top: 6px;
}

.page-header__title-wrapper{
	display: flex;
	flex-direction: column;
}
.page-header__title-wrapper > h1{
	order: 2;
}
.page-header__title-wrapper > .page-header__page-subtitle{
	order: 1;
	line-height: 1;
}
.page-header__actions{
	align-items: flex-end;
	padding-bottom: 3px;
}

/* ================================================================== */
/* Page content */
/* ================================================================== */

.page-header {
	margin-bottom: 1rem;
}

.page-header__bottom {
	border-bottom: 1px solid var(--theme-border-color);
}

/* Reduce size of categories on the top and bottom of pages */
.page-header__categories,
.CategorySelect.articlePage {
	font-size: 85%;
}

.page-content dl {
	margin: 0;
}

/* Prevent links from being bolded */
.page-content .mw-parser-output a {
	font-weight: revert;
}

.page-content section {
	margin: 0;
}
.page-content p{
	margin: 0.5em 0;
}


/* Restore thin <hr/> */
.page-content hr {
	border-top: 0;
	border-color: var(--theme-border-color);
	margin-top: 0;
	margin-bottom: 0;
}

.catlinks {
	padding: 4px;
}

/* Hide empty list items */
.mw-hide-empty-elt .mw-empty-elt {
	display: none;
}

.oo-ui-dialog-content {
	color: var(--theme-page-text-color);
}
.oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
	border-right-color: var(--theme-border-color);
}

.mw-notification {
	background-color: var(--theme-page-background-color--secondary);
	border-color: var(--theme-border-color);
}

/* Match side rail font size with page content */
.WikiaRail .sticky-modules-wrapper {
	font-size: 14px;
}

/* Fix Fan Feed title being black in dark theme */
#mixed-content-footer .mcf-header {
	color: var(--theme-page-text-color);
}

/* ================================================================== */
/* Special pages */
/* ================================================================== */

/* Special:RecentChanges */
.mw-special-Recentchanges .page-header__languages{
	margin-bottom: -33px; /*languages box space*/
}
.client-js .mw-recentchanges-toplinks:not(.mw-recentchanges-toplinks-collapsed),
.mw-rcfilters-ui-changesListWrapperWidget-previousChangesIndicator {
	border-top-color: var(--theme-border-color);
}
.client-js .mw-recentchanges-toplinks:not(.mw-recentchanges-toplinks-collapsed) {
	border-color: var(--theme-border-color);
	margin-left: 0;
}
.mw-rcfilters-ui-overlay .oo-ui-popupWidget-popup{
	padding: 1em;
}
.mw-rcfilters-ui-overlay .oo-ui-popupWidget-popup .oo-ui-buttonElement > .oo-ui-buttonElement-button{
	padding: 3px 5px;
}
.ooui-theme-fandomooui .mw-rcfilters-ui-overlay {
    font-size: 14px;
}

/* Special:Analytics */
.analytics_theme_hydra  .analytics_confidential {
	background-color: var(--theme-accent-color);
	color: var(--theme-page-text-color);
}
.analytics_theme_hydra .analytics_table td:first-child a:any-link {
	color: var(--theme-link-color);
}
.theme-fandomdesktop-dark #analytics_grid canvas {
	filter: invert(100%) hue-rotate(180deg);
}

/* ================================================================== */
/* Templates */
/* ================================================================== */

.page-content .infobox {
    background-color: var(--theme-page-background-color);;
    padding: 6px;
    clear: none; /*align with hydra, so infobox templates will work properly.*/
}

/* All portable infoboxes */
.portable-infobox .pi-title {
	padding: 5px;
}
.portable-infobox .pi-header {
	font-size: 12px;
}
.portable-infobox .pi-collapse .pi-header:first-child::after {
	right: 12px;
}

/* Template:Only4theme */
.theme-fandomdesktop-light .theme-special:not(.light) {
	display: none;
}
.theme-fandomdesktop-dark .theme-special:not(.dark) {
	display: none;
}

/* Template:Drop infobox */
/* Move the sort arrows to the left of the text for the first two headings (they're on the right by default) */
.drop.infobox th:first-child.headerSort::after,
.drop.infobox th:nth-child(2).headerSort::after {
	left: 6px;
}

/* Template:Templatedata */
.templatedata-doc .templatedata-doc-param-valuetrue {
	color: #050;
}
.templatedata-doc .templatedata-doc-param-valuefalse {
	color: #610;
}
.theme-fandomdesktop-dark .templatedata-doc .templatedata-doc-param-valuetrue {
	color: #090;
}
.theme-fandomdesktop-dark .templatedata-doc .templatedata-doc-param-valuefalse {
	color: #df2500;
}

/* Template:Hp */
.hp > div > * {
	box-sizing: content-box;
}

/*image*/
figure.thumb{
    border: 1px solid var(--theme-border-color);
    padding: 3px;
    border-radius: 5px;
    box-sizing: content-box;
}

/* ================================================================== */
/* Editor fixes */
/* ================================================================== */
.wikiEditor-ui .wikiEditor-ui-view.wikiEditor-ui-view-wikitext .wikiEditor-ui-top{
	min-height: inherit;
}
.wikiEditor-ui .wikiEditor-ui-toolbar {
	background-color: var(--theme-page-background-color);
	padding: 0;
}
.wikiEditor-ui .wikiEditor-ui-toolbar .sections .section
{
	margin-top: 0;
	padding-top: 0;
}
.wikiEditor-ui .wikiEditor-ui-view {
	border-color: var(--theme-border-color);
}
.wikiEditor-ui #msupload-div{
	border-radius: 0;
}
.wikiEditor-ui-bottom{
	border-left: 1px solid var(--theme-border-color);
	border-right: 1px solid var(--theme-border-color);
}
#wpTextbox0, #wpTextbox1{
	border: 0 !important;
}
.mw-editform .editOptions {
	padding: 1em 1em 1.5em 1em;
	margin-bottom: 2em;
}
.codeEditor-status {
	border: 1px solid var(--theme-border-color);
	border-bottom: 0;
}
.codeEditor-status-message {
	border-left-color: var(--theme-border-color);
	border-right-color: var(--theme-border-color);
}

/* ================================================================== */
/* Main page */
/* ================================================================== */

body.mainpage .page__main {
	padding-top: 12px;
}
body.mainpage .page-header {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin-bottom: 0;
}
body.mainpage .page-header__bottom {
	border-bottom: 0;
}
body.mainpage .page-header__title-wrapper {
	display: none;
}
body.mainpage #ca-edit {
	display: none;
}
body.mainpage .page-header__languages .wds-dropdown__toggle,
body.mainpage .page-header__variants .wds-dropdown__toggle {
	margin-bottom: 0;
}
body.mainpage .page-header__actions {
	margin-left: 3px;
	padding-top: 0;
}
Advertisement