I'm using calcite-shell with the content-behind property to enable display-mode: float, which allows the end panel to have an adjustable height. However, with the introduction of components in ArcGIS API for JavaScript 4.32, I noticed that enabling content-behind causes the component to disappear, and the component aligns directly against the action bar without spacing. Below is a demo illustrating the visual difference in the and components when content-behind is enabled versus disabled. https://codepen.io/lkoumis1/pen/yyywrvG?editors=1010 @KittyHurley

nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

content-behind coexistence with search and zoom components.

LefterisKoumis

I'm using calcite-shell with the content-behind property to enable display-mode: float, which allows the end panel to have an adjustable height.

However, with the introduction of components in ArcGIS API for JavaScript 4.32, I noticed that enabling content-behind causes the <arcgis-zoom> component to disappear, and the <arcgis-search> component aligns directly against the action bar without spacing.

Below is a demo illustrating the visual difference in the <arcgis-search> and <arcgis-zoom> components when content-behind is enabled versus disabled.

https://codepen.io/lkoumis1/pen/yyywrvG?editors=1010

@KittyHurley

Najděte více příspěvků označených jako

Accepted answers

MattDriscoll

@LefterisKoumis Hello, you should be able to fix this using the `padding` property. https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-map/#padding

Here's an example: https://codepen.io/driskull/pen/KwpJMME?editors=1010

All comments

MattDriscoll

LefterisKoumis

Thank you @MattDriscoll . It works.

I just updated the references to the new newer version of ArcGIS JS API from 4.32 to 4.33 and it cannot display the map anymore with the error "

#spatialReference" "no spatial reference could be derived from the currently added map layers"

All I did was to change the JS version. Why the error? As you can see I still use AMD to declare my feature layer. Will AMD go away in the near future and use only ES modules?

https://codepen.io/lkoumis1/pen/yyywrvG?editors=1010

Thank you.

MattDriscoll

Hi @LefterisKoumis It looks like there are multiple scripts still pointing to 4.32 in the settings of that codepen. Under the HTML => stuff for head.

I think once that is cleaned up it should work.

Připojte se ke konverzaci

Přihlášení členové mohou přispívat, sledovat aktualizace a další. Jste tu noví? Zaregistrujte si bezplatný účet.

Rychlé odkazy

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.