MediaWiki:Skin/Kamelopedia:RTRC.css

/** * RTRC.css * Created on April 25th, 2010 * * @package Real-Time Recent Changes * @since 0.3.0 * * Copyright (c) 2010 Krinkle  * * Real-Time Recent Changes by Krinkle [1] is licensed under * a Creative Commons Attribution-Share Alike 3.0 Unported License [2] * * [1]  * [2]  */ /** * ORDER: * display, width, height, float, position, margin, padding, background, border, font, text, color, letter * -moz, -webkit, -khtml, css3 */

/*	MAIN LAYOUT & CLASSES /* Minify top-bar */ body.skin-vector #mw-page-base { height:2.5em } body.skin-vector #left-navigation { top:0em; left:8em } body.skin-vector #right-navigation, .mw-revdelundel-link { display:none }
 * 1) footer, #contentSub, #catlinks, #p-tb,

div#mw-panel div.portal div.body	{ margin-left:0 !important } body.skin-vector div#mw-panel, /* body.skin-monobook */ .portlet, body.skin-vector div#mw-panel #p-logo a, body.skin-monobook div#column-one #p-logo a									{ width:127px }


 * 1) krRTRC_PageWrap, #krRTRC_PageWrap *{ margin:0;padding:0;outline:0px !important }
 * 2) content.krRTRC_body				{ background:#aaa; margin-left:8em; padding:0px 10px; border-top:30px solid #aaa }
 * 3) krRTRC_PageWrap, .ns				{ font:12px/1.4 "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif }
 * 4) krRTRC_PageWrap					{ display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:rgb(247, 246, 248); color:#343434; min-width:865px }
 * 5) krRTRC_PageWrap .inline-block		{ display:inline-block }


 * 1) krRTRC_Topbar						{ position:absolute; top:-25px; left:10%; width:80%; text-align:center; font-size:16px; color:#000; -webkit-transition:all 0.15s ease-in-out }
 * 2) krRTRC_Topbar:hover				{ opacity:1.0 }


 * 1) krRTRC_Footer						{ position:fixed; bottom:0; left:0; width:100%; height:30px; background:rgba(255,255,255,0.6); opacity:0.8; border-top:1px solid #a1cef5; text-align:center; color:#343434 }
 * 2) krRTRC_Footer:hover				{ background:rgba(255,255,255,1.0); opacity:1.0 }
 * 3) krRTRC_Footer .inside				{ padding:6px 15px 0px 15px }

/*	WHOISONLINE
 * 1) krwhosonline						{ position:relative; }
 * 2) krwhosonline .more					{ display:none }
 * 3) krwhosonline:hover .more			{ display:block; position:absolute; bottom:99%; right:0px; padding:8px 15px; background:rgba(255,255,255,0.6); border:1px solid #a1cef5; border-bottom:none; text-align:left; color:#eee }
 * 1) krwhosonline:hover .more			{ display:block; position:absolute; bottom:99%; right:0px; padding:8px 15px; background:rgba(255,255,255,0.6); border:1px solid #a1cef5; border-bottom:none; text-align:left; color:#eee }

/*	BUTTONS/TEXT
 * 1) krRTRC_PageWrap a:active,
 * 2) krRTRC_PageWrap .button:active,
 * 3) krRTRC_PageWrap .helpicon:active	{ position:relative; top:1px }
 * 1) krRTRC_PageWrap .helpicon:active	{ position:relative; top:1px }


 * 1) krRTRC_RCOptions.nohelp .helpicon	{ display:none !important }
 * 2) krRTRC_PageWrap .helpicon			{ display:inline-block; width:18px; height:18px; background:transparent url(http://upload.wikimedia.org/wikipedia/commons/5/51/Question-helpbutton.png) no-repeat; vertical-align:middle }


 * 1) krRTRC_PageWrap .button:hover,
 * 2) krRTRC_PageWrap .helpicon:hover,
 * 3) krRTRC_PageWrap #toggleHelp:hover,
 * 4) krRTRC_Tiptext:hover	{ cursor:pointer }
 * 5) krRTRC_PageWrap #toggleHelp		{ float:right }
 * 6) krRTRC_Tip { position:absolute; top:0px; right:0px; display:none }
 * 7) krRTRC_Tiptext { border:3px solid rgb(136, 240, 36); padding:4px 24px 4px 8px; background:#f9f9f9 url(http://upload.wikimedia.org/wikipedia/commons/thumb/3/35/Button_normal.svg/12px-Button_normal.svg.png) top right no-repeat } /* Reminder: Also update example in docs */

