@bolloon/bolloon-agent 0.6.5 → 0.6.7

package/dist/web/mobile.css

@@ -361,12 +361,13 @@ body {
 
 /* ============ 世界机会流 (2026-10-05, leo Intent Network) ============ */
 /* 主动流入: 打开首页即拉, 持续刷新; 不是按钮式被动响应 */
+/* 首页世界机会流 (2026-10-07: 双栏卡片, 对应桌面世界模式) */
 .world-feed {
   padding: 10px 14px 4px;
-  border-bottom: 1px solid var(--border);
   background: var(--bg);
   overflow-y: auto;
-  max-height: 42vh;
+  flex: 1;
+  min-height: 0;
 }
 .world-feed-header {
   display: flex;
@@ -382,20 +383,27 @@ body {
   color: var(--text-muted);
   font-weight: 400;
 }
-.world-feed-cards { display: flex; flex-direction: column; gap: 8px; }
-.world-feed-loading { font-size: 12px; color: var(--text-muted); padding: 8px 0; }
+/* 双栏网格 (2026-10-07: 首页双栏卡片) */
+.world-feed-cards {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 10px;
+  padding-bottom: 12px;
+}
+.world-feed-loading { font-size: 12px; color: var(--text-muted); padding: 8px 0; grid-column: 1 / -1; }
 .world-feed-card {
   background: var(--bg-card);
   border: 1px solid var(--border);
   border-left: 3px solid transparent;
-  border-radius: 10px;
-  padding: 10px 12px;
+  border-radius: 12px;
+  padding: 10px 10px;
+  min-width: 0;
 }
 .world-feed-card-top {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  gap: 8px;
+  gap: 6px;
 }
 .world-feed-title {
   font-size: 13px;
@@ -404,6 +412,8 @@ body {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+  flex: 1;
+  min-width: 0;
 }
 .world-feed-pct {
   color: var(--accent);
@@ -416,11 +426,15 @@ body {
   font-size: 12px;
   color: var(--text-secondary);
   margin-top: 4px;
-  line-height: 1.5;
+  line-height: 1.4;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
 }
 .world-feed-actions {
   display: flex;
-  gap: 8px;
+  gap: 6px;
   margin-top: 8px;
 }
 .world-feed-btn {
@@ -439,6 +453,258 @@ body {
   border-color: var(--border);
 }
 
+/* 首页底部输入框 (2026-10-07: 对应桌面世界模式输入框, Bolloon 风格) */
+.world-input-bar {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  padding: 10px 14px;
+  border-top: 1px solid var(--border);
+  background: var(--bg-sidebar, #222220);
+  flex-shrink: 0;
+}
+.world-input-bar input {
+  flex: 1;
+  min-width: 0;
+  padding: 10px 12px;
+  border-radius: 10px;
+  border: 1px solid var(--border);
+  background: var(--bg-card, #222220);
+  color: var(--text);
+  font-size: 14px;
+  outline: none;
+}
+.world-input-bar input:focus {
+  border-color: var(--accent);
+}
+.world-input-send {
+  padding: 10px 16px;
+  border: 1px solid var(--accent);
+  background: var(--accent);
+  color: #1a1a18;
+  border-radius: 10px;
+  font-size: 13px;
+  font-weight: 600;
+  flex-shrink: 0;
+}
+
+/* ============ 好友 tab: 通讯录风格 (2026-10-07, 微信式) ============ */
+.contacts-wrap {
+  position: relative;
+}
+.contacts-group-head {
+  padding: 6px 14px;
+  font-size: 12px;
+  font-weight: 600;
+  color: var(--text-muted);
+  background: var(--bg-hover, #222220);
+}
+.contact-row {
+  padding: 10px 14px;
+  border-bottom: 1px solid var(--border);
+}
+.contact-avatar {
+  background: var(--accent);
+  color: #1a1a18;
+  font-weight: 700;
+}
+.contact-sub {
+  font-size: 11px;
+  color: var(--text-muted);
+  margin-top: 2px;
+}
+.contacts-index {
+  position: fixed;
+  right: 2px;
+  top: 50%;
+  transform: translateY(-50%);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  z-index: 50;
+  font-size: 10px;
+  color: var(--text-secondary);
+  user-select: none;
+  background: rgba(0,0,0,0.25);
+  border-radius: 8px;
+  padding: 2px 3px;
+}
+.contacts-index-letter {
+  padding: 1px 2px;
+  cursor: pointer;
+  line-height: 1.3;
+}
+.contacts-index-letter:hover { color: var(--accent); }
+
+/* ============ 任务 tab: 公告板双栏瀑布流 (2026-10-07, 发现页风格) ============ */
+.board-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 10px;
+  padding: 10px 14px;
+}
+.board-card {
+  background: var(--bg-card);
+  border: 1px solid var(--border);
+  border-radius: 12px;
+  padding: 10px;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+.board-card-cap {
+  font-size: 13px;
+  font-weight: 600;
+  color: var(--text);
+  line-height: 1.4;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+.board-card-status {
+  font-size: 10px;
+  padding: 2px 6px;
+  border-radius: 4px;
+  background: var(--bg-hover, #222220);
+  color: var(--accent);
+  align-self: flex-start;
+}
+.board-card-sub {
+  font-size: 11px;
+  color: var(--text-muted);
+}
+.board-card-btn {
+  margin-top: auto;
+  padding: 6px 0;
+  border: 1px solid var(--accent);
+  background: var(--accent);
+  color: #1a1a18;
+  border-radius: 8px;
+  font-size: 12px;
+  font-weight: 600;
+}
+
+/* ============ 任务 tab: 对话框模式 (2026-10-07) ============ */
+.task-chat-page {
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+}
+.task-dash {
+  display: flex;
+  gap: 8px;
+  padding: 8px 14px;
+  border-bottom: 1px solid var(--border);
+  flex-shrink: 0;
+}
+.task-dash-btn {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 2px;
+  padding: 6px 0;
+  background: var(--bg-card, #222220);
+  border: 1px solid var(--border);
+  border-radius: 10px;
+  color: var(--text-secondary);
+  font-size: 11px;
+}
+.task-dash-ico { font-size: 16px; }
+.task-chat {
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+  padding: 12px 14px;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+.task-chat-empty {
+  color: var(--text-muted);
+  font-size: 13px;
+  text-align: center;
+  padding: 40px 20px;
+  line-height: 1.6;
+}
+.task-msg {
+  max-width: 88%;
+  padding: 10px 12px;
+  border-radius: 12px;
+  font-size: 14px;
+  line-height: 1.5;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+.task-msg-user {
+  align-self: flex-end;
+  background: var(--accent);
+  color: #1a1a18;
+  border-bottom-right-radius: 4px;
+}
+.task-msg-ai {
+  align-self: flex-start;
+  background: var(--bg-card, #222220);
+  border: 1px solid var(--border);
+  color: var(--text);
+  border-bottom-left-radius: 4px;
+}
+.task-input-bar {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  padding: 10px 14px;
+  border-top: 1px solid var(--border);
+  background: var(--bg-sidebar, #222220);
+  flex-shrink: 0;
+}
+.task-input-bar input {
+  flex: 1;
+  min-width: 0;
+  padding: 10px 12px;
+  border-radius: 10px;
+  border: 1px solid var(--border);
+  background: var(--bg-card, #222220);
+  color: var(--text);
+  font-size: 14px;
+  outline: none;
+}
+.task-input-bar input:focus { border-color: var(--accent); }
+.task-input-bar button {
+  padding: 10px 16px;
+  border: 1px solid var(--accent);
+  background: var(--accent);
+  color: #1a1a18;
+  border-radius: 10px;
+  font-size: 13px;
+  font-weight: 600;
+  flex-shrink: 0;
+}
+/* 网络工具覆盖层 */
+.task-network-panel {
+  position: fixed;
+  inset: 0;
+  z-index: 80;
+  background: var(--bg);
+  display: flex;
+  flex-direction: column;
+}
+.task-network-head {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 10px 14px;
+  border-bottom: 1px solid var(--border);
+  flex-shrink: 0;
+}
+.task-network-body {
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+}
+
 /* ============ 双频滑动卡片 (主页面) ============ */
 
 .card-carousel {
@@ -450,29 +716,28 @@ body {
 }
 
 .card-track {
-  display: flex;
-  flex-direction: column;   /* 上下翻卡 */
-  gap: 16px;
-  padding: 16px;
+  /* 2026-10-06 (用户: 首页卡片变双栏): 从单卡纵向翻页改为两列网格, 一屏看更多智能体 */
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 12px;
+  padding: 12px;
   overflow-y: auto;
   overflow-x: hidden;
-  scroll-snap-type: y mandatory;
   -webkit-overflow-scrolling: touch;
   scroll-behavior: smooth;
   height: 100%;
-  align-items: stretch;
-  touch-action: pan-y;   /* 垂直交给原生滚动翻卡, 水平交给 JS 做删除 reveal */
+  align-content: start;
+  touch-action: pan-y;   /* 垂直交给原生滚动, 水平交给 JS 做删除 reveal */
 }
 
 .card-track::-webkit-scrollbar { display: none; }
 
-/* 每张卡片外层: 纵向单元 + 删除位 */
+/* 每张卡片外层: 网格单元 + 删除位 (双栏下固定比例, 不满屏) */
 .card-wrap {
-  flex: 0 0 auto;
-  height: 80%;              /* 不满屏: 露出下一张卡片的位置 */
-  scroll-snap-align: start;
+  height: auto;
+  aspect-ratio: 3 / 4;
   position: relative;
-  border-radius: 16px;
+  border-radius: 14px;
   overflow: hidden;
   min-height: 0;
 }