github/dootask
1
0
Fork 0
mirror of https://github.com/kuaifan/dootask.git synced 2025-12-11 18:42:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

perf: 优化iPad Pro页面布局

Browse Source
This commit is contained in:
kuaifan 2023-04-24 14:48:35 +08:00
parent 0f449f151a
commit 900b11280c
25 changed files with 37 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
resources/assets/js/App.vue
View File

@ -225,8 +225,8 @@ export default {
windowSizeListener() {
this.$store.state.windowWidth = $A(window).width()
this.$store.state.windowHeight = $A(window).height()
this.$store.state.windowLarge = this.$store.state.windowWidth > 768
this.$store.state.windowSmall = this.$store.state.windowWidth <= 768
this.$store.state.windowLarge = this.$store.state.windowWidth > 834
this.$store.state.windowSmall = this.$store.state.windowWidth <= 834
this.$store.state.formLabelPosition = this.$store.state.windowWidth > 576 ? 'right' : 'top'
this.$store.state.formLabelWidth = this.$store.state.windowWidth > 576 ? 'auto' : ''
},

2
resources/assets/js/components/ResizeLine.vue
View File

@ -4,7 +4,7 @@
<style lang="scss" scoped>
.component-resize-line {
cursor: col-resize;
@media (max-width: 768px) {
@media (max-width: 834px) {
display: none;
}
&.resizing {

6
resources/assets/js/pages/manage.vue
View File

@ -1,6 +1,6 @@
<template>
<div v-show="userId > 0" class="page-manage" :class="{'show-tabbar': showMobileTabbar}">
<div class="manage-box-menu" :class="{'show768-menu': show768Menu}">
<div class="manage-box-menu" :class="{'show-mobile-menu': showMobileMenu}">
<Dropdown
class="page-manage-menu-dropdown main-menu"
trigger="click"
@ -363,7 +363,7 @@ export default {
openMenu: {},
visibleMenu: false,
show768Menu: false,
showMobileMenu: false,
workReportShow: false,
allUserShow: false,
@ -699,7 +699,7 @@ export default {
},
async toggleRoute(path, params) {
this.show768Menu = false;
this.showMobileMenu = false;
let location = {name: 'manage-' + path, params: params || {}};
let fileFolderId = await $A.IDBInt("fileFolderId");
if (path === 'file' && fileFolderId > 0) {

2
resources/assets/js/pages/manage/components/ProjectPanel.vue
View File

@ -435,7 +435,7 @@
<DrawerOverlay
v-model="logShow"
placement="right"
:size="768">
:size="720">
<ProjectLog v-if="logShow" :project-id="projectId"/>
</DrawerOverlay>

6
resources/assets/js/pages/manage/setting/index.vue
View File

@ -5,13 +5,13 @@
<div class="setting-titbox">
<div class="setting-title">
<h1>{{$L(settingTitleName)}}</h1>
<div v-if="!show768Box" class="setting-more" @click="toggleRoute('index')">
<div v-if="!showMobileBox" class="setting-more" @click="toggleRoute('index')">
<Icon type="md-close" />
</div>
</div>
</div>
</div>
<div class="setting-box" :class="{'show768-box':show768Box}">
<div class="setting-box" :class="{'show-mobile-box':showMobileBox}">
<div class="setting-menu">
<ul>
<li
@ -65,7 +65,7 @@ export default {
return this.$route.name
},
show768Box() {
showMobileBox() {
return this.routeName === 'manage-setting'
},

4
resources/assets/js/store/state.js vendored
View File

@ -11,8 +11,8 @@ export default {
windowScrollY: 0,
// 浏览器窗口类型
windowLarge: $A(window).width() > 768, // 大窗口
windowSmall: $A(window).width() <= 768, // 小窗口
windowLarge: $A(window).width() > 834, // 大窗口
windowSmall: $A(window).width() <= 834, // 小窗口
// 窗口是否激活
windowActive: true,

2
resources/assets/sass/components/mobile.scss vendored
View File

@ -320,7 +320,7 @@ body.support-touch {
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.mobile-tabbar {
display: flex;
}

2
resources/assets/sass/components/right-bottom.scss vendored
View File

@ -88,7 +88,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.common-right-bottom {
bottom: 20px;
right: auto;

2
resources/assets/sass/pages/components/chat-input.scss vendored
View File

@ -788,7 +788,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.chat-input-box {
.chat-input-quick-emoji {
right: 10px;

4
resources/assets/sass/pages/components/dialog-group-info.scss vendored
View File

@ -71,7 +71,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
&:hover {
background-color: transparent;
}
@ -123,7 +123,7 @@
transform: translateX(50%);
transition: all 0.2s;
@media (max-width: 768px) {
@media (max-width: 834px) {
opacity: 1;
transform: translateX(0);
}

2
resources/assets/sass/pages/components/dialog-respond.scss vendored
View File

@ -42,7 +42,7 @@
background-color: rgba($primary-desc-color, 0.1);
}
@media (max-width: 768px) {
@media (max-width: 834px) {
&:hover {
background-color: transparent;
}

4
resources/assets/sass/pages/components/dialog-wrapper.scss vendored
View File

@ -1621,7 +1621,7 @@ body.support-touch {
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.dialog-wrapper {
background-color: #f8f8f8;
&.drawer-list {
@ -1853,7 +1853,7 @@ body.support-touch {
}
}
@media (max-width: 768px) and (min-width: 390px){
@media (max-width: 834px) and (min-width: 390px){
.dialog-wrapper-operate {
.operate-action {
width: 376px;

4
resources/assets/sass/pages/components/file-content.scss vendored
View File

@ -314,7 +314,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.file-preview {
.edit-header {
.header-hint {
@ -329,7 +329,7 @@
overflow: auto;
.edit-header,
.content-body {
min-width: 768px;
min-width: 720px;
overflow-x: auto;
.teditor-loadedstyle {
.tox-menubar,

2
resources/assets/sass/pages/components/meeting-manager.scss vendored
View File

@ -49,7 +49,7 @@ body {
}
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
grid-template-columns: none;
grid-gap: 12px;
display: flex;

4
resources/assets/sass/pages/components/project-panel.scss vendored
View File

@ -1026,7 +1026,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.project-panel {
.project-titbox {
position: sticky;
@ -1096,7 +1096,7 @@
.project-table {
.project-table-head,
.project-table-body {
min-width: 768px;
min-width: 720px;
margin: 0 24px 12px;
}
}

2
resources/assets/sass/pages/components/task-add.scss vendored
View File

@ -206,7 +206,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.task-add {
.task-add-form,
.task-add-advanced {

2
resources/assets/sass/pages/components/task-detail.scss vendored
View File

@ -858,7 +858,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.task-detail {
.task-info {
.scroller {

2
resources/assets/sass/pages/page-calendar.scss vendored
View File

@ -191,7 +191,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.page-calendar {
.calendar-head {
.calendar-titbox {

2
resources/assets/sass/pages/page-dashboard.scss vendored
View File

@ -286,7 +286,7 @@
opacity: 0;
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.page-dashboard {
.dashboard-wrapper {
display: block;

2
resources/assets/sass/pages/page-file.scss vendored
View File

@ -695,7 +695,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.page-file {
.file-wrapper {
.file-head {

2
resources/assets/sass/pages/page-login.scss vendored
View File

@ -198,7 +198,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.page-login {
.login-body {
padding: 0 0 110px;

4
resources/assets/sass/pages/page-manage.scss vendored
View File

@ -421,7 +421,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.page-manage {
&.show-tabbar {
.manage-box-main {
@ -436,7 +436,7 @@
bottom: 0;
width: 100%;
transform: translateX(-120%);
&.show768-menu {
&.show-mobile-menu {
transform: translateX(0);
}
}

2
resources/assets/sass/pages/page-messenger.scss vendored
View File

@ -590,7 +590,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.page-messenger {
.messenger-wrapper {
.messenger-select {

4
resources/assets/sass/pages/page-setting.scss vendored
View File

@ -372,7 +372,7 @@
}
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.page-setting {
.setting-head {
margin: 32px 32px 0;
@ -391,7 +391,7 @@
}
.setting-box {
position: relative;
&.show768-box {
&.show-mobile-box {
.setting-menu {
transform: translateX(0);
}

2
resources/views/desktop.blade.php
View File

@ -100,7 +100,7 @@
line-height: 26px
}
@media (max-width: 768px) {
@media (max-width: 834px) {
.mirror {
width: 100%;
padding: 0 15px 10px