Skip to content
maplibre-yaml

defaultStyles

const defaultStyles: “\n ml-map {\n display: block;\n position: relative;\n width: 100%;\n height: 400px;\n }\n\n ml-map > .ml-map-container {\n width: 100%;\n height: 100%;\n }\n\n ml-map > [slot=“top-left”],\n ml-map > [slot=“top-right”],\n ml-map > [slot=“bottom-left”],\n ml-map > [slot=“bottom-right”],\n ml-map > [slot=“legend”] {\n display: none;\n }\n\n ml-map script[type=“text/yaml”],\n ml-map script[type=“application/yaml”],\n ml-map script[type=“application/json”] {\n display: none;\n }\n”

Defined in: packages/core/src/components/styles.ts:16

Default CSS styles for the ml-map custom element

These styles ensure:

  • The ml-map element behaves as a block-level container
  • The map fills the available space
  • Proper display defaults for embedded elements
  • Slot children stay hidden until the renderer adopts them into a chrome corner (they stop being direct children once mounted)