scania-digital-design-system/sdds

Dropdown list show underlaying text label

Closed this issue · 1 comments

Requirements before reporting

  • No duplicated issue reported.
  • I have read the contribution guidelines.
  • I have checked the lastest version if the bug exist there. See all avaliable packages at npmJS.com
  • I have made sure that the issue comes from SDDS packages by removing SDDS from my project as a test.
  • I have followed the installation guide.

Package

@scania/components

Package versions

@scania/components 4.5

Browser

Edge (Chromium)

Framework

Angular

Version

14

Reproduction steps

Add a drop down list
Add a text area field below with a label inside
Add enough list items to cover below text
Drop down the list and you should see the label of the text area field shining through (but not the in the text field)

Have only seen this behaviour when using text-area

Code example

    <div class="sbs-margin-top-8">
        <sdds-dropdown
            id="resourceTypeId"
            label="Drop down items"
            ngDefaultControl 
            formControlName="resourceTypeId"
            defaultOption="test1" 
            label-position="inside">
            <sdds-dropdown-option [selected]="true" value="test1"> TEST 1 </sdds-dropdown-option>
            <sdds-dropdown-option [selected]="false" value="test2"> TEST 2 </sdds-dropdown-option>
            <sdds-dropdown-option [selected]="false" value="test3"> TEST 3 </sdds-dropdown-option>
            <sdds-dropdown-option [selected]="false" value="test4"> TEST 4 </sdds-dropdown-option>
            <sdds-dropdown-option [selected]="false" value="test5"> TEST 5 </sdds-dropdown-option>
        </sdds-dropdown>
    </div>

    <!-- Resource Name -->
    <div class="sbs-margin-top-8">
        <sdds-textarea 
            placeholder="Enter some text"
            label="My label"
            label-position="inside">
        </sdds-textarea>
    </div>

Screenshots

Add/Copy screenshot here

Expected behaviour

Label should not shine through dropdown list

Console errors

Add warning/error message

Contact information

dan.granroth@scania.com

This issue had been resolved in the latest versions of both @scania/components and @scania/tegel packages.