jackyu66gitandCursor
2fb1dfee14
Archive the differentiated YuXinGu product docs, AI engineering system, design contract, and Go/Vue scaffold. Next execution prioritizes Cece-parity over early innovation (see .ai/product/STRATEGY.md). Co-authored-by: Cursor <cursoragent@cursor.com>
73 lines
2.7 KiB
CSS
73 lines
2.7 KiB
CSS
/* 愈心谷共享壳 —— 品牌色、布局、底栏、二级顶栏 */
|
|
:root{
|
|
--pri:#E54D42; --blue:#4A90E2; --green:#5CB85C;
|
|
--purple:#8B5CF6; --orange:#E8985A; --pink:#E0508C;
|
|
--gold:#C8923A;
|
|
--text:#333; --sub:#999;
|
|
--hero-start:#FF9F80; --hero-end:#FFB8A6;
|
|
--bg-start:#FFD1C7; --bg-end:#FFC8B5;
|
|
--nav-h:56px;
|
|
}
|
|
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
|
|
html,body{min-height:100%}
|
|
body.app-body{
|
|
font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Helvetica Neue",sans-serif;
|
|
background:linear-gradient(180deg,var(--bg-start) 0%,var(--bg-end) 30%,#fff5f0 100%);
|
|
color:var(--text);max-width:430px;margin:0 auto;
|
|
-webkit-font-smoothing:antialiased;
|
|
padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom,0px) + 12px);
|
|
}
|
|
body.app-body.no-nav{padding-bottom:24px}
|
|
|
|
a{color:inherit}
|
|
|
|
/* ── 二级顶栏 ── */
|
|
.app-topbar{
|
|
display:flex;align-items:center;gap:10px;
|
|
padding:12px 14px;position:sticky;top:0;z-index:50;
|
|
background:linear-gradient(180deg,var(--bg-start) 0%,rgba(255,209,199,0.85) 100%);
|
|
-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
|
|
}
|
|
.app-topbar .back{
|
|
width:36px;height:36px;border:none;background:rgba(255,255,255,0.7);
|
|
border-radius:10px;font-size:18px;color:#555;cursor:pointer;
|
|
display:flex;align-items:center;justify-content:center;text-decoration:none;flex-shrink:0;
|
|
}
|
|
.app-topbar .title{
|
|
flex:1;font-size:16px;font-weight:600;color:var(--text);
|
|
white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;
|
|
padding-right:36px;
|
|
}
|
|
|
|
/* ── 底栏 ── */
|
|
.app-nav{
|
|
position:fixed;bottom:0;left:50%;transform:translateX(-50%);
|
|
width:100%;max-width:430px;background:#fff;
|
|
display:flex;justify-content:space-around;
|
|
padding:6px 0 calc(10px + env(safe-area-inset-bottom,0));
|
|
border-top:1px solid #f0f0f0;z-index:100;
|
|
box-shadow:0 -2px 8px rgba(0,0,0,0.03);
|
|
}
|
|
.app-nav a{
|
|
display:flex;flex-direction:column;align-items:center;gap:2px;
|
|
font-size:10px;color:var(--sub);text-decoration:none;line-height:1;
|
|
flex:1;padding:2px 0;
|
|
}
|
|
.app-nav a.active{color:var(--pri)}
|
|
.app-nav .ni{
|
|
width:20px;height:20px;display:flex;align-items:center;justify-content:center;
|
|
font-size:16px;line-height:1;
|
|
}
|
|
|
|
/* ── 通用卡片 ── */
|
|
.app-card{
|
|
background:#fff;border-radius:16px;padding:18px 16px;
|
|
box-shadow:0 2px 10px rgba(0,0,0,0.04);
|
|
}
|
|
.app-section{padding:0 16px;margin-top:18px}
|
|
.app-sec-title{font-size:16px;font-weight:600;color:var(--text);margin-bottom:10px}
|
|
|
|
.page-pad{padding:0 16px 20px}
|
|
.page-header{text-align:center;padding:20px 16px 12px}
|
|
.page-header .sub{font-size:13px;color:rgba(0,0,0,0.45);margin-top:4px}
|