Forum Discussion

ZintJoseph's avatar
ZintJoseph
Qrew Captain
5 years ago

Custom Icons

I need to create a series of stoplights that are colored based on a percentage number that would show up in the middle of them. My percentage scales would be based on 0%-100% and broken down in increments of 10. Each percentage would be a gradient color from red to green. I found some code but not sure how to tie it all together and get them into a report.


Here is the code I found.

.circle {

  width: 500px;

  height: 500px;

  line-height: 500px;

  border-radius: 50%;

  font-size: 50px;

  color: #fff;

  text-align: center;

  background: #000

}

<div class="circle">Hello I am A Circle</div>



------------------------------
Joey Zint
------------------------------
  • There's an app in the Exchange with several examples of exactly this. Go to the App Exchange and search on Magic Buttons. Once you have that app, take a look at the Projects table and the Green Square Option field.

    ------------------------------
    Blake Harrison
    bharrison@datablender.io
    DataBlender - Quick Base Solution Provider
    Atlanta GA
    404.800.1702 / http://datablender.io/
    ------------------------------
    • ZintJoseph's avatar
      ZintJoseph
      Qrew Captain
      Not exactly what I am looking for.

      ------------------------------
      Joey Zint
      ------------------------------
      • ZintJoseph's avatar
        ZintJoseph
        Qrew Captain
        I want a single stoplight that changes color and has the percentage complete in the circle. One stoplight per task, not 10 lights per task

        ------------------------------
        Joey Zint
        ------------------------------