0

There is a property 'styles' that takes a

"IStyleFunctionOrObject<IProgressIndicatorStyleProps, IProgressIndicatorStyles>"

but I have no idea how to set it. Anyone?

Ofer Gal
  • 707
  • 1
  • 10
  • 32

1 Answers1

1

styles prop can be a function or object

What you can customize:

root: IStyle;
itemName: IStyle;
itemDescription: IStyle;
itemProgress: IStyle;
progressTrack: IStyle;
progressBar: IStyle;

Modify background-color of progress bar:

<ProgressIndicator
  ...
  styles={{
    progressBar: {
      backgroundColor: '#f00',
    }
  }}
/>

Codepen example.

Marko Savic
  • 2,159
  • 2
  • 14
  • 27
  • Thank you. Itried progressBar: { backgroundColor: '#f00', height:'200px' } but it did not make the line thicker. – Ofer Gal May 13 '21 at 13:01
  • You need to change `root` property to `height: 200px`, then do the same for `progressBar`, `progressTrack` and `itemProgress`. See Codepen example. – Marko Savic May 13 '21 at 13:14
  • @OferGal Can you mark answer as correct if that's the solution you are looking for? Thank you. – Marko Savic Jun 22 '21 at 20:29