From 0d41856eb144b3733e4c7b05ab8444b3287b924e Mon Sep 17 00:00:00 2001 From: Roan Kattouw Date: Tue, 4 Jan 2011 14:25:35 +0000 Subject: [PATCH] Add /* @embed */ comments for URLs in all RL-ified CSS files, except in jQuery UI's default theme. This'll reduce the number of images loaded, especially for jQuery UI. --- resources/jquery.tipsy/jquery.tipsy.css | 1 + .../themes/vector/jquery.ui.autocomplete.css | 2 +- .../themes/vector/jquery.ui.button.css | 4 +++ .../themes/vector/jquery.ui.dialog.css | 2 ++ .../themes/vector/jquery.ui.theme.css | 32 +++++++++---------- skins/common/config.css | 1 + skins/common/shared.css | 9 +++++- 7 files changed, 33 insertions(+), 18 deletions(-) diff --git a/resources/jquery.tipsy/jquery.tipsy.css b/resources/jquery.tipsy/jquery.tipsy.css index adf78c2f16..841c9eab21 100644 --- a/resources/jquery.tipsy/jquery.tipsy.css +++ b/resources/jquery.tipsy/jquery.tipsy.css @@ -22,6 +22,7 @@ } .tipsy-arrow { position: absolute; + /* @embed */ background: url('images/tipsy.png') no-repeat top left; width: 9px; height: 5px; diff --git a/resources/jquery.ui/themes/vector/jquery.ui.autocomplete.css b/resources/jquery.ui/themes/vector/jquery.ui.autocomplete.css index f990062436..6610a8781a 100644 --- a/resources/jquery.ui/themes/vector/jquery.ui.autocomplete.css +++ b/resources/jquery.ui/themes/vector/jquery.ui.autocomplete.css @@ -1,7 +1,7 @@ /* Autocomplete ----------------------------------*/ .ui-autocomplete { position: absolute; cursor: default; } -.ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; } +.ui-autocomplete-loading { /* @embed */ background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; } /* workarounds */ * html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */ diff --git a/resources/jquery.ui/themes/vector/jquery.ui.button.css b/resources/jquery.ui/themes/vector/jquery.ui.button.css index 874f7bf449..69cace065a 100644 --- a/resources/jquery.ui/themes/vector/jquery.ui.button.css +++ b/resources/jquery.ui/themes/vector/jquery.ui.button.css @@ -35,6 +35,7 @@ body button.ui-button { padding: 0.2em 0.6em 0.15em !important; margin: 0.5em 0 0.5em 0.4em !important; border: 1px solid #a6a6a6 !important; + /* @embed */ background: #f2f2f2 url(images/button-off.png) repeat-x scroll 50% 100% !important; cursor: pointer; font-size: 1em; @@ -44,16 +45,19 @@ body button.ui-button { } body button.ui-button:hover { border-color: #6e7273; + /* @embed */ background: #e1e1e1 url(images/button-over.png) repeat-x scroll 50% 100% !important; } body button.ui-button:active, body button.ui-button:focus { border-color: #707271; + /* @embed */ background: #bfbfbf url(images/button-down.png) repeat-x scroll 50% 100% !important; } body button.ui-button.disabled { color: #7f7f7f; border-color: #cccccc; + /* @embed */ background: #f2f2f2 url(images/button-disabled.png) repeat-x scroll 50% 100% !important; } /* Disables the annoying dashed border Firefox puts on active buttons */ diff --git a/resources/jquery.ui/themes/vector/jquery.ui.dialog.css b/resources/jquery.ui/themes/vector/jquery.ui.dialog.css index 3feb770850..2b19fcddfe 100644 --- a/resources/jquery.ui/themes/vector/jquery.ui.dialog.css +++ b/resources/jquery.ui/themes/vector/jquery.ui.dialog.css @@ -23,10 +23,12 @@ body .ui-dialog .ui-dialog-titlebar { padding: 0.9em 1.4em 0.6em !important; } body .ui-dialog .ui-widget-header { + /* @embed */ background: #f0f0f0 url(images/titlebar-fade.png) repeat-x scroll 50% 100% !important; } /* FIXME: Should just update the icon sprite if we're keeping this X */ body .ui-dialog .ui-icon-closethick { + /* @embed */ background: url(images/close.png) no-repeat 50% 50% !important; } body .ui-dialog .ui-dialog-buttonpane { diff --git a/resources/jquery.ui/themes/vector/jquery.ui.theme.css b/resources/jquery.ui/themes/vector/jquery.ui.theme.css index 4e7d18901a..dfa724282b 100644 --- a/resources/jquery.ui/themes/vector/jquery.ui.theme.css +++ b/resources/jquery.ui/themes/vector/jquery.ui.theme.css @@ -13,26 +13,26 @@ .ui-widget { font-family: sans-serif; font-size: 0.8em; } .ui-widget .ui-widget { font-size: 1em; } .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: sans-serif; font-size: 1em; } -.ui-widget-content { border: none; background: #f2f5f7 url(images/ui-bg_highlight-hard_100_f2f5f7_1x100.png) 50% top repeat-x; color: #362b36; } +.ui-widget-content { border: none; /* @embed */ background: #f2f5f7 url(images/ui-bg_highlight-hard_100_f2f5f7_1x100.png) 50% top repeat-x; color: #362b36; } .ui-widget-content a { color: #362b36; } -.ui-widget-header { border: 1px solid #aed0ea; line-height: 1em; background: #ffffff url(images/ui-bg_highlight-soft_100_ffffff_1x100.png) 50% 50% repeat-x; color: #222222; font-weight: bold; } +.ui-widget-header { border: 1px solid #aed0ea; line-height: 1em; /* @embed */ background: #ffffff url(images/ui-bg_highlight-soft_100_ffffff_1x100.png) 50% 50% repeat-x; color: #222222; font-weight: bold; } .ui-widget-header a { color: #222222; } /* Interaction states ----------------------------------*/ -.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #aed0ea; background: #d7ebf9 url(images/ui-bg_highlight-hard_80_d7ebf9_1x100.png) 50% 50% repeat-x; font-weight: normal; color: #2779aa; } +.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #aed0ea; /* @embed */ background: #d7ebf9 url(images/ui-bg_highlight-hard_80_d7ebf9_1x100.png) 50% 50% repeat-x; font-weight: normal; color: #2779aa; } .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #2779aa; text-decoration: none; } -.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #74b2e2; background: #e4f1fb url(images/ui-bg_highlight-soft_100_e4f1fb_1x100.png) 50% 50% repeat-x; font-weight: normal; color: #0070a3; } +.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #74b2e2; /* @embed */ background: #e4f1fb url(images/ui-bg_highlight-soft_100_e4f1fb_1x100.png) 50% 50% repeat-x; font-weight: normal; color: #0070a3; } .ui-state-hover a, .ui-state-hover a:hover { color: #0070a3; text-decoration: none; } -.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #cccccc; background: #f0f0f0 url(images/ui-bg_inset-hard_100_f0f0f0_1x100.png) 50% 50% repeat-x; font-weight: normal; color: #000000; } +.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #cccccc; background: #f0f0f0 /* @embed */ url(images/ui-bg_inset-hard_100_f0f0f0_1x100.png) 50% 50% repeat-x; font-weight: normal; color: #000000; } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #000000; text-decoration: none; } .ui-widget :active { outline: none; } /* Interaction Cues ----------------------------------*/ -.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {border: 1px solid #f9dd34; background: #ffef8f url(images/ui-bg_highlight-soft_25_ffef8f_1x100.png) 50% top repeat-x; color: #363636; } +.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {border: 1px solid #f9dd34; background: #ffef8f /* @embed */ url(images/ui-bg_highlight-soft_25_ffef8f_1x100.png) 50% top repeat-x; color: #363636; } .ui-state-highlight a, .ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a { color: #363636; } -.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #cd0a0a; background: #cd0a0a url(images/ui-bg_flat_15_cd0a0a_40x100.png) 50% 50% repeat-x; color: #ffffff; } +.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #cd0a0a; background: #cd0a0a /* @embed */ url(images/ui-bg_flat_15_cd0a0a_40x100.png) 50% 50% repeat-x; color: #ffffff; } .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #ffffff; } .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #ffffff; } .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } @@ -43,14 +43,14 @@ ----------------------------------*/ /* states and images */ -.ui-icon { width: 16px; height: 16px; background-image: url(images/ui-icons_72a7cf_256x240.png); } -.ui-widget-content .ui-icon {background-image: url(images/ui-icons_72a7cf_256x240.png); } -.ui-widget-header .ui-icon {background-image: url(images/ui-icons_72a7cf_256x240.png); } -.ui-state-default .ui-icon { background-image: url(images/ui-icons_3d80b3_256x240.png); } -.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(images/ui-icons_2694e8_256x240.png); } -.ui-state-active .ui-icon {background-image: url(images/ui-icons_666666_256x240.png); } -.ui-state-highlight .ui-icon {background-image: url(images/ui-icons_2e83ff_256x240.png); } -.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(images/ui-icons_ffffff_256x240.png); } +.ui-icon { width: 16px; height: 16px; /* @embed */ background-image: url(images/ui-icons_72a7cf_256x240.png); } +.ui-widget-content .ui-icon { /* @embed */ background-image: url(images/ui-icons_72a7cf_256x240.png); } +.ui-widget-header .ui-icon { /* @embed */ background-image: url(images/ui-icons_72a7cf_256x240.png); } +.ui-state-default .ui-icon { /* @embed */ background-image: url(images/ui-icons_3d80b3_256x240.png); } +.ui-state-hover .ui-icon, .ui-state-focus .ui-icon { /* @embed */ background-image: url(images/ui-icons_2694e8_256x240.png); } +.ui-state-active .ui-icon { /* @embed */ background-image: url(images/ui-icons_666666_256x240.png); } +.ui-state-highlight .ui-icon { /* @embed */ background-image: url(images/ui-icons_2e83ff_256x240.png); } +.ui-state-error .ui-icon, .ui-state-error-text .ui-icon { /* @embed */ background-image: url(images/ui-icons_ffffff_256x240.png); } /* positioning */ .ui-icon-carat-1-n { background-position: 0 0; } @@ -246,4 +246,4 @@ /* Overlays */ .ui-widget-overlay { background: #000000; opacity: .75;filter:Alpha(Opacity=75); } -.ui-widget-shadow { margin: -7px 0 0 -7px; padding: 7px; background: #000000 url(images/ui-bg_flat_70_000000_40x100.png) 50% 50% repeat-x; opacity: .20;filter:Alpha(Opacity=20); -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; } \ No newline at end of file +.ui-widget-shadow { margin: -7px 0 0 -7px; padding: 7px; /* @embed */ background: #000000 url(images/ui-bg_flat_70_000000_40x100.png) 50% 50% repeat-x; opacity: .20;filter:Alpha(Opacity=20); -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; } \ No newline at end of file diff --git a/skins/common/config.css b/skins/common/config.css index 279b70ee75..fa68fddd7c 100644 --- a/skins/common/config.css +++ b/skins/common/config.css @@ -95,6 +95,7 @@ .config-message { display: list-item; line-height: 1.5em; + /* @embed */ list-style-image: url(images/bullet.gif); list-style-type: square; } diff --git a/skins/common/shared.css b/skins/common/shared.css index eea9226c8b..d21e616274 100644 --- a/skins/common/shared.css +++ b/skins/common/shared.css @@ -581,6 +581,7 @@ td.mw-revdel-checkbox, th.mw-revdel-checkbox { /* feed links */ a.feedlink { + /* @embed */ background: url("images/feed-icon.png") center left no-repeat; padding-left: 16px; } @@ -843,6 +844,7 @@ div.gallerytext { .mw-remove-category { padding: 8px; + /* @embed */ background-image: url(images/remove.png); background-position: center center; background-repeat: no-repeat; @@ -850,12 +852,14 @@ div.gallerytext { .mw-ajax-addcategory { padding-left: 20px; + /* @embed */ background-image: url(images/add.png); background-position: left center; background-repeat: no-repeat; } .mw-ajax-loader { + /* @embed */ background-image: url(images/ajax-loader.gif); background-position: center center; background-repeat: no-repeat; @@ -867,6 +871,7 @@ div.gallerytext { .mw-small-spinner { padding: 10px !important; margin-right: 0.6em; + /* @embed */ background-image: url(images/spinner.gif); background-position: center center; background-repeat: no-repeat; @@ -905,6 +910,7 @@ ol:lang(bn) li { padding-left: 15px; margin-left: 2px; margin-bottom: -8px; + /* @embed */ background-image: url('images/help-question.gif'); background-position: left center; background-repeat: no-repeat; @@ -914,6 +920,7 @@ ol:lang(bn) li { font-size: .8em; } .mw-help-field-hint:hover { + /* @embed */ background-image: url('images/help-question-hover.gif'); } .mw-help-field-data { @@ -925,5 +932,5 @@ ol:lang(bn) li { } .tipsy { padding: 5px 5px 10px; font-size: 12px; position: absolute; z-index: 100000; overflow: visible; } .tipsy-inner { padding: 5px 8px 4px 8px; background-color: #d6f3ff; color: black; border: 1px solid #5dc9f4; max-width: 300px; text-align: left; } -.tipsy-arrow { position: absolute; background: url( 'images/tipsy-arrow.gif' ) no-repeat top left; width: 13px; height: 13px; } +.tipsy-arrow { position: absolute; /* @embed */ background: url( 'images/tipsy-arrow.gif' ) no-repeat top left; width: 13px; height: 13px; } .tipsy-se .tipsy-arrow { bottom: -2px; right: 10px; background-position: 0% 100%; } -- 2.20.1