User:Timbre/monobook.css
From Guild Wars 2 Wiki
Jump to navigationJump to search
Note: After publishing, 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 / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/**MONOBOOK.CSS only changes**/ /*General body setup*/ @font-face { font-family: 'EasonPro'; src: url('https://d1h9a8s8eodvjz.cloudfront.net//fonts/eason/v1/easonpro-regular-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'EasonPro'; src: url('https://d1h9a8s8eodvjz.cloudfront.net//fonts/eason/v1/easonpro-italic-webfont.woff') format('woff'); font-weight: normal; font-style: italic; } @font-face { font-family: 'EasonPro'; src: url('https://d1h9a8s8eodvjz.cloudfront.net//fonts/eason/v1/easonpro-bold-webfont.woff') format('woff'); font-weight: bold; font-style: normal; } @font-face { font-family: 'CronosPro'; src: url('https://d1h9a8s8eodvjz.cloudfront.net//fonts/cronos/v1/cronospro-regular-webfont.woff') format('woff'); font-weight:normal; font-style:normal; } @font-face { font-family: 'CronosPro'; src: url('https://d1h9a8s8eodvjz.cloudfront.net//fonts/cronos/v1/cronospro-italic-webfont.woff') format('woff'); font-weight:normal; font-style:italic; } @font-face { font-family: 'CronosPro'; src: url('https://d1h9a8s8eodvjz.cloudfront.net//fonts/cronos/v1/cronospro-semibold-webfont.woff') format('woff'); font-weight:bold; font-style:normal; } @font-face { font-family: 'CronosPro'; src: url('https://d1h9a8s8eodvjz.cloudfront.net//fonts/cronos/v1/cronospro-semibolditalic-webfont.woff') format('woff'); font-weight:bold; font-style:italic; } body { font-size: 0.75em; line-height: 1.333em; background-color: #fff; background-image: none; width:100%; height: auto; min-height: 100%; position:absolute; } #p-logo a, #p-logo a:hover { width:11em; background-image: url(images/6/6f/User_Alfa-R_logo.png) !important; } #p-logo { height: 160px; margin: 0; width:11em; background-color: transparent; } /*Rhythmic text sizes and grid leading*/ h1, h2, h3, h4 { font-family: "EasonPro", Helvetica, Arial, sans-serif !important; font-weight: normal; } h5, h6 { font-weight: bold; } h1, h2, h3, h4, h5, h6 { line-height: 1em; } h1 { font-size: 1.8em; margin-top: 0.4814814815em; margin-bottom: 0.3703703704em; padding: 0; } h2 { font-size: 1.6666666667em; margin-top: 0.6em; margin-bottom: 0.4em; padding: 0; } h3 { font-size: 1.5333333333em; margin-top: 0.7391304348em; margin-bottom: 0.4347826087em; padding: 0; } h4 { font-size: 1.4em; margin-top: 0.9047619048em; margin-bottom: 0.4761904762em; padding: 0; } h5 { font-size: 1.2666666667em; margin-top: 0.5789473684em; margin-bottom: 0.5263157895em; padding: 0; } h6 { font-size: 1.1333333333em; margin-top: 0.7647058824em; margin-bottom: 0.5882352941em; padding: 0; } p, ul, ol, dl, dd, dt, li { margin-top: 0.6666666667em; margin-bottom: 0.6666666667em; line-height: 1.3333333333em; } dd, dt, li, .ns-talk #bodyContent p { margin-top: 0; margin-bottom: 0; } sup, sub { line-height: 0; } div#globalWrapper, input, select { font-family: "CronosPro", Helvetica, Arial, sans-serif; line-height: 1.333em; } input, select { font-size: 15px; } div#column-content { background-image: url(images/1/15/User_Alfa-R_skin_header.png); background-position: top left; background-repeat: no-repeat; background-color:transparent; z-index: 1; width: 100%; margin-bottom:5.5em; position:relative; min-height:249px; } #content { margin-top: 3em; margin-left: 11em; box-shadow: rgba(0, 0, 0, 0.25) 0 0.1em 0.75em; border: 1px solid #aaa; border-radius: 0 0 0 0.5em; } #footer { border:0px; background-color: #cfcfcf; background-image: url(images/4/4f/User_Alfa-R_skin_footer.jpg); background-position: top left; background-repeat: repeat-x; margin:0; padding: 6.665em 0 0.665em; width: 100%; height: 4.5em; z-index:0; position:fixed; bottom:0; left:0; } #footer div#f-poweredbyico, #footer div#f-copyrightico { float:left; clear:left; width:10em; } #footer div#f-poweredbyico { top: 2.5em; } #f-list { margin: 0 1.071em 0 12.857em; padding: 0; } #p-personal { text-align:right; z-index: 2; } #p-personal .pBody { width:auto; display:inline-block; padding-right:0.75em; border-radius: 0 0 0 0.5em; background-color: #fff; z-index: 2; } #p-personal ul { padding:0; } #p-personal li a { color: #002bb8; } #p-personal li a:hover { padding: 0; } li#pt-userpage { background: none; padding-left: 0px !important; } #p-cactions { top:1.8em; left:11em; font-size:1em; width:auto; padding:0; z-index: 2; margin:-1px 0; } #p-cactions ul { margin: 0; } #p-cactions li.selected, #p-cactions li { padding:0; height:1.2em; line-height:1.2em; display: inline-block; } #p-cactions li { background-image: linear-gradient(top, #ddd 0%, #eee 100%); background-image: -o-linear-gradient(top, #ddd 0%, #eee 100%); background-image: -moz-linear-gradient(top, #ddd 0%, #eee 100%); background-image: -webkit-linear-gradient(top, #ddd 0%, #eee 100%); background-image: -ms-linear-gradient(top, #ddd 0%, #eee 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ddd), color-stop(1, #eee)); border-radius: 0.536em 0.536em 0 0; border: 1px solid #aaa; } #p-cactions li.selected { border-color: #aaa; background-image: none; } #p-cactions li.istalk { margin: 0 0.3em 0 0; } #p-cactions li a, #p-cactions li a:hover, #p-cactions li.istalk a, #p-cactions #ca-addsection a { padding: 0 1em; border-radius: 0.536em 0.536em 0 0; } #p-cactions li.selected a { border-radius: 0.536em 0.536em 0 0; color: #000; } #p-cactions li a { background-color: transparent; } #p-cactions .pBody { padding:0; margin:0; } .portlet { width:10em; z-index: 1; position: relative; } .generated-sidebar.portlet, #p-tb, #p-search { font-size: 1em; margin: 0.429em 0.5em 0; background: white; border-radius:0.5em; } .portlet .pBody, #p-search .pBody { border:0; margin: 0 0.5em; padding: 0.333em; line-height: 1.4285714286em; } .pBody ul, .pBody li { line-height: 1.4285714286em; } .portlet h5 { text-transform: uppercase; font-weight: bold; color: #000; font-size: 1em; margin: 0 0.5em; display:block; border-bottom: solid 1px #999; padding: 0.333em 0; } .portlet ul { margin:0 0 0 1em; } #searchInput { width: 9.333em; } .editsection { font-family: "CronosPro", Helvetica, Arial, sans-serif; font-size: 14px !important; } #bodyContent h1:hover, #bodyContent h2:hover, #bodyContent h3:hover, #bodyContent h4:hover, #bodyContent h5:hover, #bodyContent h6:hover { background-image: linear-gradient(left, #fff 0%, #eee 100%); background-image: -o-linear-gradient(left, #fff 0%, #eee 100%); background-image: -moz-linear-gradient(left, #fff 0%, #eee 100%); background-image: -webkit-linear-gradient(left, #fff 0%, #eee 100%); background-image: -ms-linear-gradient(left, #fff 0%, #eee 100%); background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #fff), color-stop(1, #eee)); } textarea, pre, xmp, plaintext, listing { font-size: 100%; font-family: monospace; } pre, xmp, plaintext, listing { white-space: pre-wrap; } /**COMMON CHANGES**/ /**MAIN PAGE STYLESHEET**/ #mainpagenavigation { box-shadow: rgba(0, 0, 0, 0.5) 0 0 0.75em; border-collapse:collapse; text-align:left; } #mainpagenavigation th { font-family: "EasonPro", Helvetica, Arial, sans-serif; font-size: 1.3333em; color: white; text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em; background-color: #444; background-image: url("http://wiki.guildwars2.com/images/4/41/User_Alfa-R_bg_gradient.jpg") !important; font-weight: bold; height: 48px; text-align: center; text-transform: uppercase; } #mainpagenavigation td { background-image: linear-gradient(top, #bbb 0%, #fff 2%, #eee 100%); background-image: -o-linear-gradient(top, #bbb 0%, #fff 2%, #eee 100%); background-image: -moz-linear-gradient(top, #bbb 0%, #fff 2%, #eee 100%); background-image: -webkit-linear-gradient(top, #bbb 0%, #fff 2%, #eee 100%); background-image: -ms-linear-gradient(top, #bbb 0%, #fff 2%, #fff 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #bbb), color-stop(.02, #fff), color-stop(1, #eee)); } #mainpagenavigation td.content { padding: 0.5em 2%; vertical-align: top; } #mainpagenavigation td.content.separator { border-right:#aaa solid 1px; } body.page-Main_Page.ns-subject h1.firstHeading { display:none; } body.page-Main_Page.ns-subject #content, body.page-Main_Page_editcopy.ns-subject #content { padding-left: 0; padding-right: 0; } body.page-Main_Page_editcopy.ns-subject #content h1.firstHeading { margin-left:0.429em; } /**COLORS CLASSES**/ .dark { background-color: #666 !important; } .medium { background-color: #bbb !important; } .light { background-color: #ddd !important; } .lighter { background-color: #eee !important; } .guardian.dark { background-color: #066 !important; } .guardian.medium { background-color: #72C1D9 !important; } .guardian.light { background-color: #BCE8FD !important; } .guardian.lighter { background-color: #cfeefd !important; } .warrior.dark { background-color: #c60 !important; } .warrior.medium { background-color: #FFD166 !important; } .warrior.light { background-color: #FFF2A4 !important; } .warrior.lighter { background-color: #FFF5BB !important; } .engineer.dark { background-color: #630 !important; } .engineer.medium { background-color: #D09C59 !important; } .engineer.light { background-color: #E8BC84 !important; } .engineer.lighter { background-color: #E8C89F !important; } .ranger.dark { background-color: #360 !important; } .ranger.medium { background-color: #8CDC82 !important; } .ranger.light { background-color: #D2F6BC !important; } .ranger.lighter { background-color: #E2F6D1 !important; } .thief.dark { background-color: #933 !important; } .thief.medium { background-color: #C08F95 !important; } .thief.light { background-color: #DEC6C9 !important; } .thief.lighter { background-color: #E6D5D7 !important; } .elementalist.dark { background-color: #c00 !important; } .elementalist.medium { background-color: #F68A87 !important; } .elementalist.light { background-color: #F6BEBC !important; } .elementalist.lighter { background-color: #F6D2D1 !important; } .mesmer.dark { background-color: #606 !important; } .mesmer.medium { background-color: #B679D5 !important; } .mesmer.light { background-color: #D09EEA !important; } .mesmer.lighter { background-color: #D7B2EA !important; } .necromancer.dark { background-color: #063 !important; } .necromancer.medium { background-color: #52A76F !important; } .necromancer.light { background-color: #BFE6D0 !important; } .necromancer.lighter { background-color: #D5EDE1 !important; } .asura.dark { background-color: #63C !important; } .asura.medium { background-color: #a27bf1 !important; } .asura.light { background-color: #aca0eb !important; } .asura.lighter { background-color: #bcb2eb !important; } .charr.dark { background-color: #900 !important; } .charr.medium { background-color: #fe7887 !important; } .charr.light { background-color: #f9a9b1 !important; } .charr.lighter { background-color: #fdccd2 !important; } .human.dark { background-color: #c90 !important; } .human.medium { background-color: #fc3 !important; } .human.light { background-color: #ffe566 !important; } .human.lighter { background-color: #ffffba !important; } .norn.dark { background-color: #069 !important; } .norn.medium { background-color: #75baff !important; } .norn.light { background-color: #b9dcff !important; } .norn.lighter { background-color: #d1ecff !important; } .sylvari.dark { background-color: #060 !important; } .sylvari.medium { background-color: #61e665 !important; } .sylvari.light { background-color: #baf5ba !important; } .sylvari.lighter { background-color: #d3f9d3 !important; } /**CATEGORIES TOOLBAR AND TOC**/ #catlinks, #toc, .toc, #filetoc { border: 1px solid #aaa; background-image: linear-gradient(top, #fff 0%, #eee 100%); background-image: -o-linear-gradient(top, #fff 0%, #eee 100%); background-image: -moz-linear-gradient(top, #fff 0%, #eee 100%); background-image: -webkit-linear-gradient(top, #fff 0%, #eee 100%); background-image: -ms-linear-gradient(top, #fff 0%, #eee 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #eee)); } /**INFOBOXES**/ /*General*/ div.infobox { font-size: 0.933em; margin: 5px 0 5px 5px; background-image: linear-gradient(top, #fff 0%, #eee 100%); background-image: -o-linear-gradient(top, #fff 0%, #eee 100%); background-image: -moz-linear-gradient(top, #fff 0%, #eee 100%); background-image: -webkit-linear-gradient(top, #fff 0%, #eee 100%); background-image: -ms-linear-gradient(top, #fff 0%, #eee 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #eee)); padding: 0; border: 1px solid #aaa; } div.infobox .icon { position:relative; margin: 5px; } div.infobox .icon p { color: #444; font-size: 0.75em; background-color: rgba(255, 255, 255, 0.5); border-radius: 0.75em; margin: 0.4em -0.4em 0.5em; } div.infobox .heading, div.nav .heading { font-family: "CronosPro", Helvetica, Arial, sans-serif !important; font-weight: bold; font-size: 1.214em; background-image: url("http://wiki.guildwars2.com/images/3/39/User_Alfa-R_infobox_hader_overlay.png") !important; box-shadow: rgba(0,0,0,0.25) 0 0.1em 0.6em; line-height: 1.333em; margin: -1px; padding: 6px; text-align: center; } div.infobox .heading { color: white; margin: -1px -1px 5px; background-color: #444; text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em; } div.infobox dt { padding: 2px 8px 2px 3px; } div.infobox table, div.nav table { background-color: transparent; } div.infobox .statistics { font-size: 1.214em; } div.infobox.skill .icon img, div.infobox.armor .icon img, div.infobox.weapon .icon img, div.infobox.item .icon img { box-shadow: #000 0 0 0.75em; } /*Item infoboxes*/ div.infobox.armor dd, div.infobox.weapon dd, div.infobox.item dd { border-color: #c30; } div.infobox.armor .heading, div.infobox.weapon .heading, div.infobox.item .heading { background: #c30; } div.infobox.armor .icon p { margin: 0.4em -0.4em 0.5em; } /*Recipe infobox*/ div.infobox.recipe { width: 250px; float: left; clear: none; margin: 5px 5px 5px 0; vertical-align: top; font-size: 1em; } div.infobox.recipe .heading { font-size: 1.133em; background: #533610; } div.infobox.recipe .wrapper { padding: 0px 10px; } div.infobox.crafting .heading, div.infobox.recipe .heading { background: #533610; } div.infobox.crafting dd, div.infobox.recipe dd { border-color: #533610; } /*NPC infobox*/ div.infobox.npc dd { border-color: #390; } div.infobox.npc .heading { background: #390; } div.infobox.npc .image_wrapper { text-align: center; padding: 0 0 10px 0; } /*Skill and trait infobox*/ div.infobox.skill dd, div.infobox.trait dd { border-color: #999; } div.infobox.skill .heading, div.infobox.trait .heading { background: #444; } /*Effect infobox*/ div.infobox.effect .condition { background: #363; } div.infobox.effect .boon { background: #399; } /*Pet infobox*/ div.infobox.pet dd { border-color: #360; } div.infobox.pet .heading { background: #360; } /* Quest infobox */ div.infobox.quest dd { border-color: #f90; } div.infobox.quest .heading { background: #f90; } /* Area infobox */ div.infobox.area dd { border-color: #306; } div.infobox.area .heading { background: #306; } /*Rune infobox*/ div.infobox.rune { width:275px; } div.infobox.rune dt { width:100px; } div.infobox.rune dd { border-color: #c30; width:100px; } div.infobox.rune .heading { background: #c30; } div.infobox.rune .icon p { margin: 0.4em -0.4em 0.5em; } /**NAV BARS (headings are done with infobox headings)**/ div.nav { position: relative; width: 500px; margin: auto; } div.nav .box { position: relative; font-size: 90%; margin: 5px; padding: 0; border-spacing: 0px; overflow: visible; min-height: 60px; background-image: linear-gradient(top, #fff 0%, #eee 100%); background-image: -o-linear-gradient(top, #fff 0%, #eee 100%); background-image: -moz-linear-gradient(top, #fff 0%, #eee 100%); background-image: -webkit-linear-gradient(top, #fff 0%, #eee 100%); background-image: -ms-linear-gradient(top, #fff 0%, #eee 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #eee)); border: 1px solid #aaa; } div.nav .heading { background-color: #666; } div.nav .subheading { font-family: "CronosPro", Helvetica, Arial, sans-serif; font-weight: bold; padding: 6px; background-color: #666; background-image: url("http://wiki.guildwars2.com/images/3/39/User_Alfa-R_infobox_hader_overlay.png") !important; } div.nav dt, div.nav dd, div.infobox dt, div.infobox dd { line-height: 1.333em; } div.nav dd table tr + tr > * { padding-top: 4px; } div.nav .center { text-align: center; margin: 10px 0; } div.nav .box table { background-color: transparent; margin: 0; } div.nav dl { margin-top: 10px; margin-bottom: 10px; } div.nav dt { float: left; text-align: right; padding: 2px 8px; width: 125px; margin:0; } div.nav dd { float: left; text-align: left; padding: 2px 8px; border-left: #444 solid 2px; margin:0; width:325px; } /**Allows for smaller (horizontal) navs**/ div.nav.thin .box { width: 400px; margin-left:50px;} div.nav.thin dt { width: 75px; } div.nav.thin dd { width: 290px; } /**Allows for wider (horizontal) navs**/ div.nav.wide .box { width: 600px; margin-left:-50px; } div.nav.wide dt { width: 150px; } div.nav.wide dd { width: 400px; } /**NPC navs**/ div.nav.npc .heading { background-color: #6c3; } div.nav.npc dd { border-color: #6c3; } /**PvE navs**/ div.nav.pve .heading { background-color: #fc6; } div.nav.pve dd { border-color: #fc6; } /**Equipment navs**/ div.nav.equip .heading { background-color: #f96; } div.nav.equip dd { border-color: #f96; } /**Mechanics navs**/ /**Professions/attributes/races**/ div.nav.mech1 .heading { background-color: #69c; } div.nav.mech1 dd { border-color: #69c; } /**Other mechanics**/ div.nav.mech2 .heading { background-color: #3cc; } div.nav.mech2 dd { border-color: #3cc; } /**World navs**/ /**Locations**/ div.nav.location .heading { background-color: #96c; } div.nav.location dd { border-color: #96c; } /**Lore**/ div.nav.lore .heading { background-color: #c6c; } div.nav.lore dd { border-color: #c6c; } /**Promotional material navs**/ div.nav.promo .heading { background-color: #9c3; } div.nav.promo dd { border-color: #9c3; } /**Hall of Monuments nav**/ div.nav.hom .heading { background-color: #c96; } div.nav.hom dd { border-color: #c96; } /**Asura storyline nav**/ div.nav.asura .heading { background-color: #96f; } div.nav.asura .subheading { background-color: #96f; } div.nav.asura dd { border-color: #96f; } /**Charr storyline nav**/ div.nav.charr .heading { background-color: #f33; } div.nav.charr .subheading { background-color: #f33; } div.nav.charr dd { border-color: #f33; } /**Human storyline nav**/ div.nav.human .heading { background-color: #fc3; } div.nav.human .subheading { background-color: #fc3; } div.nav.human dd { border-color: #fc3; } /**Norn storyline nav**/ div.nav.norn .heading { background-color: #6cf; } div.nav.norn .subheading { background-color: #6cf; } div.nav.norn dd { border-color: #6cf; } /**Sylvari storyline nav**/ div.nav.sylvari .heading { background-color: #3c3; } div.nav.sylvari .subheading { background-color: #3c3; } div.nav.sylvari dd { border-color: #3c3; }