minie4/Timetable-V2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🐛 Fix height of "center" element

Browse Source
This commit is contained in:
minie4
2022-08-22 22:29:15 +02:00
parent a785671567
commit e1a429162a
5 changed files with 19 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/App.vue
View File

@ -24,15 +24,17 @@ function swipeHandler(direction) {
</script> </script>
<template> <template>
<TitleBar /> <div class="app">
<DateSelector v-show="isDataView" /> <TitleBar />
<div class="center" v-touch:swipe="swipeHandler"> <DateSelector v-show="isDataView" />
<main> <div class="center" v-touch:swipe="swipeHandler">
<LoadingElement :active="loading" v-show="isDataView" /> <main>
<RouterView /> <LoadingElement :active="loading" v-show="isDataView" />
</main> <RouterView />
</main>
</div>
<BottomNavbar v-show="$route.name != 'title.login'" />
</div> </div>
<BottomNavbar v-show="$route.name != 'title.login'" />
</template> </template>
<style> <style>
@ -52,10 +54,15 @@ body {
font-family: var(--font-family); font-family: var(--font-family);
} }
.app {
display: grid;
grid-template-rows: auto auto 1fr;
height: 100vh;
}
.center { .center {
display: flex; display: flex;
justify-content: center; justify-content: center;
height: calc(100vh - 99px);
overflow-y: auto; overflow-y: auto;
overflow: overlay; overflow: overlay;
} }

2
src/components/date-selector.vue
View File

@ -28,7 +28,7 @@ const dayNames = [
<style scoped> <style scoped>
.selector { .selector {
padding: 65px 10px 10px 10px; padding: 15px 10px 10px 10px;
display: grid; display: grid;
grid-template-columns: 35px 1fr 35px; grid-template-columns: 35px 1fr 35px;
align-items: center; align-items: center;

1
src/components/titlebar-element.vue
View File

@ -31,7 +31,6 @@ function goBack() {
<style scoped> <style scoped>
.titlebar { .titlebar {
position: fixed;
width: 100%; width: 100%;
height: 55px; height: 55px;
background-color: var(--titlebar-color); background-color: var(--titlebar-color);

2
src/views/SettingsView.vue
View File

@ -64,7 +64,7 @@ const gitHash = GITVERSION;
<style scoped> <style scoped>
.settings { .settings {
padding: 65px 10px 80px 10px; padding: 15px 10px 80px 10px;
} }
h2 { h2 {

2
src/views/TimetableView.vue
View File

@ -118,7 +118,7 @@ function isCancelled(substitution) {
background-color: var(--timetable-trust-warning-background); background-color: var(--timetable-trust-warning-background);
border-radius: 4px; border-radius: 4px;
padding: 3px 10px; padding: 3px 10px;
margin-bottom: 10px; margin: 5px 0px;
width: max-content; width: max-content;
} }