Skip to content
This repository has been archived by the owner on Jan 22, 2024. It is now read-only.

Commit

Permalink
Limit label element to only one for each layersTree item
Browse files Browse the repository at this point in the history
  • Loading branch information
@mabhub
mabhub committed Jun 19, 2023
1 parent 25d2de3 commit 90fd2f5
Show file tree
Hide file tree
Showing 3 changed files with 20 additions and 48 deletions.
28 changes: 16 additions & 12 deletions src/modules/Visualizer/LayersTree/LayersTreeItem/LayersTreeItem.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -189,24 +189,28 @@ export class LayersTreeItem extends React.Component {
)
}
>
<WarningZoom
isActive={isActive}
map={map}
layer={layer}
>
<Switch
checked={!!isActive}
onChange={onActiveChange}
id={this.uuid}
/>
</WarningZoom>
<Tooltip
content={label}
hoverOpenDelay={2000}
className="layerstree-node-content__item-label__tooltip"
>
<label className="layerstree-node-content__item-label__label" htmlFor={this.uuid}>{label}</label>
<label className="layerstree-node-content__item-label__label" htmlFor={this.uuid}>
<WarningZoom
isActive={isActive}
map={map}
layer={layer}
>
<Switch
checked={!!isActive}
onChange={onActiveChange}
id={this.uuid}
tagName="span"
/>
</WarningZoom>
{label}
</label>
</Tooltip>

<div className="layerstree-node-content__item-label__total">
{isActive && totalResult && (
<Tag
Expand Down
36 changes: 0 additions & 36 deletions src/modules/Visualizer/LayersTree/LayersTreeItem/__snapshots__/LayersTreeItem.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,6 @@ Array [
<div
className="layerstree-node-content__item-label"
>
<p>
Switch
</p>
<p>
Tooltip
</p>
Expand Down Expand Up @@ -47,9 +44,6 @@ Array [
<div
className="layerstree-node-content__item-label"
>
<p>
Switch
</p>
<p>
Tooltip
</p>
Expand All @@ -71,9 +65,6 @@ Array [
<div
className="layerstree-node-content__item-label"
>
<p>
Switch
</p>
<p>
Tooltip
</p>
Expand Down Expand Up @@ -107,9 +98,6 @@ Array [
<div
className="layerstree-node-content__item-label"
>
<p>
Switch
</p>
<p>
Tooltip
</p>
Expand Down Expand Up @@ -149,9 +137,6 @@ Array [
<div
className="layerstree-node-content__item-label"
>
<p>
Switch
</p>
<p>
Tooltip
</p>
Expand All @@ -173,9 +158,6 @@ Array [
<div
className="layerstree-node-content__item-label"
>
<p>
Switch
</p>
<p>
Tooltip
</p>
Expand Down Expand Up @@ -215,9 +197,6 @@ Array [
<div
className="layerstree-node-content__item-label"
>
<p>
Switch
</p>
<p>
Tooltip
</p>
Expand Down Expand Up @@ -261,9 +240,6 @@ Array [
<div
className="layerstree-node-content__item-label"
>
<p>
Tooltip
</p>
<p>
Tooltip
</p>
Expand Down Expand Up @@ -297,9 +273,6 @@ Array [
<div
className="layerstree-node-content__item-label"
>
<p>
Switch
</p>
<p>
Tooltip
</p>
Expand Down Expand Up @@ -336,9 +309,6 @@ Array [
<div
className="layerstree-node-content__item-label"
>
<p>
Switch
</p>
<p>
Tooltip
</p>
Expand Down Expand Up @@ -378,9 +348,6 @@ Array [
<div
className="layerstree-node-content__item-label"
>
<p>
Switch
</p>
<p>
Tooltip
</p>
Expand Down Expand Up @@ -417,9 +384,6 @@ Array [
<div
className="layerstree-node-content__item-label--mobile"
>
<p>
Switch
</p>
<p>
Tooltip
</p>
Expand Down
4 changes: 4 additions & 0 deletions src/modules/Visualizer/LayersTree/styles.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,10 @@
display: flex;
height: 1.2rem;

&__label > span {
display: inline-block;
}

&__tooltip {
width: 100%;
flex: auto;
Expand Down

0 comments on commit 90fd2f5

Please sign in to comment.