mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-20 08:45:46 +00:00
12de3945a4
Collapsing thumb causes frame of scrollbar to cache an incorrect pref size, which makes it not able to appear in certain cases. This patch changes it to use "visibility: hidden" instead so that the thumb is hidden but still contributes to the width of scrollbar. An alternative would be also change the code in nsScrollbarFrame to set something other than collapsed attribute instead, but I'm not sure whether doing that is any better than just adding a rule. We need the rule anyway regardless of what we set on the element. Differential Revision: https://phabricator.services.mozilla.com/D15244 --HG-- extra : moz-landing-system : lando
168 lines
3.8 KiB
CSS
168 lines
3.8 KiB
CSS
/* This Source Code Form is subject to the terms of the Mozilla Public
|
|
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
|
|
|
/**
|
|
* This file should only contain a minimal set of rules for the XUL elements
|
|
* that may be implicitly created as part of HTML/SVG documents (e.g.
|
|
* scrollbars). Rules for everything else related to XUL can be found in
|
|
* xul.css. (This split of the XUL rules is to minimize memory use and improve
|
|
* performance in HTML/SVG documents.)
|
|
*
|
|
* This file should also not contain any app specific styling. Defaults for
|
|
* widgets of a particular application should be in that application's style
|
|
* sheet. For example style definitions for navigator can be found in
|
|
* navigator.css.
|
|
*
|
|
* THIS FILE IS LOCKED DOWN. YOU ARE NOT ALLOWED TO MODIFY IT WITHOUT FIRST
|
|
* HAVING YOUR CHANGES REVIEWED BY enndeakin@gmail.com
|
|
*/
|
|
|
|
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */
|
|
|
|
* {
|
|
-moz-user-focus: ignore;
|
|
-moz-user-select: none;
|
|
display: -moz-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
:root {
|
|
text-rendering: optimizeLegibility;
|
|
-moz-control-character-visibility: visible;
|
|
}
|
|
|
|
:root:-moz-locale-dir(rtl) {
|
|
direction: rtl;
|
|
}
|
|
|
|
/* hide the content and destroy the frame */
|
|
[hidden="true"] {
|
|
display: none;
|
|
}
|
|
|
|
/* hide the content, but don't destroy the frames */
|
|
[collapsed="true"],
|
|
[moz-collapsed="true"] {
|
|
visibility: collapse;
|
|
}
|
|
|
|
/********** resizer **********/
|
|
|
|
resizer {
|
|
position: relative;
|
|
z-index: 2147483647;
|
|
/* Widget gets decide on its own whether or not the native theme should apply,
|
|
based on the context/OS theme. If it does not, SVG background will kick in. */
|
|
-moz-appearance: resizer;
|
|
|
|
/* native resizer should never flip on its own;
|
|
we will flip it (or the SVG background) with CSS transform below. */
|
|
direction: ltr;
|
|
writing-mode: initial;
|
|
|
|
background: url("chrome://global/skin/icons/resizer.svg") no-repeat;
|
|
background-size: 100% 100%;
|
|
cursor: se-resize;
|
|
width: 15px;
|
|
height: 15px;
|
|
}
|
|
|
|
/* bottomstart/bottomend is supported in XUL window only */
|
|
resizer[dir="bottom"][flip],
|
|
resizer[dir="bottomleft"],
|
|
resizer[dir="bottomstart"]:-moz-locale-dir(ltr),
|
|
resizer[dir="bottomend"]:-moz-locale-dir(rtl) {
|
|
transform: scaleX(-1);
|
|
}
|
|
|
|
resizer[dir="bottomleft"],
|
|
resizer[dir="bottomstart"]:-moz-locale-dir(ltr),
|
|
resizer[dir="bottomend"]:-moz-locale-dir(rtl) {
|
|
cursor: sw-resize;
|
|
}
|
|
|
|
resizer[dir="top"],
|
|
resizer[dir="bottom"] {
|
|
cursor: ns-resize;
|
|
}
|
|
|
|
resizer[dir="left"] {
|
|
transform: scaleX(-1);
|
|
}
|
|
|
|
resizer[dir="left"],
|
|
resizer[dir="right"] {
|
|
cursor: ew-resize;
|
|
}
|
|
|
|
resizer[dir="topleft"] {
|
|
cursor: nw-resize;
|
|
}
|
|
|
|
resizer[dir="topright"] {
|
|
cursor: ne-resize;
|
|
}
|
|
|
|
/********** scrollbar **********/
|
|
|
|
/* Scrollbars are never flipped even if BiDI kicks in. */
|
|
scrollbar[orient="horizontal"] {
|
|
direction: ltr;
|
|
}
|
|
|
|
thumb {
|
|
display: -moz-box !important;
|
|
}
|
|
|
|
/* Don't collapse thumb when scrollbar is disabled. */
|
|
thumb[collapsed="true"] {
|
|
visibility: hidden;
|
|
}
|
|
|
|
scrollbar, scrollbarbutton, scrollcorner, slider, thumb {
|
|
-moz-user-select: none;
|
|
}
|
|
|
|
scrollcorner {
|
|
display: -moz-box !important;
|
|
}
|
|
|
|
scrollcorner[hidden="true"] {
|
|
display: none !important;
|
|
}
|
|
|
|
scrollbar[value="hidden"] {
|
|
visibility: hidden;
|
|
}
|
|
|
|
@media (-moz-scrollbar-start-backward: 0) {
|
|
scrollbarbutton[sbattr="scrollbar-up-top"] {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
@media (-moz-scrollbar-start-forward: 0) {
|
|
scrollbarbutton[sbattr="scrollbar-down-top"] {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
@media (-moz-scrollbar-end-backward: 0) {
|
|
scrollbarbutton[sbattr="scrollbar-up-bottom"] {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
@media (-moz-scrollbar-end-forward: 0) {
|
|
scrollbarbutton[sbattr="scrollbar-down-bottom"] {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
@media (-moz-scrollbar-thumb-proportional) {
|
|
thumb[sbattr="scrollbar-thumb"] {
|
|
-moz-box-flex: 1;
|
|
}
|
|
}
|