优化
This commit is contained in:
1 parent
e5afe60a11
commit
7994ed1ed3
8 files changed
+408
-13
No files matched your search
@@ -1,9 +1,16 @@
|
||||
package edu.mingxu.jiaowu;
|
||||
|
||||
import android.content.Intent;
|
||||
import android.graphics.Color;
|
||||
import android.net.Uri;
|
||||
import android.os.Bundle;
|
||||
|
||||
import androidx.core.graphics.Insets;
|
||||
import androidx.core.view.ViewCompat;
|
||||
import androidx.core.view.WindowCompat;
|
||||
import androidx.core.view.WindowInsetsCompat;
|
||||
import androidx.core.view.WindowInsetsControllerCompat;
|
||||
|
||||
import com.getcapacitor.BridgeActivity;
|
||||
import com.getcapacitor.JSObject;
|
||||
|
||||
@@ -23,6 +30,22 @@ public class MainActivity extends BridgeActivity {
|
||||
protected void onCreate(Bundle savedInstanceState) {
|
||||
registerPlugin(NativeHomePlugin.class);
|
||||
super.onCreate(savedInstanceState);
|
||||
// Keep the WebView below Android system bars. The web shell also honours
|
||||
// iOS safe-area insets, so content stays clear of every supported notch.
|
||||
WindowCompat.setDecorFitsSystemWindows(getWindow(), true);
|
||||
getWindow().setStatusBarColor(Color.rgb(21, 37, 80));
|
||||
getWindow().setNavigationBarColor(Color.rgb(21, 37, 80));
|
||||
WindowInsetsControllerCompat controller =
|
||||
new WindowInsetsControllerCompat(getWindow(), getWindow().getDecorView());
|
||||
controller.setAppearanceLightStatusBars(false);
|
||||
controller.setAppearanceLightNavigationBars(false);
|
||||
ViewCompat.setOnApplyWindowInsetsListener(bridge.getWebView(), (view, insets) -> {
|
||||
Insets systemBars = insets.getInsets(
|
||||
WindowInsetsCompat.Type.systemBars() | WindowInsetsCompat.Type.displayCutout());
|
||||
view.setPadding(0, systemBars.top, 0, systemBars.bottom);
|
||||
return insets;
|
||||
});
|
||||
ViewCompat.requestApplyInsets(bridge.getWebView());
|
||||
}
|
||||
|
||||
@Override
|
||||
|
||||
@@ -348,8 +348,8 @@ onMounted(() => {
|
||||
<b>{{ auth.user?.displayName ?? '系统管理员' }}</b>
|
||||
<span>{{ auth.user?.roles?.[0] ?? '教务人员' }}</span>
|
||||
</div>
|
||||
<el-button text @click="router.push('/account')">个人账户</el-button>
|
||||
<el-button text @click="signOut">退出</el-button>
|
||||
<el-button class="desktop-account-action" text @click="router.push('/account')">个人账户</el-button>
|
||||
<el-button class="desktop-account-action" text @click="signOut">退出</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -431,6 +431,16 @@ onMounted(() => {
|
||||
</template>
|
||||
</el-menu>
|
||||
|
||||
<div class="mobile-account-actions">
|
||||
<button type="button" @click="router.push('/account'); mobileMenu = false">
|
||||
<span>个人账户</span>
|
||||
<small>{{ auth.user?.displayName ?? '当前用户' }}</small>
|
||||
</button>
|
||||
<button type="button" class="mobile-sign-out" @click="signOut">
|
||||
退出登录
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</aside>
|
||||
|
||||
<div v-if="mobileMenu" class="mobile-mask" @click="mobileMenu = false" />
|
||||
|
||||
+23
-9
@@ -16,21 +16,24 @@
|
||||
--el-color-primary: #233876;
|
||||
--el-color-success: #087f73;
|
||||
--el-border-radius-base: 7px;
|
||||
--safe-area-top: env(safe-area-inset-top, 0px);
|
||||
--safe-area-bottom: env(safe-area-inset-bottom, 0px);
|
||||
}
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
body { margin: 0; min-width: 320px; min-height: 100vh; }
|
||||
html { min-height: 100%; background: #f3f5f8; }
|
||||
body { margin: 0; min-width: 320px; min-height: 100vh; min-height: 100dvh; }
|
||||
button, input, textarea, select { font: inherit; }
|
||||
button { cursor: pointer; }
|
||||
#app { min-height: 100vh; }
|
||||
#app { min-height: 100vh; min-height: 100dvh; }
|
||||
|
||||
.shell { min-height: 100vh; }
|
||||
.shell { min-height: 100vh; min-height: 100dvh; }
|
||||
.app-header {
|
||||
position: sticky; top: 0; z-index: 20;
|
||||
box-shadow: 0 5px 18px rgba(19,34,73,.08);
|
||||
}
|
||||
.topbar {
|
||||
height: 70px; padding: 0 32px; display: flex; align-items: center; gap: 24px;
|
||||
min-height: calc(70px + var(--safe-area-top)); padding: var(--safe-area-top) 32px 0; display: flex; align-items: center; gap: 24px;
|
||||
color: white; background:
|
||||
linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px),
|
||||
linear-gradient(112deg, #152550 0%, #1d326c 72%, #176a70 130%);
|
||||
@@ -83,7 +86,7 @@ button { cursor: pointer; }
|
||||
.horizontal-menu .el-sub-menu__icon-arrow { display: none; }
|
||||
.mobile-navigation {
|
||||
position: fixed; inset: 0 auto 0 0; z-index: 30; width: 286px;
|
||||
display: flex; flex-direction: column; overflow-y: auto;
|
||||
display: flex; flex-direction: column; overflow-y: auto; padding-top: var(--safe-area-top);
|
||||
color: #eef2ff; background:
|
||||
linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
|
||||
linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px),
|
||||
@@ -96,6 +99,12 @@ button { cursor: pointer; }
|
||||
min-height: 70px; padding: 0 18px 0 20px; display: flex; align-items: center;
|
||||
justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.1);
|
||||
}
|
||||
.mobile-account-actions { margin: auto 20px calc(18px + var(--safe-area-bottom)); padding-top: 14px; display: grid; gap: 8px; border-top: 1px solid rgba(255,255,255,.12); }
|
||||
.mobile-account-actions button { min-height: 46px; padding: 10px 13px; display: flex; align-items: center; justify-content: space-between; border: 1px solid rgba(255,255,255,.13); border-radius: 7px; color: #eef2ff; background: rgba(255,255,255,.06); text-align: left; }
|
||||
.mobile-account-actions button:hover { background: rgba(255,255,255,.12); }
|
||||
.mobile-account-actions button span { font-size: 13px; font-weight: 650; }
|
||||
.mobile-account-actions button small { color: #aeb9d8; font-size: 11px; }
|
||||
.mobile-account-actions .mobile-sign-out { justify-content: center; color: #cbd3ea; background: transparent; }
|
||||
.mobile-navigation-head button {
|
||||
width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.17);
|
||||
border-radius: 6px; color: #cbd3ea; background: rgba(255,255,255,.05);
|
||||
@@ -119,7 +128,7 @@ button { cursor: pointer; }
|
||||
width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.18);
|
||||
border-radius: 7px; color: white; background: rgba(255,255,255,.07);
|
||||
}
|
||||
.content { padding: 28px 32px 48px; max-width: 1540px; margin: 0 auto; }
|
||||
.content { padding: 28px 32px calc(48px + var(--safe-area-bottom)); max-width: 1540px; margin: 0 auto; }
|
||||
.mobile-only { display: none; }
|
||||
|
||||
.section-kicker { color: var(--teal); font: 700 11px/1.2 "Microsoft YaHei", sans-serif; letter-spacing: .1em; }
|
||||
@@ -1289,7 +1298,7 @@ button { cursor: pointer; }
|
||||
.mobile-mask { position: fixed; inset: 0; z-index: 25; background: rgba(13,24,48,.52); }
|
||||
.desktop-only { display: none; }
|
||||
.mobile-only { display: inline-grid; place-items: center; }
|
||||
.topbar { height: 66px; padding: 0 16px; gap: 13px; }
|
||||
.topbar { min-height: calc(66px + var(--safe-area-top)); padding: var(--safe-area-top) 16px 0; gap: 13px; }
|
||||
.top-brand { min-width: 0; padding-right: 0; border-right: none; }
|
||||
.top-brand .brand-mark { width: 27px; height: 27px; }
|
||||
.top-brand strong { font-size: 17px; }
|
||||
@@ -1298,7 +1307,8 @@ button { cursor: pointer; }
|
||||
.user-copy { display: none; }
|
||||
.avatar { width: 32px; height: 32px; font-size: 12px; }
|
||||
.topbar .user-block { gap: 4px; }
|
||||
.content { padding: 18px 14px 35px; }
|
||||
.desktop-account-action { display: none; }
|
||||
.content { padding: 18px 14px calc(35px + var(--safe-area-bottom)); }
|
||||
.term-hero { min-height: 220px; padding: 25px; flex-direction: column; align-items: flex-start; justify-content: flex-end; }
|
||||
.term-hero button { margin: 22px 0 0; width: 100%; }
|
||||
.metric-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
|
||||
@@ -1392,7 +1402,7 @@ button { cursor: pointer; }
|
||||
.exam-row-actions { grid-column:2/-1; padding-bottom:10px; text-align:left; }
|
||||
.role-editor-summary { align-items: flex-start; flex-direction: column; gap: 4px; }
|
||||
.form-grid, .form-grid.three { grid-template-columns: 1fr; gap: 0; }
|
||||
.el-dialog { width: calc(100vw - 24px) !important; }
|
||||
.el-dialog { width: calc(100vw - 24px) !important; max-height: calc(100dvh - var(--safe-area-top) - var(--safe-area-bottom) - 24px); overflow-y: auto; }
|
||||
.login-page { display: block; min-height: 100vh; background: #f4f6f9; }
|
||||
.login-story { min-height: 310px; padding: 30px 25px; }
|
||||
.story-copy { margin: auto 0 0; }
|
||||
@@ -1409,6 +1419,10 @@ button { cursor: pointer; }
|
||||
.option-filter-grid.classes { grid-template-columns: 1fr; }
|
||||
.batch-action-bar > div:last-child { width: 100%; }
|
||||
.batch-action-bar > div:last-child .el-button { flex: 1 1 auto; }
|
||||
.page-actions, .page-intro-actions { gap: 8px; }
|
||||
.page-actions .el-button, .page-intro-actions .el-button { min-height: 42px; margin-left: 0; }
|
||||
.pagination-bar { min-height: 0; padding: 12px 14px; align-items: flex-start; flex-direction: column; gap: 8px; }
|
||||
.pagination-bar .el-pagination { width: 100%; overflow-x: auto; justify-content: flex-start; }
|
||||
.selection-round-strip > button { flex-basis: 240px; }
|
||||
.selection-window { display: block; }
|
||||
.window-seal { min-height: 54px; padding: 10px; display: flex; border-right: none; border-bottom: 1px solid rgba(255,255,255,.13); }
|
||||
|
||||
Loaded 3 of 8 files, more files were not shown because too many files have changed in this diff.
Show more
Reference in new issue
Block a user