|
POST
|
@nafizpervez I was able to get the CSS to work with the below update. The results list scroll bar background is no longer transparent. Thank you for your help with this. const STYLE = css`
& {
height: ${polished.rem(32)};
margin-top: 0;
margin-left: 0;
}
&.search-container {
width: 300px !important;
background-color: #ffffff !important;
position: relative !important;
display: block !important;
z-index: 1000 !important;
}
/* Ensure dropdown stays visible and inside widget */
.esri-search__sources-menu {
background-color: #ffffff !important;
border: 1px solid #dcdcdc !important;
border-radius: 4px;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2) !important;
overflow-y: auto !important;
max-height: 250px !important;
width: 100% !important;
position: absolute !important;
top: 100% !important;
left: 0 !important;
z-index: 9999 !important;
display: block !important;
}
/* Force solid background on results list */
.esri-menu__list {
background-color: #ffffff !important;
position: relative !important;
z-index: 9999 !important;
display: block !important;
}
/* Fix blocky hover issue by removing unwanted highlight effects */
.esri-menu__list-item {
background-color: #ffffff !important;
border-bottom: 1px solid #dcdcdc !important;
display: block !important; /* Ensures proper alignment */
text-align: left !important; /* Keeps all text left-aligned */
padding: 8px 12px !important; /* Ensure even spacing */
transition: none !important; /* Remove delay for instant hover */
box-shadow: none !important;
/* Ensure proper word wrapping and space handling */
white-space: pre-wrap !important; /* Preserves spaces and wraps naturally */
word-break: normal !important; /* Prevents breaking words mid-way */
overflow: visible !important;
text-overflow: clip !important;
text-transform: none !important;
letter-spacing: normal !important;
font-weight: normal !important;
}
/* Preserve spaces in search keywords */
.esri-menu__list-item strong {
white-space: pre-wrap !important; /* Ensures spaces are kept as in GIS */
word-break: normal !important; /* Prevents breaking words mid-way */
display: inline !important;
text-align: left !important;
}
/* Ensure second and third lines do not indent after the keyword */
.esri-menu__list-item span {
display: block !important; /* Forces text to appear as a block */
white-space: pre-wrap !important;
word-break: normal !important;
text-align: left !important;
margin-left: 0 !important; /* Prevents indentation */
padding-left: 0 !important;
}
/* Ensure text flows naturally within the container */
.esri-menu__list-item * {
background-color: transparent !important;
box-shadow: none !important;
white-space: pre-wrap !important;
word-break: normal !important;
display: block !important; /* Forces proper alignment */
text-align: left !important;
text-overflow: clip !important;
}
/* Instant hover effect with no delay */
.esri-menu__list-item:hover,
.esri-menu__list-item:focus {
background-color: rgba(0, 58, 85, 1) !important; /* Smooth dark hover effect */
color: #ffffff !important;
transition: none !important; /* Remove any delay */
box-shadow: none !important;
}
/* Remove any extra background layers causing artifacts */
.esri-menu__list-item:hover::before,
.esri-menu__list-item:focus::before,
.esri-menu__list-item::before,
.esri-menu__list-item::after {
background: none !important;
display: none !important;
box-shadow: none !important;
}
/* Fix scrollbar transparency issue */
.esri-search__sources-menu::-webkit-scrollbar,
.esri-menu::-webkit-scrollbar,
.esri-menu__list::-webkit-scrollbar {
width: 10px !important;
background-color: #ffffff !important;
border: none !important;
}
.esri-search__sources-menu::-webkit-scrollbar-track,
.esri-menu::-webkit-scrollbar-track,
.esri-menu__list::-webkit-scrollbar-track {
background: #ffffff !important; /* White scrollbar track */
border-radius: 4px !important;
box-shadow: inset 0 0 0 2px #ffffff, inset 0 0 0 3px rgba(0, 0, 0, 0.2) !important;
border: none !important;
}
.esri-search__sources-menu::-webkit-scrollbar-thumb,
.esri-menu::-webkit-scrollbar-thumb,
.esri-menu__list::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.4) !important; /* Dark scrollbar thumb */
border-radius: 4px !important;
border: 2px solid #ffffff !important;
}
/* Enhanced Firefox scrollbar fix */
.esri-search__sources-menu,
.esri-menu,
.esri-menu__list,
.esri-search__sources-menu * {
scrollbar-color: rgba(0, 0, 0, 0.4) #ffffff !important;
scrollbar-width: thin !important;
background-color: #ffffff !important; /* Full white background */
}
/* Target all possible parent containers */
.esri-search__container,
.esri-search,
.esri-view,
.esri-view-root,
.esri-ui,
.esri-component {
background-color: #ffffff !important;
}
/* Override any transparent backgrounds in the menu */
.esri-menu__list::before,
.esri-menu__list::after,
.esri-menu::before,
.esri-menu::after,
.esri-search__sources-menu::before,
.esri-search__sources-menu::after {
background: #ffffff !important;
content: '' !important;
display: block !important;
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
z-index: -1 !important;
}
/* Fix header (All button) */
.esri-menu__header {
background: #003A55 !important;
color: #ffffff !important;
font-weight: bold;
padding: 10px;
text-align: center;
}
/* Ensure text in results wraps correctly */
.esri-menu__list-item {
white-space: pre-wrap !important; /* Ensures text wraps while keeping spaces */
overflow: visible !important;
text-overflow: clip !important;
}
/* Selected state (when a user selects an option) */
.esri-menu__list-item[aria-checked="true"],
.esri-menu__list-item--active {
background-color: #003A55 !important;
color: #ffffff !important;
font-weight: bold;
}
`;
... View more
02-28-2025
09:50 AM
|
2
|
1
|
1311
|
|
IDEA
|
@Thomas1, the import/export sketches (JSON files) has been one of the most requested features to implement that are in WAB but not in EB for my users. Hopefully this can be added in the next release of EB. The development team is making good strides towards the functionality with this release of EB for the Draw widget, so hopefully they keep up the momentum.
... View more
02-28-2025
08:25 AM
|
0
|
0
|
3120
|
|
IDEA
|
Add an option to the configuration settings to expand/collapse the layers automatically when a group layer is turned on or off using the "eye" or tick box option within layer visibility. When tick box or eye is turned on, group layer expands by default. When turned off, group layer collapses by default.
... View more
02-27-2025
03:42 PM
|
3
|
0
|
445
|
|
POST
|
Hi @GISNCC , I am on 1.16. The user has to use the arrow to select the existing feature that is drawn to edit a node or delete one specific feature. I think you cannot go back and turn on show measurement for an already drawn feature, you have to have it turned on prior to creating the feature for the measurement issue.
... View more
02-27-2025
02:16 PM
|
0
|
0
|
997
|
|
IDEA
|
This looks to be added in the February 2025 AGOL EB update.
... View more
02-27-2025
08:32 AM
|
0
|
0
|
2796
|
|
IDEA
|
@ClintOffutt, I don't think there is a way to set the default, but you can check off the ones you don't want in the configuration settings and turning on Enable measurement. While it is not allowing to select a default option, the first one that you have checked on will default to the measurement. I do this in my applications and turn off options until I get to feet.
... View more
02-27-2025
08:15 AM
|
0
|
0
|
1369
|
|
IDEA
|
This looks to be supported now in the February 2025 AGOL EB release, which should be in the DE 1.17 release. It is under the Draw Settings configuration of the widget.
... View more
02-27-2025
07:49 AM
|
0
|
0
|
3136
|
|
IDEA
|
Currently, when you have a group layer, the legend aggregates all layers within the group layer in the parent group layer legend option of the map layers widget. The individual map layers widget remains grayed out. This applies to as of the February 2025 AGOL update to EB. In WAB, this request is supported as legends for each layer within the group layer can be viewed. EB (Legend is displayed in parent grouping instead of each individual layer): WAB (legend is displayed for reach individual layer, regardless of grouping):
... View more
02-27-2025
07:25 AM
|
3
|
0
|
556
|
|
POST
|
Thank you, @Ke_Xu for the update and implementing this idea.
... View more
02-27-2025
07:03 AM
|
0
|
0
|
2938
|
|
POST
|
Thank you @nafizpervez. I did try the CSS STYLE block you provided, unfortunately the results scroll bar is still transparent. I have tested in Chrome, Edge and Firefox with the same results.
... View more
02-24-2025
07:58 AM
|
0
|
0
|
1354
|
|
BLOG
|
@JoshuaClanton it looks like starting at 11.0 you can add custom widgets to Experience Builder on Enterprise. Add Experience Builder Custom Widgets In ArcGIS Enterprise
... View more
02-21-2025
12:25 PM
|
1
|
0
|
14483
|
|
POST
|
I am working on a custom search widget using the Search widget with multiple sources ArcGIS Maps SDK for JavaScript reference. The widget is working as expected. I have a bug that keeps persisting where the results list scroll navigation bar keeps an transparent background, where instead I would like it to have a white background. Below my image I have included the CSS style const used to style the widget. It is hard to see in the image but the scroll bar to the right has a transparent fill. const STYLE = css`
& {
height: ${polished.rem(32)};
margin-top: 0;
margin-left: 0;
}
&.search-container {
width: 300px !important;
}
/* Ensure the search sources menu has a solid background */
.esri-search__sources-menu {
background-color: #ffffff !important;
border: 1px solid #dcdcdc;
border-radius: 4px;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
overflow: auto !important;
}
/* Ensure individual list items have correct background */
.esri-menu__list {
background-color: #ffffff !important;
}
/* Ensure scrollbar is fully visible */
.esri-search__sources-menu::-webkit-scrollbar {
width: 10px;
background-color: #f0f0f0 !important;
border-radius: 4px;
}
.esri-search__sources-menu::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.4) !important;
border-radius: 4px;
}
/* Firefox scrollbar (optional) */
.esri-search__sources-menu {
scrollbar-color: rgba(0, 0, 0, 0.4) #f0f0f0 !important;
scrollbar-width: thin !important;
}
/* **Selected state (when a user selects an option)** */
.esri-menu__list-item[aria-checked="true"],
.esri-menu__list-item--active {
background-color: #003A55 !important;
color: #ffffff !important;
font-weight: bold;
}
/* **Hover state (when a user hovers over an option before selecting)** */
.esri-menu__list-item:hover,
.esri-menu__list-item:focus {
background-color: #003A55 !important;
color: #ffffff !important;
}
`;
... View more
02-21-2025
09:35 AM
|
0
|
4
|
1399
|
|
POST
|
Thank you, @Edward_Wong. I ended up going with your second recommendation below and the animation is now disabled. Thank you for the input. jimuMapView.view.goTo(item.extent, { animate: false });
... View more
02-20-2025
08:28 AM
|
0
|
0
|
1996
|
|
IDEA
|
In ArcGIS Web AppBuilder (WAB), the Draw Tool allowed users to create both lines and polylines as separate geometry types. However, in ArcGIS Experience Builder (EB), the Draw Tool only supports polylines, removing the option to create a simple line segment. This limits workflows where a single straight line is needed instead of a multi-segment polyline. WAB EB
... View more
02-18-2025
09:45 AM
|
1
|
0
|
316
|
| Title | Kudos | Posted |
|---|---|---|
| 1 | a week ago | |
| 1 | a week ago | |
| 1 | a week ago | |
| 2 | a week ago | |
| 2 | a week ago |
| Online Status |
Online
|
| Date Last Visited |
4 hours ago
|