toolkit/themes/windows/global/menu.css

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 @import url("chrome://global/skin/menu-shared.css");
   6
   7 /* ===== menu.css =======================================================
   8   == Styles used by XUL menu-related elements.
   9   ======================================================================= */
  10
  11 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
  12
  13 /* ::::: menu/menuitem ::::: */
  14
  15 menubar > menu:-moz-window-inactive {
  16   color: ThreeDShadow;
  17 }
  18
  19 /* ..... Internal content .... */
  20
  21 .menu-accel,
  22 .menu-iconic-accel,
  23 .menu-text,
  24 .menu-iconic-text {
  25   margin: 0;
  26   padding: 1px 0;
  27 }
  28
  29 .menu-accel,
  30 .menu-iconic-accel {
  31   margin-inline: 0.74em 1.35em;
  32 }
  33
  34 .menu-iconic-icon {
  35   width: 16px;
  36   height: 16px;
  37 }
  38
  39 .menu-iconic > .menu-iconic-left,
  40 .menuitem-iconic > .menu-iconic-left {
  41   padding-top: 2px;
  42 }
  43
  44 menuitem:is([type="checkbox"], [type="radio"]):not([checked="true"]) > .menu-iconic-left > .menu-iconic-icon {
  45   display: none;
  46 }
  47
  48 /* ::::: menu/menuitems in menubar ::::: */
  49
  50 menubar > menu[_moz-menuactive="true"]:not([disabled="true"]) {
  51   color: -moz-menubarhovertext;
  52 }
  53
  54 *|*:root[lwtheme] {
  55   menubar > menu {
  56     appearance: none;
  57     border-color: transparent;
  58
  59     &:not([disabled="true"]) {
  60       color: inherit;
  61     }
  62     &[_moz-menuactive="true"]:not([disabled="true"]) {
  63       background-color: SelectedItem;
  64       color: SelectedItemText;
  65       text-shadow: none;
  66     }
  67   }
  68 }
  69
  70
  71 /* ..... internal content .... */
  72
  73 .menubar-text {
  74   margin: 1px 6px 2px;
  75 }
  76
  77 /* ::::: menu/menuitems in menulist popups ::::: */
  78
  79 menulist > menupopup > menuitem,
  80 menulist > menupopup > menucaption,
  81 menulist > menupopup > menu {
  82   max-width: none;
  83 }
  84
  85 menulist > menupopup > menuitem {
  86   padding-inline-end: 1em;
  87 }
  88
  89
  90 menulist > menupopup > menuitem > .menu-iconic-left,
  91 menulist > menupopup > menucaption > .menu-iconic-left,
  92 menulist > menupopup > menu > .menu-iconic-left {
  93   display: none;
  94 }
  95
  96 menulist > menupopup > menuitem > label,
  97 menulist > menupopup > menucaption > label,
  98 menulist > menupopup > menu > label {
  99   padding-block: 0;
 100 }
 101
 102 menulist > menupopup > menuitem[_moz-menuactive="true"][disabled="true"] {
 103   color: GrayText;
 104 }
 105
 106 menulist > menupopup > :is(menuitem, menucaption):not(.menuitem-iconic) > .menu-iconic-text {
 107   margin: 0;
 108 }
 109
 110 /* ::::: checkbox and radio menuitems ::::: */
 111
 112 menupopup[needsgutter] menu:not([icon], .menu-iconic),
 113 menupopup[needsgutter] menuitem:not([checked="true"], [icon], .menuitem-iconic) {
 114   padding-inline-start: 36px;
 115 }
 116
 117 .menu-iconic > .menu-iconic-left,
 118 .menuitem-iconic > .menu-iconic-left {
 119   margin-inline-end: 8px;
 120 }
 121
 122 menuitem[checked="true"] {
 123   padding-inline-start: 12px;
 124 }
 125
 126 /* We need to do something to override the default style for selected
 127    checkboxes and radio buttons because the native drawing we use on other
 128    Windows versions looks pretty bad with the Win10 styles, so for now we'll
 129    insert a generic checkmark icon for both types. */
 130 menuitem[checked="true"] > .menu-iconic-left {
 131   -moz-context-properties: fill, fill-opacity;
 132   fill: currentColor;
 133   fill-opacity: var(--menu-icon-opacity);
 134   list-style-image: url("chrome://global/skin/icons/menu-check.svg");
 135   width: 16px;
 136   margin-inline-end: 8px;
 137 }
 138
 139 /* ::::: menuseparator ::::: */
 140
 141 menuseparator {
 142   /* The side padding should align with the start of the menu item text. */
 143   padding-inline: 1em;
 144 }