/*	RC OPTIONS background-image:-moz-linear-gradient(100% 100% 90deg, #678bd6, #0645ad); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#678bd6), to(#0645ad)); -moz-border-radius:5px; -webkit-border-radius:5px; -khtml-border-radius:5px; border-radius:5px } background-image:-moz-linear-gradient(100% 100% 90deg, #678bd6, #36b); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#678bd6), to(#36b)) } background-image:-moz-linear-gradient(100% 100% 90deg, #0645ad, #678bd6); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#0645ad), to(#678bd6)) } background-image:-moz-linear-gradient(100% 100% 90deg, limeGreen, green); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(limeGreen), to(green)) } background-image:-moz-linear-gradient(100% 100% 90deg, limeGreen, limeGreen); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(limeGreen ), to(limeGreen)) } background-image:-moz-linear-gradient(100% 100% 90deg, green, limeGreen); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(green), to(limeGreen)) } background-image:-moz-linear-gradient(100% 100% 90deg, #FF0000, #990000); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#FF0000 ), to(#990000)) } background-image:-moz-linear-gradient(100% 100% 90deg, #FF0000, #FF0000); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#FF0000 ), to(#FF0000)) } background-image:-moz-linear-gradient(100% 100% 90deg, #990000, #FF0000); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#990000), to(#FF0000)) }
 * 1) krRTRC_RCOptions					{ clear:both; max-width:auto; margin:0 auto; padding:0px; background:white; border:0px solid transparent; -moz-border-radius-bottomleft:11px; -webkit-border-bottom-left-radius:11px; -khtml-border-bottom-left-radius:11px; border-bottom-left-radius:11px;-moz-border-radius-bottomright:11px; -webkit-border-bottom-right-radius:11px; -khtml-border-bottom-right-radius:11px; border-bottom-right-radius:11px;-moz-box-shadow:rgba(200,200,200,1) 0 5px 15px; -webkit-box-shadow:rgba(200,200,200,1) 0 5px 15px; -khtml-box-shadow:rgba(200,200,200,1) 0 5px 15px; box-shadow:rgba(200,200,200,1) 0 5px 15px }
 * 2) krRTRC_RCOptions .panel			{ float:left; margin:0px; padding:3px 5px; text-align:center }
 * 3) krRTRC_RCOptions .panel .head		{ display:block; margin-bottom:5px; font-weight:bold }
 * 4) krRTRC_RCOptions .panel2			{ float:left; margin:0px; padding:3px 5px 1px 5px; text-align:center; min-height:20px }
 * 5) krRTRC_RCOptions .panel2 .head		{ display:inline-block; margin-bottom:5px; margin-right:5px; font-weight:bold }
 * 6) krRTRC_RCOptions .sep				{ float:left; border-right:2px ridge rgb(247, 246, 248); height:68px }
 * 7) krRTRC_RCOptions .sep2				{ float:left; border-right:2px ridge rgb(247, 246, 248); height:33px }
 * 8) krRTRC_RCOptions .panel-last		{ float:right; margin:0px 5px }
 * 9) krRTRC_RCOptions .button			{ margin-top:1px; padding:3px 5px; background-color:#0645ad; border:1px solid #0645ad; color:white; font-weight:bold;
 * 1) krRTRC_RCOptions .button			{ margin-top:1px; padding:3px 5px; background-color:#0645ad; border:1px solid #0645ad; color:white; font-weight:bold;
 * 1) krRTRC_RCOptions .button:hover		{ background-color:#36b;
 * 1) krRTRC_RCOptions .button:active	{ background-color:#678bd6;
 * 1) krRTRC_RCOptions .button-off		{ vertical-align:top; background-color:limeGreen; border:1px solid green;
 * 1) krRTRC_RCOptions .button-off:hover	{ background-color:GreenYellow;
 * 1) krRTRC_RCOptions .button-off:active{ background-color:green;
 * 1) krRTRC_RCOptions .button-on		{ font-size:larger; background-color:#FF0000; border:1px solid #990000;
 * 1) krRTRC_RCOptions .button-on:hover	{ background-color:#FF0000;
 * 1) krRTRC_RCOptions .button-on:active{ background-color:#990000;
 * 1) krRTRC_RCOptions .button[disabled]:hover	{ cursor:default }
 * 2) krRTRC_RCOptions #RCOptions_submit	{ padding:5px 9px; font-size:14px }

/*	DIFF FRAME
 * 1) krRTRC_DiffFrame					{ position:relative; width:97%; margin:20px auto 15px auto; padding:1em 0; background:white;-moz-border-radius:11px; -webkit-border-radius:11px; -khtml-border-radius:11px; border-radius:11px;-moz-box-shadow:rgba(200,200,200,1) 0 5px 15px; -webkit-box-shadow:rgba(200,200,200,1) 0 5px 15px; -khtml-box-shadow:rgba(200,200,200,1) 0 5px 15px; box-shadow:rgba(200,200,200,1) 0 5px 15px }
 * 2) krRTRC_DiffFrame h3				{ margin:0 1em 0.5em 1em; border-bottom:1px solid rgb(247, 246, 248); font-size:21px; font-weight:normal; white-space:nowrap; overflow:hidden }
 * 3) krRTRC_DiffFrame table.diff		{ margin:0; width:100% }
 * 4) krRTRC_DiffTools					{ position:absolute; top:0em; right:2em; width:80% }
 * 5) krRTRC_DiffTools .tab				{ float:right; font-weight:bold; margin-left:3px; padding:3px 10px; background-color:rgb(247, 246, 248);-moz-border-radius-bottomleft:11px; -webkit-border-bottom-left-radius:11px; -khtml-border-bottom-left-radius:11px; border-bottom-left-radius:11px;-moz-border-radius-bottomright:11px; -webkit-border-bottom-right-radius:11px; -khtml-border-bottom-right-radius:11px; border-bottom-right-radius:11px }
 * 6) krRTRC_DiffTools .tab a:hover		{ cursor:pointer }
 * 1) krRTRC_DiffTools .tab a:hover		{ cursor:pointer }

/*	RC OUTPUT font-size:12px; -moz-border-radius-topleft:11px; -webkit-border-top-left-radius:11px; -khtml-border-top-left-radius:11px; border-top-left-radius:11px;-moz-border-radius-topright:11px; -webkit-border-top-right-radius:11px; -khtml-border-top-right-radius:11px; border-top-right-radius:11px;-moz-box-shadow:rgba(200,200,200,1) 0 5px 15px; -webkit-box-shadow:rgba(200,200,200,1) 0 5px 15px; -khtml-box-shadow:rgba(200,200,200,1) 0 5px 15px; box-shadow:rgba(200,200,200,1) 0 5px 15px } .item:nth-child(odd)	{ background:#f3f3f3 }
 * 1) krRTRC_RCOutput					{ position:relative; width:100%; margin:20px auto 70px auto }
 * 2) krRTRC_RCOutput.placeholder		{ width:100%; height:600px; background:transparent url(http://upload.wikimedia.org/wikipedia/commons/9/9d/RTRC_Placeholder.png) top center no-repeat }
 * 3) krRTRC_RCOutput.placeholder *		{ display:none }
 * 4) krRTRC_RCOutput .feed				{ position:relative; padding:2em 0; background:white;
 * 1) krRTRC_RCOutput .feed				{ position:relative; padding:2em 0; background:white;
 * 1) krRTRC_lastupdate					{ position:absolute; top:0.5em; left:10%; width:80%; font-size:smaller; text-align:center }
 * 2) krRTRC_loader						{ position:absolute; top:0; right:0 }
 * 3) krRTRC_Dumpdate					{ position:absolute; bottom:-3em; right:5px; text-align:right }
 * 4) krRTRC_list						{ margin:0 0 -1.5em 0; width:100% }
 * 5) krRTRC_list .item					{ padding:0px 5px; white-space:nowrap }

/* Acts like a table with table-rows, using divs to avoid fixed table-layout with forced width and oveflow issues */
 * 1) krRTRC_list .item div				{ display:inline-block; overflow:hidden; padding:3px 0px }
 * 2) krRTRC_list .item div[first]		{ width:38% }
 * 3) krRTRC_list .item div[user]		{ width:21% }
 * 4) krRTRC_list .item div[other]		{ width:35% }
 * 5) krRTRC_list .item div[size]		{ width:6%;font-size:smaller; text-align:right }

