X-Git-Url: https://git.heureux-cyclage.org/?p=lhc%2Fweb%2Fwiklou.git;a=blobdiff_plain;f=resources%2Fsrc%2Fmediawiki.skinning%2Fcontent.parsoid.less;h=20668ebefb2498aba283321e8db115e49ed59d80;hp=69907f19b7cc80be7d9bedd35132682774d6a365;hb=fb4821adfc3ab95d9c5c0be1162139f99bfebf6c;hpb=c50920f5d440e5e1bf12296b0fc42a543b1f5bf6

diff --git a/resources/src/mediawiki.skinning/content.parsoid.less b/resources/src/mediawiki.skinning/content.parsoid.less
index 69907f19b7..20668ebefb 100644
--- a/resources/src/mediawiki.skinning/content.parsoid.less
+++ b/resources/src/mediawiki.skinning/content.parsoid.less
@@ -8,11 +8,11 @@
  * counting. This way the counting style can be customized, and counts update
  * automatically when content is modified.
  */
-.mw-body-content {
+.mw-parser-output {
 	counter-reset: mw-numbered-ext-link;
 }
 
-.mw-body-content a[rel~='mw:ExtLink']:empty:after {
+.mw-parser-output a[rel~='mw:ExtLink']:empty:after {
 	content: '[' counter( mw-numbered-ext-link ) ']';
 	counter-increment: mw-numbered-ext-link;
 }
@@ -80,31 +80,14 @@ figure[typeof*='mw:Audio'] {
 	&.mw-halign-center {
 		margin: 0 auto 0.5em auto;
 		display: table;
+		border-collapse: collapse;
 		clear: none;
 		float: none;
 	}
 
+	/* Hide the caption for frameless and plain floated images */
 	> figcaption {
-		display: table-caption;
-		caption-side: bottom;
-		/* In mw-core the font-size is duplicated, 94% in thumbiner
-		 * and again 94% in thumbcaption. 88.4% for font size of the
-		 * caption results in the same behavior. */
-		font-size: 88.4%;
-		line-height: 1.4em;
-		text-align: left;
-
-		border: 1px solid #c8ccd1;
-		border-top: 0;
-
-		/* taken from .thumbcaption, plus .thumbinner */
-		padding: 0 6px 6px 6px;
-		background-color: #f8f9fa;
-
-		table {
-			/* reset caption side for tables inside figcaptions */
-			caption-side: top;
-		}
+		display: none;
 	}
 }
 
@@ -115,12 +98,18 @@ figure[typeof~='mw:Image/Frame'],
 figure[typeof~='mw:Video/Frame'],
 figure[typeof~='mw:Audio/Frame'] {
 	display: table;
-	overflow: auto;
 	text-align: center;
 	border: 1px solid #c8ccd1;
-	border-bottom: 0; // No border to caption
-	border-collapse: collapse;
+	border-collapse: separate;
+	border-spacing: 3px;
 	background-color: #f8f9fa;
+	width: 1px;  // From https://stackoverflow.com/a/6536025
+
+	// Avoid !important
+	&.mw-halign-center {
+		border-collapse: separate;
+	}
+
 	// Default to right alignment. This is needed since Parsoid only specifies the
 	// alignment class when the alignment is explicitly set.
 	margin: 0.5em 0 1.3em 1.4em;
@@ -131,10 +120,53 @@ figure[typeof~='mw:Audio/Frame'] {
 		> img,
 		> video {
 			border: 1px solid #c8ccd1;
-			margin: 3px;
 			background: #fff;
 		}
 	}
+
+	> figcaption {
+		display: block;
+
+		/* In mw-core the font-size is duplicated, 94% in thumbiner
+		 * and again 94% in thumbcaption. 88.4% for font size of the
+		 * caption results in the same behavior. */
+		font-size: 88.4%;
+		line-height: 1.4em;
+		text-align: left;
+
+		/* taken from .thumbcaption, plus .thumbinner */
+		padding: 3px;
+	}
+}
+
+figure[typeof*='mw:Image/Thumb'],
+figure[typeof*='mw:Video/Thumb'],
+figure[typeof*='mw:Audio/Thumb'] {
+	> a:after {
+		content: '';
+		width: 15px;
+		height: 11px;
+		margin: 3px;
+		margin-bottom: 0;
+
+		.mw-content-ltr & {
+			/* @noflip */
+			float: right;
+			/* @noflip */
+			background-image: url( images/magnify-clip-ltr.png );
+			/* @noflip */
+			background-image: linear-gradient( transparent, transparent ), url( images/magnify-clip-ltr.svg );
+		}
+
+		.mw-content-rtl & {
+			/* @noflip */
+			float: left;
+			/* @noflip */
+			background-image: url( images/magnify-clip-rtl.png );
+			/* @noflip */
+			background-image: linear-gradient( transparent, transparent ), url( images/magnify-clip-rtl.svg );
+		}
+	}
 }
 
 /* Same as img.thumbborder in content.css */
@@ -144,15 +176,3 @@ figure[typeof~='mw:Audio/Frame'] {
 		border: 1px solid #eaecf0;
 	}
 }
-
-/* Hide the caption for frameless and plain floated images */
-figure[typeof~='mw:Image/Frameless'],
-figure[typeof~='mw:Video/Frameless'],
-figure[typeof~='mw:Audio/Frameless'],
-figure[typeof~='mw:Image'],
-figure[typeof~='mw:Video'],
-figure[typeof~='mw:Audio'] {
-	> figcaption {
-		display: none;
-	}
-}