layout/style/TopLevelImageDocument.css

   1 /* -*- Mode: C++; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
   2 /* This Source Code Form is subject to the terms of the Mozilla Public
   3  * License, v. 2.0. If a copy of the MPL was not distributed with this
   4  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   5
   6 /*
   7   This CSS stylesheet defines the rules to be applied to ImageDocuments that
   8   are top level (e.g. not iframes).
   9 */
  10
  11 @media not print {
  12   :root {
  13     /* The font color here was chosen to be readable over the corresponding
  14        backgrounds. This is important in case this ImageDocument is for an
  15        image that happens to be corrupt, in which case we'll display a textual
  16        error message over the background, instead of the image itself. */
  17     color: #eee;
  18     /* The background-attachment is fixed to stop an ugly white gutter
  19        from appearing when the document is overscrolled. */
  20     background: url("chrome://global/skin/media/imagedoc-darknoise.png") fixed;
  21   }
  22
  23   img.transparent {
  24     color: #222;
  25     background: hsl(0,0%,90%) url("chrome://global/skin/media/imagedoc-lightnoise.png");
  26   }
  27
  28   img {
  29     text-align: center;
  30     position: absolute;
  31     inset: 0;
  32     margin: auto;
  33   }
  34
  35   img.overflowingVertical {
  36     /* If we're overflowing vertically, we need to set margin-top to
  37        0.  Otherwise we'll end up trying to vertically center, and end
  38        up cutting off the top part of the image. */
  39     margin-top: 0;
  40   }
  41
  42   .completeRotation {
  43     transition: transform 0.3s ease 0s;
  44   }
  45 }
  46
  47 img {
  48   image-orientation: from-image;
  49 }