<template>
  <div class="lon-lat-pos">
    <div>
      <div id="positionLng">82° 18′15″</div>
      <div id="positionLat">112° 18′15″</div>
    </div>
  </div>
</template>

<script lang="ts">
import {Vue, Component} from "vue-property-decorator";

@Component({})
export default class MapBottomMousePos extends Vue {
}
</script>

<style scoped lang="scss">
.lon-lat-pos {
  position: absolute;
  z-index: 3;
  height: 3.125rem;
  width: 7.5rem;
  border-radius: 0.25rem;
  left: 1.25rem;
  bottom: 0.5rem;
  background-color: var(--map-control-gb);
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: left;
  color: var(--map-control-font-color);
}
</style>
