46 lines
950 B
Vue
46 lines
950 B
Vue
<template >
|
|
<v-row justify="end" class="header-component">
|
|
<v-col cols="auto">
|
|
<v-app-bar :elevation="0" color="cyan-darken-3">
|
|
<Building2 id="placeholderIcon"/>
|
|
<v-text-field
|
|
class="compact-form"
|
|
label="Search"
|
|
variant="solo"
|
|
prepend-icon="mdi-magnify"
|
|
hide-details
|
|
single-line
|
|
clearable
|
|
rounded="pill"
|
|
></v-text-field>
|
|
<!-- <v-btn icon>
|
|
<v-icon>mdi-dots-vertical</v-icon>
|
|
</v-btn> -->
|
|
<CircleUser id="userIcon"/>
|
|
</v-app-bar>
|
|
</v-col>
|
|
</v-row>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { Building2 } from 'lucide-vue-next';
|
|
import { CircleUser } from 'lucide-vue-next';
|
|
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
.compact-form {
|
|
transform: scale(0.7);
|
|
transform-origin: left;
|
|
}
|
|
|
|
#placeholderIcon {
|
|
margin-right: 20%;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
#userIcon {
|
|
margin-right: 15px;
|
|
}
|
|
</style>
|