Make sure images that don't have an explicit alignment get aligned right
[lhc/web/wiklou.git] / resources / src / mediawiki.skinning / content.parsoid.less
index 0ab4b37..a9f0ab4 100644 (file)
@@ -29,28 +29,28 @@ figure[typeof*='mw:Image'] {
                border: 0;
        }
 
-       .mw-halign-right {
+       &.mw-halign-right {
                /* @noflip */
                margin: .5em 0 1.3em 1.4em;
                /* @noflip */
-               clear: left;
+               clear: right;
                /* @noflip */
-               float: left;
+               float: right;
        }
 
-       /* @noflip */
-       .mw-halign-left {
+       &.mw-halign-left {
                /* @noflip */
                margin: .5em 1.4em 1.3em 0;
                /* @noflip */
-               clear: right;
+               clear: left;
                /* @noflip */
-               float: right;
+               float: left;
        }
 
-       .mw-halign-center {
-               margin-left: auto;
-               margin-right: auto;
+       &.mw-halign-center {
+               margin: 0 auto .5em auto;
+               clear: none;
+               float: none;
        }
 
        figcaption {
@@ -68,9 +68,22 @@ figure[typeof*='mw:Image'] {
        }
 }
 
-figure[typeof~='mw:Image/Thumb'], figure[typeof~='mw:Image/Frame'] {
+figure[typeof~='mw:Image/Thumb'],
+figure[typeof~='mw:Image/Frame'] {
        display: table;
        overflow: hidden;
        text-align: center;
        padding: 3px;
+       border: 1px solid #ccc;
+       background-color: #f9f9f9;
+       // Default to right alignment. This is needed since Parsoid only specifies the
+       // alignment class when the alignment is explicitly set.
+       margin: .5em 0 1.3em 1.4em;
+       clear: right;
+       float: right;
 }
+
+figure[typeof~='mw:Image/Thumb'] img,
+.mw-image-border img {
+       border: 1px solid #cccccc;
+}
\ No newline at end of file