github/karma
1
0
Fork 0
mirror of https://github.com/prymitive/karma synced 2026-05-05 03:16:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): more minimalistic style of the top filter bar

Browse Source
This commit is contained in:
Łukasz Mierzwa
2019-11-21 20:53:52 +00:00
parent 6a49659592
commit 766b25af4c
5 changed files with 10 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
ui/src/Components/NavBar/FilterInput/History.js
View File

@@ -240,7 +240,7 @@ const History = observer(
<button
ref={ref}
onClick={this.collapse.toggle}
className="input-group-text rounded-right cursor-pointer components-navbar-history px-2"
className="input-group-text border-left-0 border-right-0 border-top-0 rounded-0 bg-transparent text-white cursor-pointer components-navbar-history px-2"
type="button"
data-toggle="dropdown"
aria-haspopup="true"

8
ui/src/Components/NavBar/FilterInput/__snapshots__/index.test.js.snap
View File

@@ -4,7 +4,7 @@ exports[`<FilterInput /> matches snapshot on default render 1`] = `
"
<div class=\\"input-group w-100 mr-2\\">
<div class=\\"input-group-prepend\\">
<span class=\\"input-group-text px-2\\">
<span class=\\"input-group-text px-2 border-left-0 border-right-0 border-top-0 rounded-0 bg-transparent text-white\\">
<svg aria-hidden=\\"true\\"
focusable=\\"false\\"
data-prefix=\\"fas\\"
@@ -21,7 +21,7 @@ exports[`<FilterInput /> matches snapshot on default render 1`] = `
</svg>
</span>
</div>
<div class=\\"form-control components-filterinput\\">
<div class=\\"form-control components-filterinput border-left-0 border-right-0 border-top-0 rounded-0 bg-transparent\\">
<div role=\\"combobox\\"
aria-haspopup=\\"listbox\\"
aria-owns=\\"react-autowhatever-1\\"
@@ -29,7 +29,7 @@ exports[`<FilterInput /> matches snapshot on default render 1`] = `
class=\\"autosuggest d-inline-block\\"
>
<input type=\\"text\\"
class=\\"components-filterinput-wrapper\\"
class=\\"components-filterinput-wrapper text-white\\"
placeholder
size=\\"1\\"
value
@@ -45,7 +45,7 @@ exports[`<FilterInput /> matches snapshot on default render 1`] = `
</div>
</div>
<div class=\\"input-group-append\\">
<button class=\\"input-group-text rounded-right cursor-pointer components-navbar-history px-2\\"
<button class=\\"input-group-text border-left-0 border-right-0 border-top-0 rounded-0 bg-transparent text-white cursor-pointer components-navbar-history px-2\\"
type=\\"button\\"
data-toggle=\\"dropdown\\"
aria-haspopup=\\"true\\"

2
ui/src/Components/NavBar/FilterInput/index.css
View File

@@ -3,6 +3,8 @@
height: auto;
min-height: 2.6rem;
box-shadow: none;
padding-top: 1px;
padding-bottom: 1px;
padding-left: 0.25rem;

6
ui/src/Components/NavBar/FilterInput/index.js
View File

@@ -123,7 +123,7 @@ const FilterInput = observer(
const { value } = inputProps;
return (
<input
className="components-filterinput-wrapper"
className="components-filterinput-wrapper text-white"
placeholder=""
size={value.length + 1}
{...inputProps}
@@ -144,12 +144,12 @@ const FilterInput = observer(
>
<div className="input-group w-100 mr-2">
<div className="input-group-prepend">
<span className="input-group-text px-2">
<span className="input-group-text px-2 border-left-0 border-right-0 border-top-0 rounded-0 bg-transparent text-white">
<FontAwesomeIcon icon={faSearch} />
</span>
</div>
<div
className="form-control components-filterinput"
className="form-control components-filterinput border-left-0 border-right-0 border-top-0 rounded-0 bg-transparent"
onClick={event => {
this.onInputClick(this.inputStore.ref, event);
}}

4
ui/src/DarkTheme.scss
View File

@@ -120,10 +120,6 @@ $badge-light-bg: #d2dae0;
& .form-control {
color: $gray-200 !important;
background-color: $alertgroup-body-bg !important;
}
& .input-group-text {
background-color: $silence-bg !important;
}
& .react-datepicker,