Clean up web code's use of display CSS properties, using <LayoutRow>/<LayoutCol> where intended

This commit is contained in:
Keavon Chambers
2022-01-23 20:23:35 -08:00
parent 45d75bd13f
commit 8c29592db8
34 changed files with 385 additions and 345 deletions
+5 -27
View File
@@ -1,14 +1,10 @@
<template>
<LayoutCol class="main-window">
<LayoutRow class="title-bar-row">
<TitleBar :platform="platform" :maximized="maximized" />
</LayoutRow>
<LayoutRow class="workspace-row">
<Workspace />
</LayoutRow>
<LayoutRow class="status-bar-row">
<StatusBar />
</LayoutRow>
<TitleBar :platform="platform" :maximized="maximized" />
<Workspace />
<StatusBar />
</LayoutCol>
</template>
@@ -18,29 +14,12 @@
overflow: auto;
touch-action: none;
}
.title-bar-row {
height: 28px;
flex: 0 0 auto;
}
.workspace-row {
position: relative;
flex: 1 1 100%;
}
.status-bar-row {
flex: 0 0 auto;
// Prevents the creation of a scrollbar due to the child's negative margin
overflow: hidden;
}
</style>
<script lang="ts">
import { defineComponent } from "vue";
import LayoutCol from "@/components/layout/LayoutCol.vue";
import LayoutRow from "@/components/layout/LayoutRow.vue";
import StatusBar from "@/components/window/status-bar/StatusBar.vue";
import TitleBar from "@/components/window/title-bar/TitleBar.vue";
import Workspace from "@/components/workspace/Workspace.vue";
@@ -49,7 +28,6 @@ export type ApplicationPlatform = "Windows" | "Mac" | "Linux" | "Web";
export default defineComponent({
components: {
LayoutRow,
LayoutCol,
TitleBar,
Workspace,