Skip to content

Commit

Permalink
Merge pull request Graylog2#8524 from Graylog2/input_styles
Browse files Browse the repository at this point in the history 
Add Input colors to theme & styles
  • Loading branch information
@kmerz
kmerz authored Jul 23, 2020
2 parents 0f643af + 5389d25 commit 5be4e09
Show file tree
Hide file tree
Showing 28 changed files with 1,407 additions and 1,093 deletions.
32 changes: 16 additions & 16 deletions graylog2-web-interface/src/components/bootstrap/__snapshots__/Input.test.jsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ exports[`Input renders a addon after the input if addonAfter is passed 1`] = `
>
<FormControl
bsClass="form-control"
className="FormControl-sc-1amoaox-0 kmJcge"
className="FormControl-sc-1amoaox-0 fKSsjP"
componentClass="input"
inputRef={[Function]}
label=""
Expand All @@ -58,7 +58,7 @@ exports[`Input renders a addon after the input if addonAfter is passed 1`] = `
type="text"
>
<input
className="FormControl-sc-1amoaox-0 kmJcge form-control"
className="FormControl-sc-1amoaox-0 fKSsjP form-control"
id="inputWithAddon"
label=""
name="inputWithAddon"
Expand All @@ -74,13 +74,13 @@ exports[`Input renders a addon after the input if addonAfter is passed 1`] = `
className="input-group-addon"
>
<StyledBootstrapInputAddon
className="InputGroup__StyledAddon-sc-1a8jz8l-0 hIsRCw input-group-addon"
className="InputGroup__StyledAddon-sc-1a8jz8l-0 jyXQlz input-group-addon"
>
<InputGroupAddon
bsClass="InputGroup__StyledAddon-sc-1a8jz8l-0 hIsRCw input-group-addon"
bsClass="InputGroup__StyledAddon-sc-1a8jz8l-0 jyXQlz input-group-addon"
>
<span
className="InputGroup__StyledAddon-sc-1a8jz8l-0 hIsRCw input-group-addon"
className="InputGroup__StyledAddon-sc-1a8jz8l-0 jyXQlz input-group-addon"
>
.00
</span>
Expand Down Expand Up @@ -149,7 +149,7 @@ exports[`Input renders a button after the input if buttonAfter is passed 1`] = `
>
<FormControl
bsClass="form-control"
className="FormControl-sc-1amoaox-0 kmJcge"
className="FormControl-sc-1amoaox-0 fKSsjP"
componentClass="input"
inputRef={[Function]}
label=""
Expand All @@ -158,7 +158,7 @@ exports[`Input renders a button after the input if buttonAfter is passed 1`] = `
type="text"
>
<input
className="FormControl-sc-1amoaox-0 kmJcge form-control"
className="FormControl-sc-1amoaox-0 fKSsjP form-control"
id="inputWithButton"
label=""
name="inputWithButton"
Expand Down Expand Up @@ -264,7 +264,7 @@ exports[`Input renders a checkbox addon after the input if addonAfter is passed
>
<FormControl
bsClass="form-control"
className="FormControl-sc-1amoaox-0 kmJcge"
className="FormControl-sc-1amoaox-0 fKSsjP"
componentClass="input"
inputRef={[Function]}
label=""
Expand All @@ -273,7 +273,7 @@ exports[`Input renders a checkbox addon after the input if addonAfter is passed
type="text"
>
<input
className="FormControl-sc-1amoaox-0 kmJcge form-control"
className="FormControl-sc-1amoaox-0 fKSsjP form-control"
id="inputWithCheckboxAddon"
label=""
name="inputWithCheckboxAddon"
Expand All @@ -289,13 +289,13 @@ exports[`Input renders a checkbox addon after the input if addonAfter is passed
className="input-group-addon"
>
<StyledBootstrapInputAddon
className="InputGroup__StyledAddon-sc-1a8jz8l-0 hIsRCw input-group-addon"
className="InputGroup__StyledAddon-sc-1a8jz8l-0 jyXQlz input-group-addon"
>
<InputGroupAddon
bsClass="InputGroup__StyledAddon-sc-1a8jz8l-0 hIsRCw input-group-addon"
bsClass="InputGroup__StyledAddon-sc-1a8jz8l-0 jyXQlz input-group-addon"
>
<span
className="InputGroup__StyledAddon-sc-1a8jz8l-0 hIsRCw input-group-addon"
className="InputGroup__StyledAddon-sc-1a8jz8l-0 jyXQlz input-group-addon"
>
<input
aria-label="..."
Expand Down Expand Up @@ -360,7 +360,7 @@ exports[`Input renders input w/ \`name\` attribute w/ setting prop 1`] = `
>
<FormControl
bsClass="form-control"
className="FormControl-sc-1amoaox-0 kmJcge"
className="FormControl-sc-1amoaox-0 fKSsjP"
componentClass="input"
inputRef={[Function]}
label=""
Expand All @@ -369,7 +369,7 @@ exports[`Input renders input w/ \`name\` attribute w/ setting prop 1`] = `
type="text"
>
<input
className="FormControl-sc-1amoaox-0 kmJcge form-control"
className="FormControl-sc-1amoaox-0 fKSsjP form-control"
id="inputWithoutNameProp"
label=""
name="inputWithNameProp"
Expand Down Expand Up @@ -427,7 +427,7 @@ exports[`Input renders input w/ \`name\` attribute w/o setting prop 1`] = `
>
<FormControl
bsClass="form-control"
className="FormControl-sc-1amoaox-0 kmJcge"
className="FormControl-sc-1amoaox-0 fKSsjP"
componentClass="input"
inputRef={[Function]}
label=""
Expand All @@ -436,7 +436,7 @@ exports[`Input renders input w/ \`name\` attribute w/o setting prop 1`] = `
type="text"
>
<input
className="FormControl-sc-1amoaox-0 kmJcge form-control"
className="FormControl-sc-1amoaox-0 fKSsjP form-control"
id="inputWithoutNameProp"
label=""
name="inputWithoutNameProp"
Expand Down
11 changes: 5 additions & 6 deletions graylog2-web-interface/src/components/common/Select.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -132,8 +132,7 @@ const placeholder = ({ theme }) => (base) => ({
const controlFocus = ({ size, theme }) => (base, { isFocused }) => {
const borderWidth = isFocused ? 1 : base.borderWidth;
const outline = isFocused ? 0 : base.outline;
const defaultBoxShadow = `inset 0 1px 1px ${theme.colors.variant.lightest.default}`;
const boxShadow = isFocused ? `${defaultBoxShadow}, 0 0 8px ${theme.colors.variant.lighter.info}` : defaultBoxShadow;
const boxShadow = isFocused ? theme.colors.input.boxShadow : null;
const controlSize = size === 'small' ? controlSmall : controlNormal;

return {
Expand Down Expand Up @@ -393,16 +392,16 @@ class Select extends React.Component<Props, State> {
...defaultTheme,
colors: {
...defaultTheme.colors,
primary: theme.colors.variant.light.info,
primary: theme.colors.input.borderFocus,
primary75: theme.colors.variant.light.default,
primary50: theme.colors.variant.lighter.default,
primary25: theme.colors.variant.lightest.default,
danger: theme.colors.variant.darker.info,
dangerLight: theme.colors.variant.lighter.info,
neutral0: theme.colors.gray[100],
neutral5: theme.colors.gray[90],
neutral0: theme.colors.input.background,
neutral5: theme.colors.input.backgroundDisabled,
neutral10: theme.colors.variant.lightest.info,
neutral20: theme.colors.gray[80],
neutral20: theme.colors.input.border,
neutral30: theme.colors.gray[70],
neutral40: theme.colors.gray[60],
neutral50: theme.colors.gray[50],
Expand Down
Loading

0 comments on commit 5be4e09

Please sign in to comment.