react-component / progress

React Progress Bar

Home Page:http://progress.react-component.vercel.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

It possible to change the bar direction?

Khaledneo opened this issue · comments

It possible to change the bar direction from the right to left?

@Khaledneo use CSS transforms to do this.

  1. for <Line/> progress bar:

JSX:

<div className='progress-bar'>
  <Line percent='10'/>
</div>

CSS:

.progress-bar {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Safari 3-8 */
 }
  1. for <Circle/> progress bar:

do exactly what @As1aNH4wK said here: #38 (comment)

percent = 100-percent;

direction: rtl;