maxmustermann/kibana
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

[KQL] Fixed styles of KQL textarea for the K8 theme (#96190)

Browse source 
* Fixed style of KQL textarea for K8 theme and some general heights and borders

* Fix popover paddings
This commit is contained in:
Caroline Horn 2021-04-05 09:05:30 -04:00 committed by GitHub
parent b670ef29ae
commit 76acef0c2c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 20 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/plugins/data/public/ui/filter_bar/filter_editor/index.tsx
View file

@ -85,7 +85,7 @@ class FilterEditorUI extends Component<Props, State> {
public render() {
return (
<div>
<EuiPopoverTitle>
<EuiPopoverTitle paddingSize="m">
<EuiFlexGroup alignItems="baseline" responsive={false}>
<EuiFlexItem>
<FormattedMessage

2
src/plugins/data/public/ui/filter_bar/filter_options.tsx
View file

@ -161,7 +161,7 @@ class FilterOptionsUI extends Component<Props, State> {
panelPaddingSize="none"
repositionOnScroll
>
<EuiPopoverTitle>
<EuiPopoverTitle paddingSize="m">
<FormattedMessage
id="data.filter.searchBar.changeAllFiltersTitle"
defaultMessage="Change all filters"

17
src/plugins/data/public/ui/query_string_input/_query_bar.scss
View file

@ -6,6 +6,7 @@
// Uses the append style, but no bordering
.kqlQueryBar__languageSwitcherButton {
border-right: none !important;
border-left: $euiFormInputGroupBorder;
}
.kbnQueryBar__textareaWrap {
@ -13,19 +14,31 @@
display: flex;
flex: 1 1 100%;
position: relative;
@include kbnThemeStyle('v8') {
background-color: $euiFormBackgroundColor;
}
}
.kbnQueryBar__textarea {
z-index: $euiZContentMenu;
resize: none !important; // When in the group, it will autosize
height: $euiFormControlHeight;
height: $euiFormControlHeight - 2px;
// Unlike most inputs within layout control groups, the text area still needs a border
// for multi-line content. These adjusts help it sit above the control groups
// shadow to line up correctly.
padding: $euiSizeS;
padding-top: $euiSizeS + 3px;
box-shadow: 0 0 0 1px $euiFormBorderColor;
@include kbnThemeStyle('v7') {
padding-top: $euiSizeS + 2px;
}
@include kbnThemeStyle('v8') {
border-radius: 0;
padding-bottom: $euiSizeS + 1px;
}
&:not(.kbnQueryBar__textarea--autoHeight):not(:invalid) {
@include euiYScrollWithShadows;
}

2
src/plugins/data/public/ui/query_string_input/language_switcher.tsx
View file

@ -96,7 +96,7 @@ export function QueryLanguageSwitcher({
/>
</EuiPopoverTitle>
<div style={{ width: '350px' }}>
<EuiText>
<EuiText size="s">
<p>
<FormattedMessage
id="data.query.queryBar.syntaxOptionsDescription"

4
src/plugins/data/public/ui/saved_query_management/saved_query_management_component.tsx
View file

@ -202,7 +202,7 @@ export function SavedQueryManagementComponent({
className="kbnSavedQueryManagement__popover"
data-test-subj="saved-query-management-popover"
>
<EuiPopoverTitle id={'savedQueryManagementPopoverTitle'}>
<EuiPopoverTitle paddingSize="m" id={'savedQueryManagementPopoverTitle'}>
{savedQueryPopoverTitleText}
</EuiPopoverTitle>
{savedQueries.length > 0 ? (
@ -234,7 +234,7 @@ export function SavedQueryManagementComponent({
<EuiSpacer size="s" />
</Fragment>
)}
<EuiPopoverFooter>
<EuiPopoverFooter paddingSize="m">
<EuiFlexGroup
direction="rowReverse"
gutterSize="s"