From 477540cd3fd0a3b222581c5f6b8f1b57b67e2893 Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Mon, 25 Mar 2024 12:26:21 +0100 Subject: [PATCH 01/12] Update legend.js Make background layer icons wrap. --- src/controls/legend.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/controls/legend.js b/src/controls/legend.js index 9b5241176..2eab753e6 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -698,7 +698,7 @@ const Legend = function Legend(options = {}) { cls: 'flex padding-small no-shrink', style: { 'background-color': '#fff', - height: '50px', + 'max-width: '300px', 'border-top': '1px solid #dbdbdb', 'border-radius': '0.5rem' }, From 75f65ce13a748be5a1fca7ac7796023a0c567f2b Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Mon, 25 Mar 2024 12:53:52 +0100 Subject: [PATCH 02/12] Update legend.js --- src/controls/legend.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/controls/legend.js b/src/controls/legend.js index 2eab753e6..116b27581 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -698,7 +698,7 @@ const Legend = function Legend(options = {}) { cls: 'flex padding-small no-shrink', style: { 'background-color': '#fff', - 'max-width: '300px', + 'max-width': '300px', 'border-top': '1px solid #dbdbdb', 'border-radius': '0.5rem' }, From b7f8af9d06a6cc2279ce2b79b32719c967fd0db3 Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Tue, 26 Mar 2024 09:23:37 +0100 Subject: [PATCH 03/12] Update legend.js --- src/controls/legend.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/controls/legend.js b/src/controls/legend.js index 116b27581..8b4a9da05 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -698,7 +698,6 @@ const Legend = function Legend(options = {}) { cls: 'flex padding-small no-shrink', style: { 'background-color': '#fff', - 'max-width': '300px', 'border-top': '1px solid #dbdbdb', 'border-radius': '0.5rem' }, @@ -711,7 +710,8 @@ const Legend = function Legend(options = {}) { cls: 'flex column relative width-100', components: mainContainerComponents, style: { - 'max-height': `${maxHeight}px` + 'max-height': `${maxHeight}px`, + 'width': 'min-content' } }); From 57a4cd64a0541b94f28295ed914c46976fdb07d3 Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Tue, 26 Mar 2024 09:27:38 +0100 Subject: [PATCH 04/12] Update legend.js --- src/controls/legend.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/controls/legend.js b/src/controls/legend.js index 8b4a9da05..8a319324d 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -711,7 +711,7 @@ const Legend = function Legend(options = {}) { components: mainContainerComponents, style: { 'max-height': `${maxHeight}px`, - 'width': 'min-content' + width: 'min-content' } }); From 495103a108f6dae2a9a47172ca89eae4230700ad Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Tue, 26 Mar 2024 09:31:40 +0100 Subject: [PATCH 05/12] Update legend.js --- src/controls/legend.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/controls/legend.js b/src/controls/legend.js index 8a319324d..1e990326b 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -707,7 +707,7 @@ const Legend = function Legend(options = {}) { const mainContainerComponents = [overlaysCmp, visibleOverlaysCmp, toolsCmp, baselayersCmp]; mainContainerCmp = El({ - cls: 'flex column relative width-100', + cls: 'flex column relative', components: mainContainerComponents, style: { 'max-height': `${maxHeight}px`, From efc9cb114e6528914903ad38ce14dda1b9a546e2 Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Tue, 26 Mar 2024 11:43:14 +0100 Subject: [PATCH 06/12] Update legend.js --- src/controls/legend.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/controls/legend.js b/src/controls/legend.js index 1e990326b..0e989bc1d 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -689,6 +689,9 @@ const Legend = function Legend(options = {}) { const legendControlCmp = El({ cls: 'grow flex justify-end align-center no-shrink', + style: { + 'display': 'inline' + }, components: legendControlCmps }); From 338cd0ca20b938e8006d122d644703a351334d98 Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Tue, 26 Mar 2024 11:45:08 +0100 Subject: [PATCH 07/12] Update legend.js --- src/controls/legend.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/controls/legend.js b/src/controls/legend.js index 0e989bc1d..f41090204 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -690,7 +690,7 @@ const Legend = function Legend(options = {}) { const legendControlCmp = El({ cls: 'grow flex justify-end align-center no-shrink', style: { - 'display': 'inline' + display: 'inline' }, components: legendControlCmps }); From ce7eaebad1599d7b676fef51907575626a66deb8 Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Tue, 26 Mar 2024 12:11:47 +0100 Subject: [PATCH 08/12] Update legend.js --- src/controls/legend.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/controls/legend.js b/src/controls/legend.js index f41090204..188bed3cf 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -662,6 +662,10 @@ const Legend = function Legend(options = {}) { const closeButtonState = isExpanded ? 'initial' : 'hidden'; closeButton = Button({ cls: 'icon-smaller small round grey-lightest', + style: { + 'vertical-align': 'bottom', + 'margin-bottom': '4px' + } icon: '#ic_close_24px', state: closeButtonState, validStates: ['initial', 'hidden'], From 3f184508bda7adaad70b02e2a5d70308354bc85c Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Tue, 26 Mar 2024 12:15:17 +0100 Subject: [PATCH 09/12] Update legend.js --- src/controls/legend.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/controls/legend.js b/src/controls/legend.js index 188bed3cf..d91b75cd1 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -195,7 +195,8 @@ const Legend = function Legend(options = {}) { viewer.dispatch('active:togglevisibleLayers'); }, style: { - 'align-self': 'right', + 'vertical-align': 'bottom', + 'margin-bottom': '4px', 'padding-right': '6px' }, icon: '#ic_close_fullscreen_24px', From dec4c2039064e25e35af557b983ab2c668c61827 Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Tue, 26 Mar 2024 12:16:22 +0100 Subject: [PATCH 10/12] Update legend.js --- src/controls/legend.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/controls/legend.js b/src/controls/legend.js index d91b75cd1..df111a727 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -666,7 +666,7 @@ const Legend = function Legend(options = {}) { style: { 'vertical-align': 'bottom', 'margin-bottom': '4px' - } + }, icon: '#ic_close_24px', state: closeButtonState, validStates: ['initial', 'hidden'], From 1402878990c733536115e131a66bc00c6043ad65 Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Tue, 26 Mar 2024 12:23:29 +0100 Subject: [PATCH 11/12] Update legend.js --- src/controls/legend.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/controls/legend.js b/src/controls/legend.js index df111a727..c99b3a642 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -196,7 +196,7 @@ const Legend = function Legend(options = {}) { }, style: { 'vertical-align': 'bottom', - 'margin-bottom': '4px', + 'margin-bottom': '7px', 'padding-right': '6px' }, icon: '#ic_close_fullscreen_24px', From 1dfd74af114aa76c8133718a157ef8d28b269563 Mon Sep 17 00:00:00 2001 From: Henrik Uggla Date: Tue, 26 Mar 2024 12:40:09 +0100 Subject: [PATCH 12/12] Update legend.js --- src/controls/legend.js | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/src/controls/legend.js b/src/controls/legend.js index c99b3a642..c7452b2de 100644 --- a/src/controls/legend.js +++ b/src/controls/legend.js @@ -212,7 +212,8 @@ const Legend = function Legend(options = {}) { viewer.dispatch('active:togglevisibleLayers'); }, style: { - 'align-self': 'right', + 'vertical-align': 'bottom', + 'margin-bottom': '7px', 'padding-right': '6px' }, icon: '#ic_open_in_full_24px', @@ -693,9 +694,11 @@ const Legend = function Legend(options = {}) { legendControlCmps.push(closeButton); const legendControlCmp = El({ - cls: 'grow flex justify-end align-center no-shrink', + cls: 'grow flex no-shrink', style: { - display: 'inline' + display: 'inline', + 'text-align': 'right', + 'margin-right': '6px' }, components: legendControlCmps });