0

I've searched everywhere but can't find a solution to remove the labels on the step..

<lightning:progressIndicator currentStep="{!v.currentStep}" type="base" hasError="false" variant="base">
                <lightning:progressStep value="1" onclick="{!c.changeStep}" id="1"/>
                <lightning:progressStep value="2" onclick="{!c.changeStep}" id="2"/>
                <lightning:progressStep value="3" onclick="{!c.changeStep}" id="3"/>
            </lightning:progressIndicator>

This is my progressIndicator. I'm unable to remove the label from every progressStep; if i remove those labels manually, when i move the cursor above the step it shows me a blank label like this enter image description here

How can i remove completely these labels?

1
  • 2
    can you explain your use case? lightning:progressStep tag which is used inside the lightning:progressIndicator have label attribute which will fill your ask. – sanket kumar Jan 29 '19 at 14:08
1

Why not use native SLDS?

<aura:application extends="force:slds">

  <div class="slds-progress">
  <ol class="slds-progress__list">
    <li class="slds-progress__item slds-is-active">
      <button class="slds-button slds-progress__marker">
        <span class="slds-assistive-text">Step 1 - Active</span>
      </button>
    </li>
    <li class="slds-progress__item">
      <button class="slds-button slds-progress__marker">
        <span class="slds-assistive-text">Step 2 </span>
      </button>
    </li>
    <li class="slds-progress__item">
      <button class="slds-button slds-progress__marker">
        <span class="slds-assistive-text">Step 3 </span>
      </button>
    </li>

  </ol>
    </div>

</aura:application>

SLDS Progress Indicator has the bare minimum that you need.

Src: https://www.lightningdesignsystem.com/components/progress-indicator/

1
  • I've found what I've used here: developer.salesforce.com/docs/component-library/bundle/…. If there is a way, i prefer this one i've used because if I change using the one you suggest, I have to change all the logic behind it.. why have i to change all instead of removing only a label? I'm gonna use this solution if none knows how to do.. but for now i'll wait a day..thank you – Teemo_smr Jan 30 '19 at 8:59
0

I managed to hide the lightning:progressStep tooltips by NOT adding the label attribute to the tag and applying the following component CSS:

.THIS .slds-popover_tooltip {
   display:none;
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.