r95875 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:r95874‎ | r95875 | r95876 >
Date:15:18, 31 August 2011
Author:krinkle
Status:ok (Comments)
Tags:
Comment:
Clean up and conventions in shared.css
* Put rules and selectors on their own line consistently. Space is not an issue and is stripped automatically. Readability is what we need. Selectors line up nicely underneath achother.
* Expanded shorthand . notation to 0. where applicable
* Remove trailing spaces
* Fix double spaces to single spaces, and expand comment sections if needed (ie. one * per line)
* Put @noflip's consistently on the line before the rule itself (just like we do for @embed). If it should apply to all rules in a selector, then @noflip must be before the { somewhere. There is no difference between @noflip before the rule on the same line or the line above (eg. /* noflip */ foo: bar; or /* noflip */ \n foo: bar;)
Modified paths:
  • /trunk/phase3/skins/common/shared.css (modified) (history)

Diff [purge]

Index: trunk/phase3/skins/common/shared.css
@@ -1,22 +1,56 @@
22 /**
3 - * CSS in this file is used by *all* skins (that have any CSS at all). Be
 3+ * CSS in this file is used by *all* skins (that have any CSS at all). Be
44 * careful what you put in here, since what looks good in one skin may not in
55 * another, but don't ignore the poor pre-Monobook users either.
66 */
77
88 /* GENERAL CLASSES FOR DIRECTIONALITY SUPPORT */
9 -/* These classes should be used for text depending on the content direction.
10 -Content stuff like editsection, ul/ol and TOC depend on this. */
11 - /* @noflip */.mw-content-ltr { direction: ltr; }
12 -/* @noflip */.mw-content-rtl { direction: rtl; }
 9+
 10+/**
 11+ * These classes should be used for text depending on the content direction.
 12+ * Content stuff like editsection, ul/ol and TOC depend on this.
 13+ */
 14+.mw-content-ltr {
 15+ /* @noflip */
 16+ direction: ltr;
 17+}
 18+.mw-content-rtl {
 19+ /* @noflip */
 20+ direction: rtl;
 21+}
 22+
1323 /* Most input fields should be in site direction */
14 -/* @noflip */.sitedir-ltr textarea, .sitedir-ltr input { direction: ltr; }
15 -/* @noflip */.sitedir-rtl textarea, .sitedir-rtl input { direction: rtl; }
 24+.sitedir-ltr textarea,
 25+.sitedir-ltr input {
 26+ /* @noflip */
 27+ direction: ltr;
 28+}
 29+.sitedir-rtl textarea,
 30+.sitedir-rtl input {
 31+ /* @noflip */
 32+ direction: rtl;
 33+}
 34+
1635 /* Input types that should follow user direction, like buttons */
17 -input[type="submit"], input[type="button"], input[type="reset"], input[type="file"] { direction: ltr; }
 36+/* TODO: What about buttons in wikipage content ? */
 37+input[type="submit"],
 38+input[type="button"],
 39+input[type="reset"],
 40+input[type="file"] {
 41+ direction: ltr;
 42+}
 43+
1844 /* Override default values */
19 -/* @noflip */textarea[dir="ltr"], input[dir="ltr"] { direction: ltr; }
20 -/* @noflip */textarea[dir="rtl"], input[dir="rtl"] { direction: rtl; }
 45+textarea[dir="ltr"],
 46+input[dir="ltr"] {
 47+ /* @noflip */
 48+ direction: ltr;
 49+}
 50+textarea[dir="rtl"],
 51+input[dir="rtl"] {
 52+ /* @noflip */
 53+ direction: rtl;
 54+}
