@elastic/eui
Version:
Elastic UI Component Library
36 lines (33 loc) • 2.28 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.euiDataGridScrollBarStyles = void 0;
var _react = require("@emotion/react");
var _global_styling = require("../../../global_styling");
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/
var euiDataGridScrollBarStyles = exports.euiDataGridScrollBarStyles = function euiDataGridScrollBarStyles(euiThemeContext) {
var euiTheme = euiThemeContext.euiTheme;
// Note that 'borders' *must* be rendered with inset box-shadow, because actual
// `border` CSS will affect the relative position of the child scroll bar overlays
// and cause them to be off by the width of the border
var borderWidth = euiTheme.border.width.thin;
var borderColor = euiTheme.border.color;
return {
euiDataGrid__scrollOverlay: /*#__PURE__*/(0, _react.css)("position:absolute;inset:0;", (0, _global_styling.logicalCSS)('top', "-".concat(borderWidth)), "pointer-events:none;box-shadow:inset 0 0 0 ", borderWidth, " ", borderColor, ";.euiDataGrid--bordersHorizontal &{box-shadow:inset 0 -", (0, _global_styling.mathWithUnits)(borderWidth, function (x) {
return x * 2;
}), " 0 -", borderWidth, " ", borderColor, ";};label:euiDataGrid__scrollOverlay;"),
// Ensure the horizontal scrollbar has a top border
euiDataGrid__scrollBarOverlayBottom: /*#__PURE__*/(0, _react.css)("position:absolute;inset-inline:0;", (0, _global_styling.logicalCSS)('height', borderWidth), " background-color:", borderColor, ";;label:euiDataGrid__scrollBarOverlayBottom;"),
// Ensure the vertical scrollbar has a left border
euiDataGrid__scrollBarOverlayRight: /*#__PURE__*/(0, _react.css)("position:absolute;", (0, _global_styling.logicalCSS)('width', borderWidth), " background-color:", borderColor, ";;label:euiDataGrid__scrollBarOverlayRight;")
// Note: Scroll bar border positions are set via JS inline style, since
// JS has access to the exact OS scrollbar width/height and CSS doesn't
};
};