$ig->setParser( $this );
$ig->setHideBadImages();
$ig->setAttributes( Sanitizer::validateTagAttributes( $params, 'table' ) );
+ $this->getOutput()->addModuleStyles( 'mediawiki.page.gallery.styles' );
if ( isset( $params['showfilename'] ) ) {
$ig->setShowFilename( true );
'mediawiki.page.gallery' => array(
'scripts' => 'resources/src/mediawiki.page/mediawiki.page.gallery.js',
'dependencies' => array(
+ 'mediawiki.page.gallery.styles',
'jquery.throttle-debounce',
)
),
+ 'mediawiki.page.gallery.styles' => array(
+ 'styles' => array(
+ 'resources/src/mediawiki.page/mediawiki.page.gallery.print.css' => array( 'media' => 'print' ),
+ 'resources/src/mediawiki.page/mediawiki.page.gallery.css',
+ ),
+ 'position' => 'top',
+ 'targets' => array( 'desktop', 'mobile' ),
+ ),
'mediawiki.page.ready' => array(
'scripts' => 'resources/src/mediawiki.page/mediawiki.page.ready.js',
'dependencies' => array(
'mediawiki.legacy.commonPrint' => array(
'position' => 'top',
'styles' => array(
+ // @todo: Remove mediawiki.page.gallery when cache has cleared
+ 'resources/src/mediawiki.page/mediawiki.page.gallery.print.css' => array( 'media' => 'print' ),
'resources/src/mediawiki.legacy/commonPrint.css' => array( 'media' => 'print' )
),
'group' => 'print',
'mediawiki.legacy.shared' => array(
'position' => 'top',
'styles' => array(
+ // @todo: Remove when mediawiki.page.gallery in cached html.
+ 'resources/src/mediawiki.page/mediawiki.page.gallery.css',
'resources/src/mediawiki.legacy/shared.css' => array( 'media' => 'screen' )
),
),
border: 1px solid #dddddd;
}
-/**
- * Galleries (see shared.css for more info)
- */
-li.gallerybox {
- vertical-align: top;
- display: inline-block;
-}
-
-ul.gallery, li.gallerybox {
- zoom: 1;
- *display: inline;
-}
-
-ul.gallery {
- margin: 2px;
- padding: 2px;
- display: block;
-}
-
-li.gallerycaption {
- font-weight: bold;
- text-align: center;
- display: block;
- word-wrap: break-word;
-}
-
-li.gallerybox div.thumb {
- text-align: center;
- border: 1px solid #ccc;
- margin: 2px;
-}
-
-div.gallerytext {
- overflow: hidden;
- font-size: 94%;
- padding: 2px 4px;
- word-wrap: break-word;
-}
-
/**
* Table rendering
* As on shared.css but with white background.
margin-left: 0;
}
-/* Galleries */
-/* These display attributes look nonsensical, but are needed to support IE and FF2 */
-/* Don't forget to update commonPrint.css */
-li.gallerybox {
- vertical-align: top;
- display: -moz-inline-box;
- display: inline-block;
-}
-
-ul.gallery,
-li.gallerybox {
- zoom: 1;
- *display: inline;
-}
-
-ul.gallery {
- margin: 2px;
- padding: 2px;
- display: block;
-}
-
-li.gallerycaption {
- font-weight: bold;
- text-align: center;
- display: block;
- word-wrap: break-word;
-}
-
-li.gallerybox div.thumb {
- text-align: center;
- border: 1px solid #ccc;
- background-color: #f9f9f9;
- margin: 2px;
-}
-
-li.gallerybox div.thumb img {
- display: block;
- margin: 0 auto;
-}
-
-div.gallerytext {
- overflow: hidden;
- font-size: 94%;
- padding: 2px 4px;
- word-wrap: break-word;
-}
-
-/* new gallery stuff */
-ul.mw-gallery-nolines li.gallerybox div.thumb {
- background-color: transparent;
- border: none;
-}
-
-ul.mw-gallery-nolines li.gallerybox div.gallerytext {
- text-align: center;
-}
-
-/* height constrained gallery */
-
-ul.mw-gallery-packed li.gallerybox div.thumb,
-ul.mw-gallery-packed-overlay li.gallerybox div.thumb,
-ul.mw-gallery-packed-hover li.gallerybox div.thumb {
- background-color: transparent;
- border: none;
-}
-
-ul.mw-gallery-packed li.gallerybox div.thumb img,
-ul.mw-gallery-packed-overlay li.gallerybox div.thumb img,
-ul.mw-gallery-packed-hover li.gallerybox div.thumb img {
- margin: 0 auto;
-}
-
-ul.mw-gallery-packed-hover li.gallerybox,
-ul.mw-gallery-packed-overlay li.gallerybox {
- position: relative;
-}
-
-ul.mw-gallery-packed-hover div.gallerytextwrapper {
- overflow: hidden;
- height: 0;
-}
-
-ul.mw-gallery-packed-hover li.gallerybox:hover div.gallerytextwrapper,
-ul.mw-gallery-packed-overlay li.gallerybox div.gallerytextwrapper,
-ul.mw-gallery-packed-hover li.gallerybox.mw-gallery-focused div.gallerytextwrapper {
- position: absolute;
- background: white;
- background: rgba(255, 255, 255, 0.8);
- padding: 5px 10px;
- bottom: 0;
- left: 0; /* Needed for IE */
- height: auto;
- font-weight: bold;
- margin: 2px; /* correspond to style on div.thumb */
-}
-
-ul.mw-gallery-packed-hover,
-ul.mw-gallery-packed-overlay,
-ul.mw-gallery-packed {
- text-align: center;
-}
-
.mw-ajax-loader {
background-image: url(images/ajax-loader.gif);
background-position: center center;
--- /dev/null
+/* Galleries */
+/* These display attributes look nonsensical, but are needed to support IE and FF2 */
+/* Don't forget to update commonPrint.css */
+li.gallerybox {
+ vertical-align: top;
+ display: -moz-inline-box;
+ display: inline-block;
+}
+
+ul.gallery,
+li.gallerybox {
+ zoom: 1;
+ *display: inline;
+}
+
+ul.gallery {
+ margin: 2px;
+ padding: 2px;
+ display: block;
+}
+
+li.gallerycaption {
+ font-weight: bold;
+ text-align: center;
+ display: block;
+ word-wrap: break-word;
+}
+
+li.gallerybox div.thumb {
+ text-align: center;
+ border: 1px solid #ccc;
+ background-color: #f9f9f9;
+ margin: 2px;
+}
+
+li.gallerybox div.thumb img {
+ display: block;
+ margin: 0 auto;
+}
+
+div.gallerytext {
+ overflow: hidden;
+ font-size: 94%;
+ padding: 2px 4px;
+ word-wrap: break-word;
+}
+
+/* new gallery stuff */
+ul.mw-gallery-nolines li.gallerybox div.thumb {
+ background-color: transparent;
+ border: none;
+}
+
+ul.mw-gallery-nolines li.gallerybox div.gallerytext {
+ text-align: center;
+}
+
+/* height constrained gallery */
+
+ul.mw-gallery-packed li.gallerybox div.thumb,
+ul.mw-gallery-packed-overlay li.gallerybox div.thumb,
+ul.mw-gallery-packed-hover li.gallerybox div.thumb {
+ background-color: transparent;
+ border: none;
+}
+
+ul.mw-gallery-packed li.gallerybox div.thumb img,
+ul.mw-gallery-packed-overlay li.gallerybox div.thumb img,
+ul.mw-gallery-packed-hover li.gallerybox div.thumb img {
+ margin: 0 auto;
+}
+
+ul.mw-gallery-packed-hover li.gallerybox,
+ul.mw-gallery-packed-overlay li.gallerybox {
+ position: relative;
+}
+
+ul.mw-gallery-packed-hover div.gallerytextwrapper {
+ overflow: hidden;
+ height: 0;
+}
+
+ul.mw-gallery-packed-hover li.gallerybox:hover div.gallerytextwrapper,
+ul.mw-gallery-packed-overlay li.gallerybox div.gallerytextwrapper,
+ul.mw-gallery-packed-hover li.gallerybox.mw-gallery-focused div.gallerytextwrapper {
+ position: absolute;
+ background: white;
+ background: rgba(255, 255, 255, 0.8);
+ padding: 5px 10px;
+ bottom: 0;
+ left: 0; /* Needed for IE */
+ height: auto;
+ font-weight: bold;
+ margin: 2px; /* correspond to style on div.thumb */
+}
+
+ul.mw-gallery-packed-hover,
+ul.mw-gallery-packed-overlay,
+ul.mw-gallery-packed {
+ text-align: center;
+}
--- /dev/null
+li.gallerybox {
+ vertical-align: top;
+ display: inline-block;
+}
+
+ul.gallery, li.gallerybox {
+ zoom: 1;
+ *display: inline;
+}
+
+ul.gallery {
+ margin: 2px;
+ padding: 2px;
+ display: block;
+}
+
+li.gallerycaption {
+ font-weight: bold;
+ text-align: center;
+ display: block;
+ word-wrap: break-word;
+}
+
+li.gallerybox div.thumb {
+ text-align: center;
+ border: 1px solid #ccc;
+ margin: 2px;
+}
+
+div.gallerytext {
+ overflow: hidden;
+ font-size: 94%;
+ padding: 2px 4px;
+ word-wrap: break-word;
+}