<script>
    export let type

    // Lead 1: https://codepen.io/edankwan/pen/emqgpr
    // Lead 2: ThreeJS globe: https://github.com/vasturiano/globe.gl
    // Lead 3: https://www.bypeople.com/css-js-webgl-rotating-3d-globe-effect/
</script>

<div class="globe" class:globe--part={type === 'part'}>
    <div class="wrap">
        <div class="pin-place">
            <a href="/location/australia/brisbane" rel="prefetch" class="pinplace__name">
                <span>Brisbane</span>
            </a>
            <a href="/location/australia/brisbane" rel="prefetch" class="">
                <i class="pin-place__dot"></i>
            </a>
        </div>
        <div class="pin-place">
            <a href="/location/australia/brisbane" rel="prefetch" class="pinplace__name">
                <span>Montpellier</span>
            </a>
            <a href="/location/australia/brisbane" rel="prefetch" class="">
                <i class="pin-place__dot"></i>
            </a>
        </div>

        <span class="pin-country">France</span>

        <img src="/img/globe.png" alt="">
    </div>
</div>
