wcfsetup/install/files/style/ui/pageAction.scss

   1 .pageAction {
   2         bottom: 10px;
   3         display: flex;
   4         justify-content: flex-end;
   5         left: 10px;
   6         pointer-events: none;
   7         position: fixed;
   8         right: 10px;
   9         z-index: 400;
  10
  11         .pageActionButtons {
  12                 display: flex;
  13                 flex: 0 auto;
  14                 overflow: auto;
  15         }
  16
  17         .pageActionButtons,
  18         .pageActionButtonToTop {
  19                 pointer-events: all;
  20         }
  21
  22         .pageActionButton {
  23                 display: flex;
  24                 flex: 0 0 auto;
  25                 white-space: nowrap;
  26
  27                 &:not(:first-child) {
  28                         margin-left: 5px;
  29                 }
  30
  31                 &.remove {
  32                         opacity: 0 !important;
  33                         visibility: hidden !important;
  34                 }
  35         }
  36
  37         .pageActionButton,
  38         .pageActionButtonToTop {
  39                 opacity: 0;
  40                 transition: visibility 0.12s linear, opacity 0.12s linear;
  41                 visibility: hidden;
  42
  43                 &[aria-hidden="false"] {
  44                         opacity: 1;
  45                         visibility: visible;
  46                 }
  47         }
  48
  49         .pageActionButtonToTop {
  50                 align-self: flex-start;
  51                 flex: 0 0 auto;
  52                 margin-left: 5px;
  53                 padding: 2px;
  54         }
  55
  56         @include screen-sm-down {
  57                 /* The iOS bottom touch zone is approximately 44px high. Any touches within will show the
  58                    menu instead of registering any touch on a button. */
  59                 bottom: 44px;
  60
  61                 &.scrolledDown .pageActionButton,
  62                 &.scrolledDown .pageActionButtonToTop {
  63                         opacity: 0;
  64                         visibility: hidden;
  65                         transition-delay: 0.4s;
  66                 }
  67         }
  68 }
  69
  70 .pageOverlayActive .pageAction {
  71         display: none;
  72 }
  73
  74 @include screen-xs {
  75         .redactorActive .pageAction {
  76                 display: none !important;
  77         }
  78 }