demos/HighContrastWithCalciteDropdown.html

<!--
    1. Calcite sample: https://developers.arcgis.com/calcite-design-system/components/dropdown
    2. Codepen sample: https://codepen.io/geospatialem/pen/vYzyoYv
-->

<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <script type="module" src=https://js.arcgis.com/calcite-components/1.0.7/calcite.esm.js></script>
    <link rel="stylesheet" type="text/css" href=https://js.arcgis.com/calcite-components/1.0.7/calcite.css />
</head>

<body>

    <calcite-dropdown width="m">
        <calcite-button slot="trigger">Select landform</calcite-button>
        <calcite-dropdown-group group-title="Natural places">
            <calcite-dropdown-item>Mountain</calcite-dropdown-item>
            <calcite-dropdown-item>River</calcite-dropdown-item>
            <calcite-dropdown-item>Waterfall</calcite-dropdown-item>
            <calcite-dropdown-item>Rainforest</calcite-dropdown-item>
            <calcite-dropdown-item>Tundra</calcite-dropdown-item>
            <calcite-dropdown-item>Desert</calcite-dropdown-item>
        </calcite-dropdown-group>
    </calcite-dropdown>

</body>

</html>