面板调整,图鉴补充
This commit is contained in:
+66
-52
@@ -46,7 +46,7 @@ body { background: #0a0e17; overflow: hidden; font-family: 'Microsoft YaHei', sa
|
||||
#topBar .title .worldName.editable { cursor: pointer; padding: 2px 8px; border-radius: 5px; transition: background .15s; }
|
||||
#topBar .title .worldName.editable:hover { background: rgba(255,255,255,.08); }
|
||||
|
||||
/* 测试阶段金币编辑器(世界名称右侧) */
|
||||
/* 临时隐藏:测试阶段金币编辑器(世界名称右侧)
|
||||
#topBar .goldEditor {
|
||||
display: none;
|
||||
align-items: center; gap: 8px;
|
||||
@@ -57,7 +57,6 @@ body { background: #0a0e17; overflow: hidden; font-family: 'Microsoft YaHei', sa
|
||||
font-size: 13px; color: #ffd54f;
|
||||
white-space: nowrap;
|
||||
backdrop-filter: blur(6px);
|
||||
/* 解除父容器 .title 的 -webkit-text-fill-color: transparent 继承,否则子元素文字/emoji 全透明 */
|
||||
-webkit-text-fill-color: initial;
|
||||
}
|
||||
#topBar .goldEditor * { -webkit-text-fill-color: initial; }
|
||||
@@ -101,6 +100,7 @@ body { background: #0a0e17; overflow: hidden; font-family: 'Microsoft YaHei', sa
|
||||
background: rgba(0,0,0,.35); border-radius: 999px;
|
||||
border: 1px solid rgba(255,215,0,.15);
|
||||
}
|
||||
*/
|
||||
.worldName-input {
|
||||
background: transparent; border: 1px solid rgba(124,199,255,.6); color: #cfe1f3;
|
||||
font-size: 15px; font-weight: 600; padding: 2px 6px; border-radius: 5px; width: 180px;
|
||||
@@ -206,17 +206,22 @@ body { background: #0a0e17; overflow: hidden; font-family: 'Microsoft YaHei', sa
|
||||
#topBar .ua-sep{display:none;}
|
||||
#topBar .ua-soon{font-size:10px;color:#778;background:rgba(255,255,255,.06);padding:1px 6px;border-radius:8px;}
|
||||
|
||||
/* 场景悬浮工具条:浮于场景画面、紧贴顶部栏下方 */
|
||||
/* 场景悬浮工具条:浮于场景画面、紧贴顶部栏下方
|
||||
布局策略:单列 64px 优先,行数限制决定列数(满 N 行后 Grid 自动开下一列)
|
||||
关键:grid-auto-flow: column + grid-auto-columns = grid-template-columns;
|
||||
否则 Grid 默认按行填充,超出后只会"创建隐式行继续在第 1 列堆"而不是开第 2 列 */
|
||||
#sceneToolbar{
|
||||
position:fixed; top:calc(58px + env(safe-area-inset-top) + 12px); right:max(18px, env(safe-area-inset-right)); z-index:90;
|
||||
display:grid; grid-template-columns:repeat(3,64px); grid-auto-rows:72px; gap:10px; pointer-events:auto;
|
||||
display:grid; grid-template-columns:64px; grid-auto-columns:64px;
|
||||
grid-template-rows:repeat(7,72px); grid-auto-rows:72px;
|
||||
grid-auto-flow:column; gap:10px; pointer-events:auto;
|
||||
padding:11px; border-radius:16px;
|
||||
background:rgba(12,18,32,.78); border:1px solid rgba(139,92,246,.35);
|
||||
backdrop-filter:blur(10px); box-shadow:0 8px 28px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06);
|
||||
transition:padding .2s, border-radius .2s;
|
||||
}
|
||||
/* 折叠态:显示汉堡按钮 + 5 个核心按钮(任务/包裹/好友/排行榜/成就),2 列布局 */
|
||||
#sceneToolbar.collapsed{ grid-template-columns:repeat(2,64px); grid-auto-rows:72px; }
|
||||
/* 折叠态:单列 4 行(4 个按钮:汉堡键 + 任务/设置/排行榜正好填满) */
|
||||
#sceneToolbar.collapsed{ grid-template-rows:repeat(4,72px); }
|
||||
#sceneToolbar.collapsed .top-icon:not(.toolbar-core):not(#btnToolbarToggle){ display:none; }
|
||||
.top-icon{
|
||||
position:relative; width:64px; height:64px; border-radius:13px; flex-shrink:0;
|
||||
@@ -994,8 +999,8 @@ body { background: #0a0e17; overflow: hidden; font-family: 'Microsoft YaHei', sa
|
||||
#navControls{bottom:calc(96px + env(safe-area-inset-bottom));right:14px;
|
||||
grid-template-columns:repeat(3,60px);grid-template-rows:repeat(3,60px);gap:6px;}
|
||||
#navControls button{width:60px;height:60px;font-size:24px;border-radius:15px;}
|
||||
#sceneToolbar{right:12px;gap:7px;padding:9px 10px;grid-template-columns:repeat(3,52px);grid-auto-rows:58px;}
|
||||
#sceneToolbar.collapsed{grid-template-columns:repeat(2,52px);grid-auto-rows:58px;}
|
||||
#sceneToolbar{right:12px;gap:7px;padding:9px 10px;grid-template-columns:52px;grid-auto-columns:52px;grid-template-rows:repeat(7,58px);grid-auto-rows:58px;grid-auto-flow:column;}
|
||||
#sceneToolbar.collapsed{grid-template-rows:repeat(4,58px);}
|
||||
#sceneToolbar .top-icon{width:52px;height:52px;font-size:17px;}
|
||||
#sceneToolbar .top-icon img,
|
||||
#sceneToolbar .top-icon svg{width:22px;height:22px;}
|
||||
@@ -1011,8 +1016,8 @@ body { background: #0a0e17; overflow: hidden; font-family: 'Microsoft YaHei', sa
|
||||
#bottomBar .bb-btn{padding:7px 9px;font-size:11px;}
|
||||
#worldExpBarWrap{width:280px;gap:5px;}
|
||||
#worldExpBarWrap .we-title{display:none;}
|
||||
#sceneToolbar{right:8px;gap:5px;padding:7px 8px;top:calc(58px + env(safe-area-inset-top) + 6px);grid-template-columns:repeat(3,46px);grid-auto-rows:52px;}
|
||||
#sceneToolbar.collapsed{grid-template-columns:repeat(2,46px);grid-auto-rows:52px;}
|
||||
#sceneToolbar{right:8px;gap:5px;padding:7px 8px;top:calc(58px + env(safe-area-inset-top) + 6px);grid-template-columns:46px;grid-auto-columns:46px;grid-template-rows:repeat(7,52px);grid-auto-rows:52px;grid-auto-flow:column;}
|
||||
#sceneToolbar.collapsed{grid-template-rows:repeat(4,52px);}
|
||||
#sceneToolbar .top-icon{width:46px;height:46px;font-size:15px;}
|
||||
#sceneToolbar .top-icon img,
|
||||
#sceneToolbar .top-icon svg{width:20px;height:20px;}
|
||||
@@ -1148,6 +1153,7 @@ body { background: #0a0e17; overflow: hidden; font-family: 'Microsoft YaHei', sa
|
||||
<span class="brand">宇森</span>
|
||||
<span class="worldNameWrap">
|
||||
<span class="worldName editable" id="worldName" title="点击编辑世界名称">加载中…</span>
|
||||
<!-- 临时隐藏:测试阶段金币编辑器
|
||||
<span class="goldEditor" id="goldEditor" title="测试阶段工具:调整角色金币">
|
||||
<span class="ge-label"><span class="ge-icon">🪙</span> 金币</span>
|
||||
<span class="ge-current" id="goldCurrent">0</span>
|
||||
@@ -1158,6 +1164,7 @@ body { background: #0a0e17; overflow: hidden; font-family: 'Microsoft YaHei', sa
|
||||
</span>
|
||||
<span class="ge-hint">测试工具</span>
|
||||
</span>
|
||||
-->
|
||||
</span>
|
||||
</span>
|
||||
<div class="topRight">
|
||||
@@ -1225,9 +1232,17 @@ body { background: #0a0e17; overflow: hidden; font-family: 'Microsoft YaHei', sa
|
||||
<img src="assets/icons/settings/settings.png?v=2" alt="设置">
|
||||
<span class="top-icon-label">设置</span>
|
||||
</button>
|
||||
<button class="top-icon" id="btnWebsite" type="button" title="官网">
|
||||
<img src="assets/icons/website/website.png?v=2" alt="官网">
|
||||
<span class="top-icon-label">官网</span>
|
||||
<button class="top-icon" id="btnAuction" type="button" title="拍卖行">
|
||||
<img src="assets/icons/auction/auction.png?v=2" alt="拍卖行">
|
||||
<span class="top-icon-label">拍卖行</span>
|
||||
</button>
|
||||
<button class="top-icon" id="btnInventory" type="button" title="包裹">
|
||||
<img src="assets/icons/inventory/inventory.png?v=2" alt="包裹">
|
||||
<span class="top-icon-label">包裹</span>
|
||||
</button>
|
||||
<button class="top-icon" id="btnMall" type="button" title="商城">
|
||||
<img src="assets/icons/shop/shop.png?v=4" alt="商城">
|
||||
<span class="top-icon-label">商城</span>
|
||||
</button>
|
||||
<button class="top-icon" id="btnNotice" type="button" title="公告">
|
||||
<img src="assets/icons/notice/notice.png?v=2" alt="公告">
|
||||
@@ -1237,31 +1252,33 @@ body { background: #0a0e17; overflow: hidden; font-family: 'Microsoft YaHei', sa
|
||||
<img src="assets/icons/rank/rank.png?v=3" alt="排行榜">
|
||||
<span class="top-icon-label">排行榜</span>
|
||||
</button>
|
||||
<button class="top-icon" id="btnTech" type="button" title="科技">
|
||||
<img src="assets/icons/tech/tech.png?v=2" alt="科技">
|
||||
<span class="top-icon-label">科技</span>
|
||||
</button>
|
||||
<button class="top-icon" id="btnCalendar" type="button" title="日历">
|
||||
<img src="assets/icons/calendar/calendar.png?v=2" alt="日历">
|
||||
<span class="top-icon-label">日历</span>
|
||||
</button>
|
||||
<button class="top-icon" id="btnHeight" type="button" title="高度">
|
||||
<img src="assets/icons/height/height.png?v=2" alt="高度">
|
||||
<span class="top-icon-label">高度</span>
|
||||
<button class="top-icon" id="btnFriends" type="button" title="好友">
|
||||
<img src="assets/icons/friends/friends.png?v=2" alt="好友">
|
||||
<span class="top-icon-label">好友</span>
|
||||
<span class="top-icon-badge" id="friendBadge" hidden>0</span>
|
||||
</button>
|
||||
<button class="top-icon" id="btnAchievements" type="button" title="成就">
|
||||
<img src="assets/icons/achievement/achievement.png?v=5" alt="成就">
|
||||
<span class="top-icon-label">成就</span>
|
||||
<span class="top-icon-badge" id="achBadge" hidden></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- 主沙盘底部功能框架(世界等级经验条置于最右侧) -->
|
||||
<div id="bottomBar">
|
||||
<div class="bb-quick-icons">
|
||||
<button class="quick-icon" id="btnAuction" type="button" title="拍卖行">
|
||||
<img src="assets/icons/auction/auction.png?v=2" alt="拍卖行">
|
||||
<span class="qi-label">拍卖行</span>
|
||||
</button>
|
||||
<button class="quick-icon" id="btnData" type="button" title="数据">
|
||||
<img src="assets/icons/data/data.png?v=2" alt="数据">
|
||||
<span class="qi-label">数据</span>
|
||||
</button>
|
||||
<button class="quick-icon" id="btnInventory" type="button" title="包裹">
|
||||
<img src="assets/icons/inventory/inventory.png?v=2" alt="包裹">
|
||||
<span class="qi-label">包裹</span>
|
||||
</button>
|
||||
<button class="quick-icon" id="btnTerrain" type="button" title="地形">
|
||||
<img src="assets/icons/terrain/terrain.png?v=2" alt="地形">
|
||||
<span class="qi-label">地形</span>
|
||||
@@ -1270,23 +1287,13 @@ body { background: #0a0e17; overflow: hidden; font-family: 'Microsoft YaHei', sa
|
||||
<img src="assets/icons/move/move.png?v=2" alt="移动">
|
||||
<span class="qi-label">移动</span>
|
||||
</button>
|
||||
<button class="quick-icon" id="btnMall" type="button" title="商城">
|
||||
<img src="assets/icons/shop/shop.png?v=4" alt="商城">
|
||||
<span class="qi-label">商城</span>
|
||||
<button class="quick-icon" id="btnHeight" type="button" title="高度">
|
||||
<img src="assets/icons/height/height.png?v=2" alt="高度">
|
||||
<span class="qi-label">高度</span>
|
||||
</button>
|
||||
<button class="quick-icon" id="btnTech" type="button" title="科技">
|
||||
<img src="assets/icons/tech/tech.png?v=2" alt="科技">
|
||||
<span class="qi-label">科技</span>
|
||||
</button>
|
||||
<button class="quick-icon" id="btnFriends" type="button" title="好友">
|
||||
<img src="assets/icons/friends/friends.png?v=2" alt="好友">
|
||||
<span class="qi-label">好友</span>
|
||||
<span class="top-icon-badge" id="friendBadge" hidden>0</span>
|
||||
</button>
|
||||
<button class="quick-icon" id="btnAchievements" type="button" title="成就">
|
||||
<img src="assets/icons/achievement/achievement.png?v=5" alt="成就">
|
||||
<span class="qi-label">成就</span>
|
||||
<span class="top-icon-badge" id="achBadge" hidden></span>
|
||||
<button class="quick-icon" id="btnWebsite" type="button" title="官网">
|
||||
<img src="assets/icons/website/website.png?v=2" alt="官网">
|
||||
<span class="qi-label">官网</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="bb-slots" style="display:none;">
|
||||
@@ -2629,21 +2636,14 @@ function microRenderCharHud() {
|
||||
updateGoldEditorDisplay();
|
||||
}
|
||||
|
||||
// 顶部金币编辑器 + 底部世界经验条货币展示(共用角色货币数据)
|
||||
// 临时隐藏:测试阶段金币编辑器
|
||||
/*
|
||||
function updateGoldEditorDisplay() {
|
||||
const editor = document.getElementById('goldEditor');
|
||||
const current = document.getElementById('goldCurrent');
|
||||
if (editor) editor.style.display = microChar ? 'inline-flex' : 'none';
|
||||
if (current) current.textContent = Math.floor((microChar && microChar.gold) || 0);
|
||||
// 底部世界经验条:金币/铜币/银币/钻石
|
||||
const setWc = (id, val) => {
|
||||
const el = document.getElementById(id);
|
||||
if (el) el.textContent = Math.floor(val || 0);
|
||||
};
|
||||
setWc('wcGold', microChar ? microChar.gold : 0);
|
||||
setWc('wcCopper', microChar ? microChar.copper : 0);
|
||||
setWc('wcSilver', microChar ? microChar.silver : 0);
|
||||
setWc('wcDiamond', microChar ? microChar.diamond : 0);
|
||||
refreshBottomCurrency();
|
||||
}
|
||||
async function changeGoldEditor(delta) {
|
||||
if (!microChar) { microToast('角色未加载,无法修改金币'); return; }
|
||||
@@ -2677,8 +2677,22 @@ function initGoldEditor() {
|
||||
if (input) input.addEventListener('keydown', (e) => {
|
||||
if (e.key === 'Enter') { e.preventDefault(); changeGoldEditor(1); }
|
||||
});
|
||||
updateGoldEditorDisplay();
|
||||
refreshBottomCurrency();
|
||||
}
|
||||
*/
|
||||
// 底部世界经验条货币展示(金币/铜币/银币/钻石)
|
||||
function refreshBottomCurrency() {
|
||||
const setWc = (id, val) => {
|
||||
const el = document.getElementById(id);
|
||||
if (el) el.textContent = Math.floor(val || 0);
|
||||
};
|
||||
setWc('wcGold', microChar ? microChar.gold : 0);
|
||||
setWc('wcCopper', microChar ? microChar.copper : 0);
|
||||
setWc('wcSilver', microChar ? microChar.silver : 0);
|
||||
setWc('wcDiamond', microChar ? microChar.diamond : 0);
|
||||
}
|
||||
// 编辑器已隐藏,顶部调用和入参都改为刷新底部货币即可
|
||||
function updateGoldEditorDisplay() { refreshBottomCurrency(); }
|
||||
|
||||
// ============ 任务系统(新手主线,后端驱动) ============
|
||||
let taskData = null; // {chapters, tasks, char}
|
||||
@@ -8328,7 +8342,7 @@ if (typeof fitWorld === 'function') fitWorld();
|
||||
if (wnEl) wnEl.textContent = local || '我的世界';
|
||||
}
|
||||
fetchTasks(); // 登录即拉取新手主线任务(主世界初次进入也要触发,不只进地块时)
|
||||
initGoldEditor(); // 初始化测试阶段金币编辑器
|
||||
// initGoldEditor(); // 临时隐藏:测试阶段金币编辑器
|
||||
const backdrop = document.getElementById('uaBackdrop');
|
||||
const closeBtn = document.getElementById('uaClose');
|
||||
const setMenuOpen = (open) => {
|
||||
|
||||
Reference in New Issue
Block a user