<script>
    import { AtSignIcon } from "svelte-feather-icons";
    import { userInfoStore } from "../../../stores";
</script>

<style>
    .user-heading {
        margin-left: var(--space-xxs);
    }
</style>

<div class="top-bar">
    <AtSignIcon />
    <span class="h5 user-heading">{ $userInfoStore.username }</span>
</div>