SebinNyshkim/viktor-reference
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: add HeaderBar component

Browse source
This commit is contained in:
Sebin Nyshkim 2022-09-26 17:25:28 +02:00
parent d35f6f9184
commit ae078c81c5
1 changed files with 30 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

30
src/components/HeaderBar.vue Normal file
View file

@ -0,0 +1,30 @@
<template>
<header class="header-bar">
<slot></slot>
<h1 class="header-bar__title">
<slot name="heading"></slot>
</h1>
</header>
</template>
<style lang="scss">
.header-bar {
display: flex;
flex-flow: row nowrap;
justify-content: stretch;
align-items: center;
position: sticky;
top: 0;
z-index: 1;
background-color: var(--color-header-bar);
backdrop-filter: blur(0.5rem);
&__title {
color: var(--color-header-bar-title);
margin: 0;
}
}
</style>