Skip to content

Commit

Permalink
Merge branch 'master' into 5136-themed-light-select-hover-bgc
Browse files Browse the repository at this point in the history
  • Loading branch information
tw15egan authored Jan 24, 2020
2 parents 391e200 + 08f1d85 commit 656d44d
Show file tree
Hide file tree
Showing 4 changed files with 44 additions and 15 deletions.
23 changes: 17 additions & 6 deletions packages/components/docs/sass.md
Original file line number Diff line number Diff line change
Expand Up @@ -20547,15 +20547,25 @@ Progress indicator styles
}

.#{$prefix}--progress--vertical .#{$prefix}--progress-step {
padding-bottom: rem(24px);
}

.#{$prefix}--progress--vertical .#{$prefix}--progress-step,
.#{$prefix}--progress--vertical .#{$prefix}--progress-step-button {
display: list-item;
min-height: 6rem;
min-height: 3.625rem;
width: initial;
min-width: initial;
}

svg {
display: inline-block;
margin: 0.1rem 0.5rem;
}
.#{$prefix}--progress--vertical .#{$prefix}--progress-step svg,
.#{$prefix}--progress--vertical .#{$prefix}--progress-step-button svg {
display: inline-block;
margin: 0.1rem 0.5rem;
}

.#{$prefix}--progress--vertical .#{$prefix}--progress-step-button svg {
margin-right: 0.7rem;
}

.#{$prefix}--progress--vertical .#{$prefix}--progress-step--current svg {
Expand All @@ -20565,9 +20575,10 @@ Progress indicator styles
.#{$prefix}--progress--vertical .#{$prefix}--progress-label {
display: inline-block;
width: initial;
max-width: none;
max-width: rem(160px);
vertical-align: top;
margin: 0;
white-space: initial;
}

.#{$prefix}--progress--vertical .#{$prefix}--progress-step .bx--tooltip {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -226,15 +226,25 @@
}

.#{$prefix}--progress--vertical .#{$prefix}--progress-step {
padding-bottom: rem(24px);
}

.#{$prefix}--progress--vertical .#{$prefix}--progress-step,
.#{$prefix}--progress--vertical .#{$prefix}--progress-step-button {
display: list-item;
min-height: 6rem;
min-height: 3.625rem;
width: initial;
min-width: initial;
}

svg {
display: inline-block;
margin: 0.1rem 0.5rem;
}
.#{$prefix}--progress--vertical .#{$prefix}--progress-step svg,
.#{$prefix}--progress--vertical .#{$prefix}--progress-step-button svg {
display: inline-block;
margin: 0.1rem 0.5rem;
}

.#{$prefix}--progress--vertical .#{$prefix}--progress-step-button svg {
margin-right: 0.7rem;
}

.#{$prefix}--progress--vertical .#{$prefix}--progress-step--current svg {
Expand All @@ -244,9 +254,10 @@
.#{$prefix}--progress--vertical .#{$prefix}--progress-label {
display: inline-block;
width: initial;
max-width: none;
max-width: rem(160px);
vertical-align: top;
margin: 0;
white-space: initial;
}

.#{$prefix}--progress--vertical .#{$prefix}--progress-step .bx--tooltip {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@

import React from 'react';
import { storiesOf } from '@storybook/react';
import { withKnobs, number } from '@storybook/addon-knobs';
import { withKnobs, number, boolean, text } from '@storybook/addon-knobs';
import { action } from '@storybook/addon-actions';
import { ProgressIndicator, ProgressStep } from '../ProgressIndicator';
import ProgressIndicatorSkeleton from '../ProgressIndicator/ProgressIndicator.Skeleton';
Expand All @@ -22,9 +22,10 @@ storiesOf('ProgressIndicator', module)
'Default',
() => (
<ProgressIndicator
vertical={boolean('Vertical', false)}
currentIndex={number('Current progress (currentIndex)', 1)}>
<ProgressStep
label="First step"
label={text('Label', 'First step')}
description="Step 1: Getting started with Carbon Design System"
secondaryLabel="Optional label"
/>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -195,6 +195,11 @@ export class ProgressIndicator extends Component {
* Optional callback called if a ProgressStep is clicked on. Returns the index of the step.
*/
onChange: PropTypes.func,

/**
* Determines whether or not the ProgressIndicator should be rendered vertically.
*/
vertical: PropTypes.bool,
};

static defaultProps = {
Expand Down Expand Up @@ -243,9 +248,10 @@ export class ProgressIndicator extends Component {
};

render() {
const { className, currentIndex, ...other } = this.props; // eslint-disable-line no-unused-vars
const { className, currentIndex, vertical, ...other } = this.props; // eslint-disable-line no-unused-vars
const classes = classnames({
[`${prefix}--progress`]: true,
[`${prefix}--progress--vertical`]: vertical,
[className]: className,
});
return (
Expand Down

0 comments on commit 656d44d

Please sign in to comment.