Single post in BBCode for a "Progress Bar"

Forum Index > Core > Suggestions > Completed > BBCode for a "Progress Bar" >

👍 0

Posted 22/Jul/2014 08:37:20 (9 years ago)
Edited 22/Jul/2014 08:37:37 (9 years ago)

I'll see about maybe adding it, but in the meantime you can reproduce it (using default skin colours - customise as desired) like so:

700 / 1000

Code:

[css=
  margin: 5px auto;
  width: 220px;
  position: relative;
  border-radius: 50px;
  background-color: #444;
  border: 1px solid #321;
  box-shadow: inset 3px 3px 6px #171717, inset -3px -3px 6px #ccc;
][css=
  width:70%; /* CHANGE THIS */
  position: absolute;
  left: 0px;
  top: 0px;
  bottom: 0px;
  overflow: hidden;
][css=
  width: 100%;
  min-width: 24px;
  background-color: #453;
  border-radius: 50px;
  box-shadow: inset 3px 3px 6px #cf9, inset -3px -3px 6px #171c11;
  position: absolute;
  left: 0px;
  top: 0px;
  bottom: 0px;
  animation: expbarshine 5s linear infinite;
  -webkit-animation: expbarshine 5s linear infinite;
][/css][/css][css=
  position: relative;
  display: block;
  padding: 3px;
  font-weight: bold;
  text-align: center;
  color: #ccc;
]700 / 1000[/css][/css]

... Huh, that's a lotta code! But it looks cool =3

-- OMNOMNOM!

Featured story: Injustice Feedback welcome!

Loading...

Single post in BBCode for a "Progress Bar"