@elastic/eui
Version:
Elastic UI Component Library
35 lines (33 loc) • 2.2 kB
JavaScript
/*
* 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.
*/
import { css } from '@emotion/react';
import { logicalCSS, logicalShorthandCSS, highContrastModeStyles } from '../../../global_styling';
import { euiButtonDisplayStyles } from '../button_display/_button_display.styles';
export var euiButtonEmptyStyles = function euiButtonEmptyStyles(euiThemeContext) {
var euiTheme = euiThemeContext.euiTheme;
// EuiButtonEmpty uses the same size/font styling as EuiButtonDisplay,
// but does not share enough of the same colors/props to the point
// of using the actual component - so we'll reuse its styles instead
var displayStyles = euiButtonDisplayStyles(euiThemeContext);
return {
euiButtonEmpty: /*#__PURE__*/css(displayStyles.euiButtonDisplay, " ", logicalShorthandCSS('padding', "0 ".concat(euiTheme.size.s)), ";;label:euiButtonEmpty;"),
isDisabled: displayStyles.isDisabled,
// Sizes
xs: displayStyles.xs,
s: displayStyles.s,
// uses array here to prevent adding duplicate "m" classname partial
m: [displayStyles.m, "\n ".concat(logicalCSS('padding-horizontal', euiTheme.size.m), "\n ")],
// Flush sides
flush: /*#__PURE__*/css("padding-inline:0;&&:hover,&&:active{background-color:transparent;&::before{display:none;}}&:hover:not(:disabled),&:focus{text-decoration:underline;", highContrastModeStyles(euiThemeContext, {
forced: "\n /* hides HCM hover border, flush buttons use text-decoration */\n &::after {\n display: none;\n }\n "
}), ";}.euiButtonEmpty__content{gap:", euiTheme.size.s, ";}.euiButtonEmpty__text{padding:0;};label:flush;"),
left: /*#__PURE__*/css(logicalCSS('margin-right', euiTheme.size.s), ";;label:left;"),
right: /*#__PURE__*/css(logicalCSS('margin-left', euiTheme.size.s), ";;label:right;"),
both: /*#__PURE__*/css(";label:both;")
};
};