/* item classes */ .item.aes				{ background:#fff0f0 } .item.aes .comment		{ font-weight:bold }

.item.skipped			{ background:#d6d9e9 !important } .item.patrolled			{ background:#d9e9d6 !important } .item.indiff			{ background:#ffce7b !important; border:1px solid orange }

.item .user.blacklisted	{ font-weight:bold; color:red !important } .item .user.blacklisted img	{ vertical-align:baseline }

-moz-border-radius-bottomleft:11px; -webkit-border-bottom-left-radius:11px; -khtml-border-bottom-left-radius:11px; border-bottom-left-radius:11px;-moz-border-radius-bottomright:11px; -webkit-border-bottom-right-radius:11px; -khtml-border-bottom-right-radius:11px; border-bottom-right-radius:11px;-moz-box-shadow:rgba(200,200,200,1) 0 5px 15px; -webkit-box-shadow:rgba(200,200,200,1) 0 5px 15px; -khtml-box-shadow:rgba(200,200,200,1) 0 5px 15px; box-shadow:rgba(200,200,200,1) 0 5px 15px } /* Diff pre-wrap (partially from wikibits/diff.css but there only adds pre-wrap for diffchange */ .diffchange, table.diff td {	white-space: -moz-pre-wrap;	white-space: pre-wrap; }
 * 1) krRTRC_RCLegend					{ margin:5px auto; padding:5px 13px; background:white;