2155
2256 .mw-float-start { float: left; }
2357 .mw-float-end { float: right; }
@@ -24,29 +58,45 @@
2559 .mw-align-end { text-align: right; }
2660
2761 /* The scripts of these languages are very hard to read with underlines */
28 -[lang="ar"] a, [lang="ckb"] a, [lang="fa"] a, [lang="kk-arab"] a,
29 -[lang="mzn"] a, [lang="ps"] a, [lang="ur"] a {
 62+[lang="ar"] a,
 63+[lang="ckb"] a,
 64+[lang="fa"] a,
 65+[lang="kk-arab"] a,
 66+[lang="mzn"] a,
 67+[lang="ps"] a,
 68+[lang="ur"] a {
3069 text-decoration: none;
3170 }
3271
3372 /* Default style for semantic tags */
34 -abbr, acronym, .explain {
 73+abbr,
 74+acronym,
 75+.explain {
3576 border-bottom: 1px dotted black;
3677 cursor: help;
3778 }
3879
3980 /* Colored watchlist and recent changes numbers */
40 -.mw-plusminus-pos { color: #006400; } /* dark green */
41 -.mw-plusminus-neg { color: #8b0000; } /* dark red */
42 -.mw-plusminus-null { color: #aaa; } /* gray */
 81+.mw-plusminus-pos {
 82+ color: #006400; /* dark green */
 83+}
 84+.mw-plusminus-neg {
 85+ color: #8b0000; /* dark red */
 86+}
 87+.mw-plusminus-null {
 88+ color: #aaa; /* gray */
 89+}
4390
44 -/* Links to redirects appear italicized on [[Special:AllPages]], [[Special:PrefixIndex]],
45 - [[Special:Watchlist/edit]] and in category listings */
46 -.allpagesredirect, .redirect-in-category, .watchlistredir {
 91+/**
 92+ * Links to redirects appear italicized on [[Special:AllPages]], [[Special:PrefixIndex]],
 93+ * [[Special:Watchlist/edit]] and in category listings.
 94+ */
 95+.allpagesredirect,
 96+.redirect-in-category,
 97+.watchlistredir {
4798 font-style: italic;
4899 }
49100
50 -
51101 /* Comment and username portions of RC entries */
52102 span.comment {
53103 font-style: italic;
@@ -61,15 +111,25 @@
62112 direction: ltr;
63113 unicode-bidi: embed;
64114 }
65 -img.tex { vertical-align: middle; }
66 -span.texhtml { font-family: serif; }
 115+img.tex {
 116+ vertical-align: middle;
 117+}
 118+span.texhtml {
 119+ font-family: serif;
 120+}
67121
68 -/* add a bit of margin space between the preview and the toolbar */
69 -/* this replaces the ugly <p><br /></p> we used to insert into the page source */
70 -#wikiPreview.ontop { margin-bottom: 1em; }
 122+/**
 123+ * Add a bit of margin space between the preview and the toolbar.
 124+ * This replaces the ugly <p><br /></p> we used to insert into the page source
 125+ */
 126+#wikiPreview.ontop {
 127+ margin-bottom: 1em;
 128+}
71129
72130 /* Stop floats from intruding into edit area in previews */
73 -#editform, #toolbar, #wpTextbox1 {
 131+#editform,
 132+#toolbar,
 133+#wpTextbox1 {
74134 clear: both;
75135 }
76136 #toolbar img {
@@ -89,8 +149,17 @@
90150 unicode-bidi: embed;
91151 }
92152 /* Correct directionality when page dir is different from site/user dir */
93 -/* @noflip */.mw-content-ltr .editsection, .mw-content-rtl .mw-content-ltr .editsection { float: right; }
94 -/* @noflip */.mw-content-rtl .editsection, .mw-content-ltr .mw-content-rtl .editsection { float: left; }
 153+.mw-content-ltr .editsection,
 154+.mw-content-rtl .mw-content-ltr .editsection {
 155+ /* @noflip */
 156+ float: right;
 157+}
 158+.mw-content-rtl .editsection,
 159+.mw-content-ltr .mw-content-rtl .editsection {
 160+ /* @noflip */
 161+ float: left;
 162+}
 163+
95164 /**
96165 * File histories
97166 */
@@ -114,10 +183,11 @@
115184 font-weight: bold;
116185 }
117186
118 -/*
 187+/**
119188 * rev_deleted stuff
120189 */
121 -li span.deleted, span.history-deleted {
 190+li span.deleted,
 191+span.history-deleted {
122192 text-decoration: line-through;
123193 color: #888;
124194 font-style: italic;
@@ -143,14 +213,28 @@
144214 /**
145215 * Forms
146216 */
147 -td.mw-label { text-align: right; }
148 -td.mw-input { text-align: left; }
149 -td.mw-submit { text-align: left; }
 217+td.mw-label {
 218+ text-align: right;
 219+}
 220+td.mw-input {
 221+ text-align: left;
 222+}
 223+td.mw-submit {
 224+ text-align: left;
 225+}
150226
151 -td.mw-label { vertical-align: top; }
152 -.prefsection td.mw-label { width: 20%; }
153 -.prefsection table { width: 100%; }
154 -td.mw-submit { white-space: nowrap; }
 227+td.mw-label {
 228+ vertical-align: top;
 229+}
 230+.prefsection td.mw-label {
 231+ width: 20%;
 232+}
 233+.prefsection table {
 234+ width: 100%;
 235+}
 236+td.mw-submit {
 237+ white-space: nowrap;
 238+}
155239
156240 table.mw-htmlform-nolabel td.mw-label {
157241 width: 0 !important;
@@ -176,29 +260,33 @@
177261 /**
178262 * Image captions
179263 */
180 -.thumbcaption { text-align: left; }
181 -.magnify { float: right; }
 264+.thumbcaption {
 265+ text-align: left;
 266+}
 267+.magnify {
 268+ float: right;
 269+}
182270
183271 /**
184272 * Categories
185273 */
186274 #catlinks ul {
187 - display:inline;
 275+ display: inline;
188276 margin: 0px;
189 - list-style:none;
190 - list-style-type:none;
191 - list-style-image:none;
 277+ list-style: none;
 278+ list-style-type: none;
 279+ list-style-image: none;
192280 vertical-align: middle !ie;
193281 }
194282
195283 #catlinks li {
196 - display:inline-block;
 284+ display: inline-block;
197285 line-height: 1.35em;
198286 padding: 0 .7em;
199287 border-left: 1px solid #AAA;
200288 margin: 0.3em 0;
201289 zoom: 1;
202 - display:inline !ie;
 290+ display: inline !ie;
203291 }
204292
205293 #catlinks li:first-child {
@@ -208,18 +296,24 @@
209297 /**
210298 * Hidden categories
211299 */
212 -.mw-hidden-cats-hidden { display: none; }
213 -.catlinks-allhidden { display: none; }
 300+.mw-hidden-cats-hidden {
 301+ display: none;
 302+}
 303+.catlinks-allhidden {
 304+ display: none;
 305+}
214306
215307 /* Convenience links to edit block, delete and protect reasons */
216 -p.mw-ipb-conveniencelinks, p.mw-protect-editreasons,
217 -p.mw-filedelete-editreasons, p.mw-delete-editreasons,
 308+p.mw-ipb-conveniencelinks,
 309+p.mw-protect-editreasons,
 310+p.mw-filedelete-editreasons,
 311+p.mw-delete-editreasons,
218312 p.mw-revdel-editreasons {
219313 font-size: 90%;
220314 text-align: right;
221315 }
222316
223 -/*
 317+/**
224318 * OpenSearch ajax suggestions
225319 */
226320 .os-suggest {
@@ -246,7 +340,8 @@
247341 width: 100%;
248342 }
249343
250 -.os-suggest-result, .os-suggest-result-hl {
 344+.os-suggest-result,
 345+.os-suggest-result-hl {
251346 white-space: nowrap;
252347 background-color: white;
253348 background-color: Window;
@@ -261,7 +356,8 @@
262357 }
263358 .os-suggest-result-hl {
264359 /* System colors are misimplemented in Safari 3.0 and earlier,
265 - making highlighted text illegible... */
 360+ * making highlighted text illegible...
 361+ */
266362 background-color: Highlight;
267363 color: HighlightText;
268364 }
@@ -280,8 +376,11 @@
281377 }
282378
283379 /* Page history styling */
284 -/* the auto-generated edit comments */
285 -.autocomment { color: gray; }
 380+
 381+/* The auto-generated edit comments */
 382+.autocomment {
 383+ color: gray;
 384+}
286385 #pagehistory .history-user {
287386 margin-left: 0.4em;
288387 margin-right: 0.2em;
@@ -297,16 +396,19 @@
298397 border: 1px dashed #aaa;
299398 }
300399
301 -/** Generic minor/bot/newpage styling */
302 -.newpage, .minor, .bot {
 400+/** Generic minor/bot/newpage styling (recent changes) */
 401+.newpage,
 402+.minor,
 403+.bot {
303404 font-weight: bold;
304405 }
305406
306 -#shared-image-dup, #shared-image-conflict {
 407+#shared-image-dup,
 408+#shared-image-conflict {
307409 font-style: italic;
308410 }
309411
310 -/*
 412+/**
311413 * Recreating deleted page warning
312414 * Reupload file warning
313415 * Page protection warning
@@ -332,7 +434,8 @@
333435 visibility: hidden;
334436 }
335437
336 -td.mw-revdel-checkbox, th.mw-revdel-checkbox {
 438+td.mw-revdel-checkbox,
 439+th.mw-revdel-checkbox {
337440 padding-right: 10px;
338441 text-align: center;
339442 }
@@ -351,7 +454,8 @@
352455 padding: 0 !important;
353456 }
354457 /* External URLs should always be treated as LTR (bug 4330) */
355 -/* @noflip */ .rtl a.external.free, .rtl a.external.autonumber {
 458+/* @noflip */ .rtl a.external.free,
 459+.rtl a.external.autonumber {
356460 direction: ltr;
357461 unicode-bidi: embed;
358462 }
@@ -366,7 +470,8 @@
367471 border-collapse: collapse;
368472 color: black;
369473 }
370 -.wikitable th, .wikitable td {
 474+.wikitable th,
 475+.wikitable td {
371476 border: 1px #aaa solid;
372477 padding: 0.2em;
373478 }
@@ -396,7 +501,9 @@
397502 color: red;
398503 font-size: larger;
399504 }
400 -.errorbox, .warningbox, .successbox {
 505+.errorbox,
 506+.warningbox,
 507+.successbox {
401508 font-size: larger;
402509 border: 2px solid;
403510 padding: .5em 1em;
@@ -416,7 +523,9 @@
417524 border-color: green;
418525 background-color: #dfd;
419526 }
420 -.errorbox h2, .warningbox h2, .successbox h2 {
 527+.errorbox h2,
 528+.warningbox h2,
 529+.successbox h2 {
421530 font-size: 1em;
422531 font-weight: bold;
423532 display: inline;
@@ -463,14 +572,14 @@
464573 padding: 0.2em;
465574 }
466575
467 -/*
468 - Table pager (e.g. Special:ListFiles)
469 - - remove underlines from the navigation link
470 - - collapse borders
471 - - set the borders to outsets (similar to Special:AllMessages)
472 - - remove line wrapping for all td and th, set background color
473 - - restore line wrapping for the last two table cells (description and size)
474 -*/
 576+/**
 577+ * Table pager (e.g. Special:ListFiles)
 578+ * - remove underlines from the navigation link
 579+ * - collapse borders
 580+ * - set the borders to outsets (similar to Special:AllMessages)
 581+ * - remove line wrapping for all td and th, set background color
 582+ * - restore line wrapping for the last two table cells (description and size)
 583+ */
475584 .TablePager {
476585 min-width: 80%;
477586 border-collapse: collapse;
@@ -485,7 +594,9 @@
486595 .TablePager_nav a {
487596 text-decoration: none;
488597 }
489 -.TablePager, .TablePager td, .TablePager th {
 598+.TablePager,
 599+.TablePager td,
 600+.TablePager th {
490601 border: 1px solid #aaaaaa;
491602 padding: 0 0.15em 0 0.15em;
492603 }
@@ -499,7 +610,8 @@
500611 background-color: #eeeeff;
501612 }
502613
503 -.imagelist td, .imagelist th {
 614+.imagelist td,
 615+.imagelist th {
504616 white-space: nowrap;
505617 }
506618 .imagelist .TablePager_col_links {
@@ -555,7 +667,8 @@
556668 border-collapse: collapse;
557669 }
558670
559 -table.mw_metadata td, table.mw_metadata th {
 671+table.mw_metadata td,
 672+table.mw_metadata th {
560673 text-align: center;
561674 border: 1px solid #aaaaaa;
562675 padding-left: 5px;
@@ -579,17 +692,25 @@
580693 }
581694
582695 /* Correct directionality when page dir is different from site/user dir */
583 -/* @noflip */.mw-content-ltr ul, .mw-content-rtl .mw-content-ltr ul {
584 - margin: .3em 0 0 1.5em;
 696+.mw-content-ltr ul,
 697+.mw-content-rtl .mw-content-ltr ul {
 698+ /* @noflip */
 699+ margin: 0.3em 0 0 1.5em;
585700 }
586 -/* @noflip */.mw-content-rtl ul, .mw-content-ltr .mw-content-rtl ul {
587 - margin: .3em 1.5em 0 0;
 701+.mw-content-rtl ul,
 702+.mw-content-ltr .mw-content-rtl ul {
 703+ /* @noflip */
 704+ margin: 0.3em 1.5em 0 0;
588705 }
589 -/* @noflip */.mw-content-ltr ol, .mw-content-rtl .mw-content-ltr ol {
590 - margin: .3em 0 0 3.2em;
 706+.mw-content-ltr ol,
 707+.mw-content-rtl .mw-content-ltr ol {
 708+ /* @noflip */
 709+ margin: 0.3em 0 0 3.2em;
591710 }
592 -/* @noflip */.mw-content-rtl ol, .mw-content-ltr .mw-content-rtl ol {
593 - margin: .3em 3.2em 0 0;
 711+.mw-content-rtl ol,
 712+.mw-content-ltr .mw-content-rtl ol {
 713+ /* @noflip */
 714+ margin: 0.3em 3.2em 0 0;
594715 }
595716
596717 /* Galleries */
@@ -608,7 +729,8 @@
609730 display: inline-block;
610731 }
611732
612 -ul.gallery, li.gallerybox {
 733+ul.gallery,
 734+li.gallerybox {
613735 zoom: 1;
614736 display: inline !ie;
615737 }
@@ -685,22 +807,30 @@
686808 }
687809
688810 /* Correct directionality when page dir is different from site/user dir */
689 -/* @noflip */.mw-content-ltr .toc ul, .mw-content-ltr #toc ul,
690 -.mw-content-rtl .mw-content-ltr .toc ul, .mw-content-rtl .mw-content-ltr #toc ul {
 811+/* @noflip */ .mw-content-ltr .toc ul,
 812+.mw-content-ltr #toc ul,
 813+.mw-content-rtl .mw-content-ltr .toc ul,
 814+.mw-content-rtl .mw-content-ltr #toc ul {
691815 text-align: left;
692816 margin-left: 0;
693817 }
694 -/* @noflip */.mw-content-rtl .toc ul, .mw-content-rtl #toc ul,
695 -.mw-content-ltr .mw-content-rtl .toc ul, .mw-content-ltr .mw-content-rtl #toc ul {
 818+/* @noflip */ .mw-content-rtl .toc ul,
 819+.mw-content-rtl #toc ul,
 820+.mw-content-ltr .mw-content-rtl .toc ul,
 821+.mw-content-ltr .mw-content-rtl #toc ul {
696822 text-align: right;
697823 margin-right: 0;
698824 }
699 -/* @noflip */.mw-content-ltr .toc ul ul, .mw-content-ltr #toc ul ul,
700 -.mw-content-rtl .mw-content-ltr .toc ul ul, .mw-content-rtl .mw-content-ltr #toc ul ul {
 825+/* @noflip */ .mw-content-ltr .toc ul ul,
 826+.mw-content-ltr #toc ul ul,
 827+.mw-content-rtl .mw-content-ltr .toc ul ul,
 828+.mw-content-rtl .mw-content-ltr #toc ul ul {
701829 margin: 0 0 0 2em;
702830 }
703 -/* @noflip */.mw-content-rtl .toc ul ul, .mw-content-rtl #toc ul ul,
704 -.mw-content-ltr .mw-content-rtl .toc ul ul, .mw-content-ltr .mw-content-rtl #toc ul ul {
 831+/* @noflip */ .mw-content-rtl .toc ul ul,
 832+.mw-content-rtl #toc ul ul,
 833+.mw-content-ltr .mw-content-rtl .toc ul ul,
 834+.mw-content-ltr .mw-content-rtl #toc ul ul {
705835 margin: 0 2em 0 0;
706836 }
707837
@@ -758,18 +888,18 @@
759889 background-position: 0% 100%;
760890 }
761891 /* Table Sorting */
762 -th.headerSort {
763 - background-image: url(images/sort_both.gif);
 892+th.headerSort {
 893+ background-image: url(images/sort_both.gif);
764894 cursor: pointer;
765 - background-repeat: no-repeat;
766 - background-position: center right;
 895+ background-repeat: no-repeat;
 896+ background-position: center right;
767897 padding-right: 21px;
768898 }
769 -th.headerSortUp {
770 - background-image: url(images/sort_up.gif);
 899+th.headerSortUp {
 900+ background-image: url(images/sort_up.gif);
771901 }
772 -th.headerSortDown {
773 - background-image: url(images/sort_down.gif);
 902+th.headerSortDown {
 903+ background-image: url(images/sort_down.gif);
774904 }
775905
776906 /* LTR content in RTL layout */
@@ -779,13 +909,18 @@
780910 unicode-bidi: embed;
781911 }
782912
783 -#mw-clearyourcache, #mw-sitecsspreview, #mw-sitejspreview, #mw-usercsspreview, #mw-userjspreview {
 913+#mw-clearyourcache,
 914+#mw-sitecsspreview,
 915+#mw-sitejspreview,
 916+#mw-usercsspreview,
 917+#mw-userjspreview {
784918 direction: ltr;
785919 unicode-bidi: embed;
786920 }
787921
788922 /* Correct user & content directionality when viewing a diff */
789 -.diff-currentversion-title, .diff {
 923+.diff-currentversion-title,
 924+.diff {
790925 direction: ltr;
791926 unicode-bidi: embed;
792927 }
@@ -797,27 +932,40 @@
798933 direction: ltr;
799934 unicode-bidi: embed;
800935 }
801 -.diff-otitle, .diff-ntitle, .diff-lineno {
 936+.diff-otitle,
 937+.diff-ntitle,
 938+.diff-lineno {
802939 direction: ltr !important;
803940 unicode-bidi: embed;
804941 }
805942
806 -#mw-revision-info, #mw-revision-nav {
 943+#mw-revision-info,
 944+#mw-revision-nav {
807945 direction: ltr;
808946 }
809947
810948 /* Images */
811 -/* @noflip */div.tright, div.floatright, table.floatright {
 949+
 950+/* @noflip */ div.tright,
 951+div.floatright,
 952+table.floatright {
812953 clear: right;
813954 float: right;
814955 }
815 -/* @noflip */div.tleft, div.floatleft, table.floatleft {
 956+/* @noflip */ div.tleft,
 957+div.floatleft,
 958+table.floatleft {
816959 float: left;
817960 clear: left;
818961 }
819 -div.floatright, table.floatright, div.floatleft, table.floatleft {
 962+div.floatright,
 963+table.floatright,
 964+div.floatleft,
 965+table.floatleft {
820966 position: relative;
821967 }
822968
823969 /* bug 12205 */
824 -#mw-credits a { unicode-bidi: embed; }
\ No newline at end of file
 970+#mw-credits a {
 971+ unicode-bidi: embed;
 972+}
\ No newline at end of file

Sign-offs

UserFlagDate
Nikerabbitinspected16:45, 31 August 2011
MZMcBrideinspected18:34, 31 August 2011

Comments

#Comment by MZMcBride (talk | contribs)   18:33, 31 August 2011

No newline at end of file.

/** Generic minor/bot/newpage styling (recent changes) */

That should only have one asterisk at the beginning, right?

.mw-hidden-cats-hidden {
	display: none;
}
.catlinks-allhidden {
	display: none;
}

It seemed kind of strange that these weren't combined.

 	/* System colors are misimplemented in Safari 3.0 and earlier,
	 * making highlighted text illegible...
	 */

Multi-line comments start with two asterisks, right?

I didn't see any actual typos or issues in the file, just small nitpicks.

#Comment by Krinkle (talk | contribs)   20:03, 31 August 2011

Thanks, more clean up is always welcome! You may wanna put some in CC#CSS if not already.

I'll probably do a general sweep later tonight through /skins and /resources

Status & tagging log