Fix leaking CSS styling

[ggetz]

Description

We ID'd some cases where the styling from packages/widgets/Source/I3SBuildingSceneLayerExplorer/I3SBuildingSceneLayerExplorer.css was affecting other styling in the page, particularly ul, input, and .active items.

This adds a top-level class for the wrapper element and ensures all styling is contained to the wrapper.

Issue number and link

N/A

Testing plan

1. Check on previous appearance of the widget in https://sandcastle.cesium.com/?src=I3S%20Building%20Scene%20Layer.html. Make sure you select "Full Model" from the dropdown to see the whole panel contents.
2. Ensure the updated version is styled the same
3. Ensure other ul, input, and .active items in a page are not affected.

Author checklist

• I have submitted a Contributor License Agreement
• I have added my name to CONTRIBUTORS.md
• I have updated CHANGES.md with a short summary of my change
• I have added or updated unit tests to ensure consistent code coverage
• I have update the inline documentation, and included code examples where relevant
• I have performed a self-review of my code

[ggetz]

@jjspace Could you please take a look?

[github-actions]

Thank you for the pull request, @ggetz!

✅ We can confirm we have a CLA on file for you.

[jjspace]

This looks good to me, the element looks the same as before and the code change makes sense. Just had one quick question/suggestion. O

[jjspace]

This could be made a bit cleaner using the new ability for nested CSS Selectors.

.cesium-viewer-i3s-explorer {
  ul {
    list-style-type: none;
  }

  .layersList {
    padding: 0;
  }
  /* ... */
}

However once again brings up the question of what browsers/environments do we target support for? It was only generally available in the majority of browsers last December as seen on caniuse

Not a reason to hold up this PR but wanted to bring it up

[ggetz]

Thanks @jjspace, I didn't know about these! Let's hold off for now given the amount of time it's been out.