diff --git a/resources/assets/js/components/DrawerOverlay/index.vue b/resources/assets/js/components/DrawerOverlay/index.vue index eed138d0b..a0a434a84 100644 --- a/resources/assets/js/components/DrawerOverlay/index.vue +++ b/resources/assets/js/components/DrawerOverlay/index.vue @@ -5,7 +5,7 @@ :closable="escClosable" :mask-closable="maskClosable" :footer-hide="true" - :transition-names="[`drawer-fade-${placement}`, '']" + :transition-names="[`drawer-slide-${placement}`, '']" :beforeClose="beforeClose" fullscreen :class-name="`common-drawer-overlay ${placement}`"> diff --git a/resources/assets/js/components/Mobile/Tabbar.vue b/resources/assets/js/components/Mobile/Tabbar.vue index a8f40d2e4..61f5d153a 100644 --- a/resources/assets/js/components/Mobile/Tabbar.vue +++ b/resources/assets/js/components/Mobile/Tabbar.vue @@ -1,17 +1,22 @@ @@ -1017,6 +1017,17 @@ export default { }); }, + onTabbarClick(act) { + switch (act) { + case 'addTask': + this.onAddTask(0) + break; + case 'addProject': + this.onAddShow() + break; + } + }, + notificationInit() { this.notificationManage = new notificationKoro(this.$L("打开通知成功")); if (this.notificationManage.support) { diff --git a/resources/assets/sass/components/drawer-overlay.scss b/resources/assets/sass/components/drawer-overlay.scss index 6e913e620..42248b6a0 100644 --- a/resources/assets/sass/components/drawer-overlay.scss +++ b/resources/assets/sass/components/drawer-overlay.scss @@ -109,30 +109,30 @@ } } -.drawer-fade-bottom-enter-active { +.drawer-slide-bottom-enter-active { transition: all .2s ease; } -.drawer-fade-bottom-leave-active { +.drawer-slide-bottom-leave-active { transition: all .2s ease; } -.drawer-fade-bottom-enter, -.drawer-fade-bottom-leave-to { +.drawer-slide-bottom-enter, +.drawer-slide-bottom-leave-to { transform: translate(0, 15%) scale(0.98); opacity: 0; } -.drawer-fade-right-enter-active { +.drawer-slide-right-enter-active { transition: all .2s ease; } -.drawer-fade-right-leave-active { +.drawer-slide-right-leave-active { transition: all .2s ease; } -.drawer-fade-right-enter, -.drawer-fade-right-leave-to { +.drawer-slide-right-enter, +.drawer-slide-right-leave-to { transform: translate(15%, 0) scale(0.98); opacity: 0; } diff --git a/resources/assets/sass/components/mobile.scss b/resources/assets/sass/components/mobile.scss index 667c31643..ee65e039b 100644 --- a/resources/assets/sass/components/mobile.scss +++ b/resources/assets/sass/components/mobile.scss @@ -8,7 +8,9 @@ right: 0; z-index: 99; - > ul { + .tabbar-box { + position: relative; + z-index: 3; display: flex; align-items: center; justify-content: center; @@ -16,7 +18,7 @@ margin: 0; height: 60px; background-color: #f8f8f8; - box-shadow: 0 0 2px rgba(28, 34, 43, 0.15); + box-shadow: 0 0 1px rgba(28, 34, 43, 0.15); > li { flex: 1; @@ -58,27 +60,40 @@ } } + .more-mask { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: 1; + background-color: rgba(0, 0, 0, 0.15); + } + .more-box { - display: none; + position: relative; + z-index: 2; + display: block; margin-bottom: -2px; border-radius: 16px 16px 0 0; - background-color: rgba(250, 250, 250, 0.98); + padding-bottom: 16px; + background-color: #ffffff; border-top: 1px solid #f1f1f1; .tabbar-more-title { font-size: 18px; font-weight: 500; - padding: 14px 14px 0; + padding: 16px 16px 36px; } > ul { - padding: 36px 12px 16px; + padding: 0 12px; > li { list-style: none; display: inline-block; width: 25%; - margin-bottom: 20px; + margin-bottom: 28px; .more-item { display: flex; @@ -92,9 +107,9 @@ justify-content: center; width: 56px; height: 56px; - font-size: 26px; - color: #0bc037; - background-color: #f1f1f1; + font-size: 25px; + color: $primary-color; + background-color: rgba($primary-color, 0.08); border-radius: 12px; } @@ -109,19 +124,6 @@ } } } - - &.more-show { - top: 0; - background-color: rgba(0, 0, 0, 0.15); - - > ul { - box-shadow: 0 0 1px rgba(28, 34, 43, 0.15); - } - - .more-box { - display: block; - } - } } .mobile-back { @@ -142,6 +144,33 @@ } } +.mobile-fade-enter-active { + transition: all 0.2s ease; +} + +.mobile-fade-leave-active { + transition: all 0.2s ease; +} + +.mobile-fade-enter, +.mobile-fade-leave-to { + opacity: 0; +} + +.mobile-slide-enter-active { + transition: all 0.2s ease; +} + +.mobile-slide-leave-active { + transition: all 0.2s ease; +} + +.mobile-slide-enter, +.mobile-slide-leave-to { + transform: translate(0, 15%) scale(0.98); + opacity: 0; +} + @media (max-width: 640px) { .mobile-tabbar { display: flex; diff --git a/resources/assets/sass/taskfont.scss b/resources/assets/sass/taskfont.scss index da7c42e02..cd4cf8fa6 100644 --- a/resources/assets/sass/taskfont.scss +++ b/resources/assets/sass/taskfont.scss @@ -10,6 +10,5 @@ font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; - -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; } diff --git a/resources/assets/statics/public/css/fonts/taskfont.ttf b/resources/assets/statics/public/css/fonts/taskfont.ttf index 8f69a4437..7f5d09360 100644 Binary files a/resources/assets/statics/public/css/fonts/taskfont.ttf and b/resources/assets/statics/public/css/fonts/taskfont.ttf differ diff --git a/resources/assets/statics/public/css/fonts/taskfont.woff b/resources/assets/statics/public/css/fonts/taskfont.woff index 53b9bebba..3eac21414 100644 Binary files a/resources/assets/statics/public/css/fonts/taskfont.woff and b/resources/assets/statics/public/css/fonts/taskfont.woff differ diff --git a/resources/assets/statics/public/css/fonts/taskfont.woff2 b/resources/assets/statics/public/css/fonts/taskfont.woff2 index f553bd243..e426d75fe 100644 Binary files a/resources/assets/statics/public/css/fonts/taskfont.woff2 and b/resources/assets/statics/public/css/fonts/taskfont.woff2 differ