2021-02-26 14:50:46 +13:00
|
|
|
<template>
|
|
|
|
|
|
|
|
<q-header
|
|
|
|
elevated
|
2021-02-28 06:00:57 +13:00
|
|
|
class="bg-dark text-cultured appHeader"
|
2021-02-26 14:50:46 +13:00
|
|
|
>
|
|
|
|
|
|
|
|
<div class="appHeaderInner">
|
|
|
|
<appControl
|
|
|
|
class="appControl"
|
|
|
|
/>
|
|
|
|
<topTabs
|
|
|
|
class="topTabs"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</q-header>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script lang="ts">
|
|
|
|
|
2021-04-03 12:33:49 +13:00
|
|
|
import { Component } from "vue-property-decorator"
|
2021-02-26 14:50:46 +13:00
|
|
|
|
|
|
|
import BaseClass from "src/BaseClass"
|
|
|
|
import topTabs from "src/components/appHeader/TopTabs.vue"
|
|
|
|
import appControl from "src/components/appHeader/AppControl.vue"
|
|
|
|
|
|
|
|
@Component({
|
|
|
|
components: {
|
|
|
|
topTabs: topTabs,
|
|
|
|
appControl: appControl
|
|
|
|
}
|
|
|
|
})
|
|
|
|
export default class AppHeader extends BaseClass {
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
2021-02-28 06:00:57 +13:00
|
|
|
|
2021-02-26 14:50:46 +13:00
|
|
|
.appHeaderInner {
|
2021-03-03 14:10:05 +13:00
|
|
|
z-index: 999999;
|
2021-02-26 14:50:46 +13:00
|
|
|
display: flex;
|
|
|
|
min-height: 40px;
|
2021-02-28 06:00:57 +13:00
|
|
|
-webkit-app-region: drag;
|
|
|
|
width: calc(100% - 147px);
|
2021-02-26 14:50:46 +13:00
|
|
|
|
|
|
|
.appControl {
|
|
|
|
width: 375px;
|
|
|
|
flex-shrink: 0;
|
|
|
|
flex-grow: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.topTabs {
|
2021-03-05 01:51:11 +13:00
|
|
|
max-width: calc(100% - 415px);
|
2021-02-26 14:50:46 +13:00
|
|
|
}
|
|
|
|
|
|
|
|
.appWindowButtons {
|
|
|
|
//width: 200px;
|
|
|
|
flex-shrink: 0;
|
|
|
|
flex-grow: 0;
|
|
|
|
margin-left: auto;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</style>
|