Njw has uploaded a new change for review.
https://gerrit.wikimedia.org/r/65824
Change subject: Switch all CSS to follow Mediawiki's coding conventions, and
separate css reset
......................................................................
Switch all CSS to follow Mediawiki's coding conventions, and separate css reset
Change-Id: I661807582d42fd5876ee97b92e71b7503c217428
---
M Erudite.skin.php
A assets/cssreset.css
M assets/erudite.css
M erudite.php
4 files changed, 400 insertions(+), 155 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/skins/erudite
refs/changes/24/65824/1
diff --git a/Erudite.skin.php b/Erudite.skin.php
index 878509c..8c36aa5 100644
--- a/Erudite.skin.php
+++ b/Erudite.skin.php
@@ -83,7 +83,7 @@
<div id="menu">
<ul id="menu-urs" class="menu">
<?php foreach(
$this->data['sidebar']['navigation'] as $key => $val ) { ?>
- <li id="menu-item-<?php echo
Sanitizer::escapeId( $val['id'] ) ?>" class="menu-item menu-item-type-post_type
menu-item">
+ <li id="menu-item-<?php echo
Sanitizer::escapeId( $val['id'] ) ?>" class="menu-item">
<a href="<?php echo
htmlspecialchars( $val['href'] ) ?>"><?php echo htmlspecialchars( $val['text']
) ?></a>
</li>
<?php } ?>
@@ -107,7 +107,7 @@
<div id="container">
<div id="content" class="mw-body" role="main">
- <div id="content-container" class="post type-post
category-submissions">
+ <div id="content-container">
<h2 class="entry-title"><?php
$this->html('title'); ?></h2>
<?php if ($this->data['subtitle']) { ?>
<span class="entry-sub-title"><?php
$this->html('subtitle') ?></span><br/><br/>
@@ -129,7 +129,7 @@
<?php $this->html('dataAfterContent'); ?>
</div>
- </div><!-- .post -->
+ </div>
<div id="footer">
<?php foreach ( $this->getFooterLinks() as
$category => $links ) {
@@ -147,9 +147,7 @@
} ?>
</div>
- <div id="nav-below" class="navigation">
- <?php $this->html('catlinks'); ?>
- </div>
+ <?php $this->html('catlinks'); ?>
</div><!-- #content -->
</div><!-- #container -->
diff --git a/assets/cssreset.css b/assets/cssreset.css
new file mode 100644
index 0000000..e0b61b2
--- /dev/null
+++ b/assets/cssreset.css
@@ -0,0 +1,84 @@
+/* CSS Reset based on http://meyerweb.com/eric/tools/css/reset/ */
+html,
+body,
+div,
+span,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+a,
+abbr,
+acronym,
+address,
+cite,
+code,
+del,
+dfn,
+em,
+font,
+img,
+ins,
+q,
+s,
+samp,
+small,
+strike,
+strong,
+sub,
+sup,
+tt,
+b,
+u,
+i,
+center,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ outline: 0;
+ font-size: 100%;
+ vertical-align: baseline;
+ background: transparent;
+}
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+
+ol,ul {
+ list-style: none;
+}
+
+sup {
+ vertical-align: super;
+}
+
+sub {
+ vertical-align: sub;
+}
diff --git a/assets/erudite.css b/assets/erudite.css
index 9479c8b..f26b1f4 100644
--- a/assets/erudite.css
+++ b/assets/erudite.css
@@ -1,5 +1,5 @@
/*
- * The Erudite WordPress theme by Soma Design
+ * Based on The Erudite WordPress theme by Soma Design
* http://somadesign.ca/
*
* Licensed under the GPL 2.0
@@ -7,123 +7,225 @@
*
*/
-/* CSS Reset based on http://meyerweb.com/eric/tools/css/reset/ */
-html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,cite,code,del,dfn,em,font,img,ins,q,s,samp,small,strike,strong,sub,sup,tt,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td
{
margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;
}
-a:focus {overflow:hidden; outline:1px dotted;}
-table { border-collapse:collapse;border-spacing:0; }
-ol,ul {list-style:none;}
-sup { vertical-align:super; }
-sub { vertical-align:sub; }
+/* Layout */
+#container,
+#header,
+#access,
+#footer-wrap-inner {
+ min-width: 96em;
+ width: 90%;
+ margin: 0 auto;
+ position: relative;
+}
-/* Layout. Based on the idea of 960.gs. Sorta. Loosely. */
-#container, #header, #footer-wrap-inner {min-width:96em; width:90%; margin:0
auto; position:relative;}
-#content {padding:2.4em 6em 0em 6em;}
-body.single #content, body.page #content {overflow:visible;}
-.sidebar {width:24em; clear:both;}
+#content {
+ padding: 2.4em 6em 0em 6em;
+}
+
#header-wrap,
#footer-wrap {
min-width: 960px;
}
/* Use dark stripes around edge to focus on content */
-div#container { background: white; padding-top: 2em; }
+div#container {
+ background: white;
+ padding-top: 2em;
+}
div#wrapper {
/* @embed */
background: #fafafa url(images/stripes-dark.png);
}
-div#content-container { margin-bottom: 0px; }
-
/* Typography Base */
-body {font-family: constantia,'hoefler text','palatino linotype',serif;
font-size: 10px; line-height: 1.5; background:#fafafa; color:#333; }
-textarea, select, input {font-size:12px;}
-h1,h2,h3,h4,h5,h6 {font-family:'gill sans',corbel,'gill sans mt',sans-serif;
font-weight:normal; text-transform:uppercase; letter-spacing:.05em;
text-rendering: optimizeLegibility}
-h1 {font-size:3.6em; line-height:1.333; margin:1.333em 0 .333em;}
-h2 {font-size:2.4em; line-height:1; margin:1em 0 .25em;}
-h3 {font-size:2.1em; line-height:1.143; margin:1.143em 0 .286em;}
-h4 {font-size:1.8em; line-height:1.333; margin:1.333em 0 .333em;}
-h5 {font-size:1.6em; margin-top:1.5em 0 .375em;}
-h4, h5 {letter-spacing:.1em;}
-h1 + h2, h1 + h3, h1 + h4, h1 + h5, h1 + h6, h2 + h3, h2 + h4, h2 + h5, h2 +
h6, h3 + h4, h3 + h5, h3 + h6, h4 + h5, h4 + h5, h5 + h6 {
- margin-top:0;
+body {
+ font-family: constantia, 'hoefler text', 'palatino linotype', serif;
+ font-size: 10px;
+ line-height: 1.5;
+ background: #fafafa;
+ color: #333333;
}
-pre, code {font-family:consolas,'deja vu sans mono','lucida sans
typewriter',monaco,monospace;}
+
+textarea,
+select,
+input {
+ font-size: 12px;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ font-family: corbel, 'gill sans', 'gill sans mt', sans-serif;
+ font-weight: normal;
+ text-transform: uppercase;
+ letter-spacing: 0.05em;
+ text-rendering: optimizeLegibility;
+}
+
+h1 {
+ font-size: 3.6em;
+ line-height: 1.333;
+ margin: 1.333em 0 0.333em;
+}
+
+h2 {
+ font-size: 2.4em;
+ line-height: 1;
+ margin: 1em 0 0.25em;
+}
+
+h3 {
+ font-size: 2.1em;
+ line-height: 1.143;
+ margin: 1.143em 0 0.286em;
+}
+
+h4 {
+ font-size: 1.8em;
+ line-height: 1.333;
+ margin: 1.333em 0 0.333em;
+}
+
+h5 {
+ font-size: 1.6em;
+ margin-top: 1.5em 0 0.375em;
+}
+
+h4,
+h5 {
+ letter-spacing: 0.1em;
+}
+
+h1 + h2,
+h1 + h3,
+h1 + h4,
+h1 + h5,
+h1 + h6,
+h2 + h3,
+h2 + h4,
+h2 + h5,
+h2 + h6,
+h3 + h4,
+h3 + h5,
+h3 + h6,
+h4 + h5,
+h4 + h5,
+h5 + h6 {
+ margin-top: 0;
+}
+
+pre,
+code {
+ font-family: consolas, 'deja vu sans mono', 'lucida sans typewriter',
monaco, monospace;
+}
/* Links */
-a {text-decoration:none;}
-a:link {color:#0000bb;}
-a:visited {color:#330077;}
-a:hover {color:#222233; text-decoration:underline;}
-a.new:link {
- color: #cc0000;
+a {
+ text-decoration: none;
+ color: #0000bb;
}
-a.new:visited {
- color: red;
+
+a:hover {
+ text-decoration: underline;
+}
+
+a:visited {
+ color: #330077;
+}
+
+a.new {
+ color: #cc0000;
}
/* Header */
#header-wrap {
- background-color: #333;
- background-repeat: repeat;
/* @embed */
background-image: url(images/stripes.png);
+ background-color: #333333;
+ background-repeat: repeat;
padding: 1em 0;
}
-#header h1, #header h1 a {color:#fff; text-decoration:none; line-height:1;
margin:0;}
-#siteSubtitle {font-size:1.4em; color:#fff;}
+#header h1,
+#header h1 a {
+ color: #ffffff;
+ text-decoration: none;
+ line-height: 1;
+ margin: 0;
+}
+
+#siteSubtitle {
+ font-size: 1.4em;
+ color: #ffffff;
+}
/* Menu */
-.skip-link {display:none;}
-#access {min-width:96em; width:90%; margin:0 auto;}
-#menu {margin:2.4em 0 -1em; overflow:hidden; padding:1.2em 6em; border-top:1px
solid #666; background:#333; background:rgba(50,50,50,.7);}
-#menu a {
- color: #fff;
- text-transform: uppercase;
- font-family: 'gill sans', corbel, 'gill sans mt', sans-serif;
+#menu {
+ margin: 2.4em 0 -1em;
+ overflow: hidden;
+ padding: 1.2em 6em;
+ border-top: 1px solid #666666;
+ background: #333333;
+ background: rgba(50, 50, 50, 0.7);
}
-#menu li {display:block; float:left; margin-right:2em; font-size:1.6em;}
-#menu li ul {border-left:1px solid #444; padding-left:.5em; margin-left:.1em;
display:none;}
-#menu li:hover ul {display:block;}
-#menu li li {float:none; font-size:.857em; display:block; margin-right:0;}
-#menu li li li {font-size:1em;}
-/* Navigation */
-#nav-below {clear:both; z-index:5;}
-.hiding #nav-below {bottom:-3.5em;}
-.paged #nav-below {}
-#nav-below div {background:#666; height:100%; overflow:hidden;}
-.nav-previous {float:left;}
-.nav-next {float:right;}
-#nav-below a {color:#fff; padding:0 1em; line-height:2; height:100%;
font-size:1.2em; display:block;}
+#menu a {
+ font-family: corbel, 'gill sans', 'gill sans mt', sans-serif;
+ text-transform: uppercase;
+ color: #ffffff;
+}
+
+#menu li {
+ display: block;
+ float: left;
+ margin-right: 2em;
+ font-size: 1.6em;
+}
/* Footer */
#footer-wrap {
- font-family: 'gill sans', corbel, 'gill sans mt', sans-serif;
- background: #333;
+ font-family: corbel, 'gill sans', 'gill sans mt', sans-serif;
+ background: #333333;
clear: both;
- color: #fff;
+ color: #ffffff;
padding: 2.4em 0 4em;
}
-.footer {min-width:24em; width:25%; float:left; margin-left:5%}
+
+.footer {
+ min-width: 24em;
+ width: 25%;
+ float: left;
+ margin-left: 5%;
+}
+
.footer .widget li {
font-size: 1.4em;
}
-.footer h3 {border-bottom:1px solid #666; font-size:2.1em; line-height:1.143;
margin:1.143em 0 .19em;}
+
+.footer h3 {
+ border-bottom: 1px solid #666666;
+ font-size: 2.1em;
+}
+
.footer a,
.footer a.new {
- color: #fff;
+ color: #ffffff;
text-decoration: none;
- border-bottom: 1px solid #999;
+ border-bottom: 1px solid #999999;
}
+
.footer a:hover,
.footer a.new:hover {
- border-color: #ccc;
+ border-color: #cccccc;
}
+
.footer li > a,
.footer li > a.new {
- border-color: #444;
+ border-color: #444444;
}
/* Footer to content (for FooterLinks) */
@@ -132,10 +234,14 @@
padding: 2ex 0;
}
-/* Posts */
-div.post, div.page, div.attachment {position:relative; margin:0 0 3.2em;
min-height:21.6em; clear:both;}
-div.post:after, div.page:after {clear:both;content:'
';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}/*clearfix*/
-.post .shortened {overflow:hidden !important;}
+/* Content */
+#content-container {
+ position: relative;
+ margin: 0;
+ min-height: 21.6em;
+ clear: both;
+ overflow: hidden;
+}
hr {
/* @embed */
@@ -147,47 +253,90 @@
border-style: none !important;
}
-.entry-title, .entry-title a {color:#555; text-decoration:none;}
-.entry-title a:hover {text-decoration:underline;}
-.entry-title {margin:0 0 .5em; line-height:1.5;}
-h3.entry-title {margin-bottom:.857em;}
-.entry-content p, .entry-content li, .entry-content dt, .entry-content dd
{font-size:1.6em; margin-bottom:.75em;}
-.entry-content li li {font-size:1em;}
-.entry-content table {margin:1em 0;}
-.entry-content td, .entry-content th {padding:.125em .5em; text-align:left;}
-.entry-content pre {font-size:1.4em;}
-.entry-content legend {font-size:1.4em; text-align:center;}
-.hypenation .entry-content p {text-align:justify;}
+.entry-title {
+ color: #555555;
+ margin: 0 0 0.5em;
+ line-height: 1.5;
+}
+
+.entry-content p,
+.entry-content li,
+.entry-content dt,
+.entry-content dd {
+ font-size: 1.6em;
+ margin-bottom: 0.75em;
+}
+
+.entry-content li li {
+ font-size: 1em;
+}
+
+.entry-content table {
+ margin: 1em 0;
+}
+
+.entry-content td,
+.entry-content th {
+ padding: 0.125em 0.5em;
+ text-align: left;
+}
+
+.entry-content pre {
+ font-size: 1.4em;
+}
+
+.entry-content legend {
+ font-size: 1.4em;
+ text-align: center;
+}
+
.entry-content blockquote {
font-size: 1.6em;
padding-left: 3em;
}
-.entry-content ul li {list-style: disc outside;}
-.entry-content ol li {list-style: decimal outside;}
-.entry-content li ol, .entry-content li ul {margin:.5em 0 0 .5em;}
+
+.entry-content ul li {
+ list-style: disc outside;
+}
+
+.entry-content ol li {
+ list-style: decimal outside;
+}
+
+.entry-content li ol,
+.entry-content li ul {
+ margin: 0.5em 0 0 0.5em;
+}
/* Main Links */
-.entry-content a {text-decoration:none; border-bottom:1px solid #aaa;}
-.entry-content a:visited {border-color:#ddd;}
-.entry-content a:hover {border-color:#555; text-decoration:none;}
-.entry-content a:active {color:#55f;}
+.entry-content a {
+ border-bottom: 1px solid #aaaaaa;
+}
-/* entry meta */
-.entry-meta {float:right; padding-left:15px; margin-bottom:10px;
margin-left:15px; border-left:1px solid #aaa;}
-.entry-meta span {display:block; font-size:1.1em; line-height:1.455;
padding:.364em 0;}
-.entry-meta a {font-style:italic;}
-.entry-meta .meta-sep {display:none;}
+.entry-content a:hover {
+ border-color: #555555;
+ text-decoration: none;
+}
-/* Image Layout */
-.entry-content img {border:1px solid #aaa; padding:4px; margin-bottom:6px;
max-width:100%;}
-.entry-content img.wp-smiley {border:0 none; padding:0; margin:0;}
-.centered, .aligncenter {display:block; margin:16px auto;}
-.alignright {float:right; margin: 6px 0 3px 15px;}
-.alignleft {float:left; margin:6px 15px 3px 0;}
-.wp-caption {border:1px solid #aaa; text-align:center; padding-top:5px;
margin-bottom:6px;}
-.wp-caption a, .wp-caption img {border:0 none; padding:0;}
-.wp-caption p.wp-caption-text {text-align:center; margin:5px; font-size:1.3em;}
-.entry-content .gallery a {border-width:0;}
+/* Meta (edit links etc.) */
+.entry-meta {
+ float: right;
+ padding-left: 15px;
+ margin-left: 15px;
+ margin-bottom: 10px;
+ border-left: 1px solid #aaaaaa;
+}
+
+.entry-meta span {
+ display: block;
+ font-size: 1.1em;
+ font-style: italic;
+ padding: 0.4em 0;
+}
+
+.entry-meta .meta-sep {
+ display: none;
+}
#content .printfooter {
display: none;
@@ -197,12 +346,9 @@
font-size: 10pt;
}
-.toc, #toc {
+.toc,
+#toc {
display: none;
-}
-
-.reference {
- font-size: 8pt;
}
#bodyContent > ul > li {
@@ -219,13 +365,9 @@
font-style: italic;
}
-/* make the list of references look smaller and highlight clicked reference in
blue */
-ol.references {
- font-size: 80%;
-}
-
-.references-small {
- font-size: 70%;
+/* References */
+.reference {
+ font-size: 8pt;
}
ol.references > li:target {
@@ -237,11 +379,23 @@
}
/* Images */
-div.floatright, table.floatright {
+.entry-content img {
+ border: 1px solid #aaaaaa;
+ padding: 4px;
+ margin-bottom: 6px;
+ max-width: 100%;
+}
+
+.entry-content .gallery a {
+ border-width: 0;
+}
+
+div.floatright,
+table.floatright {
clear: right;
float: right;
position: relative;
- margin: 0 0 .5em .5em;
+ margin: 0 0 0.5em 0.5em;
border: 0;
}
@@ -249,11 +403,12 @@
font-style: italic;
}
-div.floatleft, table.floatleft {
+div.floatleft,
+table.floatleft {
float: left;
clear: left;
position: relative;
- margin: 0 .5em .5em 0;
+ margin: 0 0.5em 0.5em 0;
border: 0;
}
@@ -262,15 +417,15 @@
}
div.thumb {
- margin-bottom: .5em;
+ margin-bottom: 0.5em;
border-style: solid;
- border-color: #FAFAFA;
+ border-color: #fafafa;
width: auto;
background-color: transparent;
}
div.thumbinner {
- border: 1px solid #ccc;
+ border: 1px solid #cccccc;
padding: 3px !important;
background-color: #f9f9f9;
font-size: 94%;
@@ -301,7 +456,8 @@
background: none !important;
}
-div.magnify a, div.magnify img {
+div.magnify a,
+div.magnify img {
display: block;
border: none !important;
background: none !important;
@@ -310,14 +466,14 @@
div.tright {
clear: right;
float: right;
- border-width: .5em 0 .8em 1.4em;
+ border-width: 0.5em 0 0.8em 1.4em;
}
div.tleft {
float: left;
clear: left;
- margin-right: .5em;
- border-width: .5em 1.4em .8em 0;
+ margin-right: 0.5em;
+ border-width: 0.5em 1.4em 0.8em 0;
}
img.thumbborder {
@@ -329,12 +485,12 @@
}
table.gallery {
- background-color: #FAFAFA;
+ background-color: #fafafa;
}
table.gallery td {
- background-color: #FAFAFA;
- border: 2px solid #FAFAFA;
+ background-color: #fafafa;
+ border: 2px solid #fafafa;
}
/* Category pages */
@@ -346,11 +502,11 @@
font-size: 15pt;
}
-div#content-container.post div.entry-content div#mw-pages table tbody tr td ul
{
+div#content-container div.entry-content div#mw-pages table tbody tr td ul {
font-size: 6pt;
}
-div#content-container.post div.entry-content div#mw-subcategories table tbody
tr td ul {
+div#content-container div.entry-content div#mw-subcategories table tbody tr td
ul {
font-size: 6pt;
}
@@ -370,16 +526,24 @@
}
/* Category Links */
-#mw-normal-catlinks > a {
- padding-left: 0.5em;
+#catlinks {
+ clear: both;
+ background: #666666;
+ height: 100%;
+ overflow: hidden;
}
-#nav-below a {
+#catlinks a {
+ color: #ffffff;
+ padding: 0 1em;
+ line-height: 2;
+ height: 100%;
+ font-size: 1.2em;
display: inline;
}
.catlinks li:first-child {
- border-left: 1px solid #AAA;
+ border-left: 1px solid #aaaaaa;
}
.catlinks li {
@@ -392,18 +556,15 @@
position: relative;
min-width: 960px;
width: 90%;
- color: #fff;
+ color: #ffffff;
background-color: #666666;
font-size: 13pt;
line-height: 36pt;
}
-.message a:link {
- color: #DFDFDF;
-}
-
+.message a:link,
.message a:visited {
- color: #DFDFDF;
+ color: #dfdfdf;
}
.mw-search-formheader div.search-types ul li {
@@ -420,11 +581,11 @@
top: 1em;
left: 1em;
z-index: 1;
- color: #fff;
+ color: #ffffff;
font-size: 1.25em;
}
.mw-jump a {
- color: #fff;
+ color: #ffffff;
}
img#logo {
@@ -437,13 +598,14 @@
}
/* don't give lists massive margins when in tds */
-.mw-content-ltr ul, .mw-content-rtl ul {
- margin-left: 0em;
+.mw-content-ltr ul,
+.mw-content-rtl ul {
+ margin-left: 0em;
}
/* reduce h3 top margin in a table, so can be used as a table title */
table h3 {
- margin-top: 1ex;
+ margin-top: 1ex;
}
/* ensure edit form doesn't clear the right floated meta
diff --git a/erudite.php b/erudite.php
index 5ab503c..4a45756 100644
--- a/erudite.php
+++ b/erudite.php
@@ -26,6 +26,7 @@
$wgResourceModules['skins.erudite'] = array(
'styles' => array(
+ 'erudite/assets/cssreset.css' => array( 'media' => 'screen' ),
'erudite/assets/erudite.css' => array( 'media' => 'screen' ),
'erudite/assets/print.css' => array( 'media' => 'print' ),
),
--
To view, visit https://gerrit.wikimedia.org/r/65824
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I661807582d42fd5876ee97b92e71b7503c217428
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/skins/erudite
Gerrit-Branch: master
Gerrit-Owner: Njw <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
