Skip to content

Commit

Permalink
feat: pinned/fixed the top menu on Android
Browse files Browse the repository at this point in the history
  • Loading branch information
ErikBjare committed Jan 8, 2021
1 parent 0d66712 commit a32a672
Show file tree
Hide file tree
Showing 4 changed files with 17 additions and 15 deletions.
12 changes: 10 additions & 2 deletions src/components/Header.vue
@@ -1,6 +1,6 @@
<template lang="pug">
div.aw-navbar
b-navbar(toggleable="lg")
div(:class="{'fixed-top-padding': fixedTopMenu}")
b-navbar.aw-navbar(toggleable="lg" :fixed="fixedTopMenu ? 'top' : null")
// Brand on mobile
b-navbar-nav.d-block.d-lg-none
b-navbar-brand(to="/" style="background-color: transparent;")
Expand Down Expand Up @@ -70,6 +70,12 @@ div.aw-navbar
| Settings
</template>

<style lang="scss" scoped>
.fixed-top-padding {
padding-bottom: 3.5em;
}
</style>

<script>
// only import the icons you use to reduce bundle size
import 'vue-awesome/icons/calendar-day';
Expand All @@ -92,6 +98,8 @@ export default {
data() {
return {
activityViews: [],
// Make configurable?
fixedTopMenu: this.$isAndroid,
};
},
mounted: async function () {
Expand Down
4 changes: 4 additions & 0 deletions src/main.js
Expand Up @@ -65,8 +65,12 @@ Vue.component('aw-calendar', () => import('./visualizations/Calendar.vue'));
Vue.mixin(require('~/mixins/asyncErrorCaptured.js'));

// Set the PRODUCTION constant
// FIXME: Thould follow Vue convention and start with a $.
Vue.prototype.PRODUCTION = PRODUCTION;

// Set the $isAndroid constant
Vue.prototype.$isAndroid = process.env.VUE_APP_ON_ANDROID;

// Setup Vue app
import App from './App';
new Vue({
Expand Down
9 changes: 2 additions & 7 deletions src/views/Home.vue
@@ -1,11 +1,11 @@
<template lang="pug">
div
b-alert(v-if="isAndroid" show)
b-alert(v-if="$isAndroid" show)
| #[b Note:] ActivityWatch on Android is in a very early stage of development. There will be bugs, but we hope you bear with us as we refine things and get it on par with the desktop version of ActivityWatch (which you should try!).

h3 Hello early user,
p
| It's still early days for ActivityWatch #[span(v-if="isAndroid") (especially on Android!)]. We've come a long way but we need users (like you!)
| It's still early days for ActivityWatch #[span(v-if="$isAndroid") (especially on Android!)]. We've come a long way but we need users (like you!)
| to provide feedback and help us turn ActivityWatch into a successful project.
| Early users like you mean a lot to us, and we hope you'll reach out to us with any ideas you have for improvements!
p
Expand Down Expand Up @@ -72,10 +72,5 @@ div
<script>
export default {
name: 'Home',
data() {
return {
isAndroid: process.env.VUE_APP_ON_ANDROID,
};
},
};
</script>
7 changes: 1 addition & 6 deletions src/views/settings/Settings.vue
Expand Up @@ -18,7 +18,7 @@ div

hr

div(v-if="!isAndroid")
div(v-if="!$isAndroid")
ReleaseNotificationSettings
hr

Expand All @@ -42,10 +42,5 @@ export default {
CategorizationSettings,
LandingPageSettings,
},
data() {
return {
isAndroid: process.env.VUE_APP_ON_ANDROID,
};
},
};
</script>

0 comments on commit a32a672

Please sign in to comment.