初心儀式｜桃園到府抓周・文定迎娶・抓周主持培訓
桃園市
:root{
--paper:#FBF6EF;
--paper-2:#F3ECE1;
--ink:#3E3733;
--ink-soft:#7A6F67;
--rose:#E3A0A3;
--rose-deep:#C97B84;
--sage:#8FA083;
--sage-deep:#6F8264;
--mustard:#E0AF45;
--line:#DCD0C2;
--card-shadow: 6px 6px 0 rgba(62,55,51,0.08);
}
*{box-sizing:border-box;}
body{
margin:0;
background:
radial-gradient(circle at 10% 8%, rgba(227,160,163,0.15), transparent 40%),
radial-gradient(circle at 90% 15%, rgba(143,160,131,0.15), transparent 40%),
var(--paper);
color:var(--ink);
font-family:'Noto Sans TC', sans-serif;
padding-bottom:60px;
}
.wrap{max-width:640px;margin:0 auto;padding:0 18px;}
/* header */
header{
padding:36px 18px 24px;
text-align:center;
position:relative;
}
.tape{
display:inline-block;
background:var(--mustard);
color:#fff;
font-family:'Noto Sans TC', sans-serif; font-weight:900;
font-size:13px;
padding:4px 18px;
transform:rotate(-2deg);
letter-spacing:2px;
box-shadow:2px 2px 0 rgba(0,0,0,0.08);
margin-bottom:14px;
}
h1{
font-family:'Noto Sans TC', sans-serif; font-weight:900;
font-size:30px;
line-height:1.4;
margin:0 0 10px;
color:var(--ink);
}
h1 span{color:var(--rose-deep);}
.sub{
color:var(--ink-soft);
font-size:14px;
margin:0 0 4px;
}
.credit{
font-size:12px;
color:var(--ink-soft);
letter-spacing:1px;
}
/* heart gauge */
.gauge-zone{
margin:18px auto 8px;
display:flex;
flex-direction:column;
align-items:center;
gap:10px;
}
.heart-box{width:120px;height:120px;position:relative;}
svg.heart-outline{position:absolute;inset:0;}
.heart-fill-clip rect{transition:y 0.6s ease, height 0.6s ease;}
.gauge-pct{
font-family:'Noto Sans TC', sans-serif; font-weight:900;
font-size:22px;
color:var(--rose-deep);
}
/* cards */
.card{
background:#fff;
border:1.5px solid var(--line);
border-radius:18px;
padding:20px 20px 14px;
margin:18px 0;
box-shadow:var(--card-shadow);
position:relative;
}
.card-num{
position:absolute;
top:-14px; left:18px;
background:var(--sage);
color:#fff;
font-family:'Noto Sans TC', sans-serif; font-weight:900;
font-size:15px;
width:32px;height:32px;
border-radius:50%;
display:flex;align-items:center;justify-content:center;
box-shadow:2px 2px 0 rgba(0,0,0,0.08);
}
.card-title{
font-family:'Noto Sans TC', sans-serif; font-weight:900;
font-size:19px;
margin:8px 0 14px 4px;
color:var(--ink);
}
.card-score{
float:right;
font-size:12px;
background:var(--paper-2);
color:var(--ink-soft);
padding:3px 10px;
border-radius:20px;
}
.item{
border-top:1px dashed var(--line);
padding:12px 2px;
}
.item:first-of-type{border-top:none;}
.item p{
margin:0 0 8px;
font-size:14.5px;
line-height:1.5;
}
.btn-row{display:flex;gap:8px;flex-wrap:wrap;}
.opt{
flex:1;
min-width:80px;
text-align:center;
font-size:12.5px;
padding:7px 4px;
border-radius:10px;
border:1.5px solid var(--line);
background:var(--paper);
color:var(--ink-soft);
cursor:pointer;
user-select:none;
transition:all 0.15s ease;
}
.opt:hover{border-color:var(--ink-soft);}
.opt.sel-agree{background:var(--sage);border-color:var(--sage-deep);color:#fff;font-weight:700;}
.opt.sel-talk{background:var(--mustard);border-color:#b5872e;color:#fff;font-weight:700;}
.opt.sel-diff{background:var(--rose-deep);border-color:#a85a63;color:#fff;font-weight:700;}
/* footer report */
.report{
margin-top:26px;
background:linear-gradient(135deg, var(--paper-2), #fff);
border:1.5px dashed var(--rose-deep);
border-radius:18px;
padding:22px;
text-align:center;
}
.report h2{
font-family:'Noto Sans TC', sans-serif; font-weight:900;
font-size:20px;
margin:0 0 12px;
}
.bar-row{
display:flex;align-items:center;gap:8px;
font-size:12.5px;margin:8px 0;
text-align:left;
}
.bar-label{width:118px;flex-shrink:0;color:var(--ink-soft);}
.bar-track{flex:1;background:var(--line);border-radius:8px;height:10px;overflow:hidden;}
.bar-fill{height:100%;background:var(--sage);transition:width 0.6s ease;}
.bar-num{width:38px;text-align:right;color:var(--ink-soft);flex-shrink:0;}
.reset-btn{
margin-top:16px;
background:none;
border:1.5px solid var(--ink-soft);
color:var(--ink-soft);
padding:8px 20px;
border-radius:20px;
font-size:13px;
cursor:pointer;
}
.reset-btn:hover{background:var(--ink-soft);color:#fff;}
footer{
text-align:center;
margin-top:30px;
font-size:12px;
color:var(--ink-soft);
}
伴侶溝通練習
伴侶溝通表
先聊聊這 6 件事，有共識就能走得更長久
潔咪老師小教室 ｜ @jamiex0406
共識指數 0%
共識分析報告
重新填寫
做決定前，先把話說清楚
const topics = [
{
title: "1. 你們真的都想要孩子嗎？",
items: [
"兩個人都確定想生／不生嗎？",
"如果暫時沒有共識，願意等多久再討論？",
"孩子出生後，誰負責主要照顧？",
"一方暫停工作時，經濟和家務如何分配？",
"是否願意花錢找托育或其他支援？",
"家庭有沒有後援可以適度喘息？"
]
},
{
title: "2. 你知道對方真正的財務狀況嗎？",
items: [
"婚後的家庭由誰來管錢？",
"收入、存款與投資是否願意坦白？",
"每個月是否固定存點錢？",
"是否固定支付孝親費？",
"是否曾替家人擔保，或借出尚未歸還的款項？"
]
},
{
title: "3. 婚後的錢準備怎麼管理？",
items: [
"採 AA 制、比例分攤，還是共同帳戶？",
"日常支出怎麼分配？",
"收入差距較大時，還要完全各半嗎？",
"多少金額以上需要一起討論？",
"共同存款要拿來買房、育兒，還是緊急預備？",
"每個人是否保有可自由運用的錢？"
]
},
{
title: "4. 彼此原生家庭的討論",
items: [
"婚後是否與父母同住？",
"每月孝親費及節日紅包怎麼分配？",
"父母需要金錢協助時，誰可以決定？",
"手足、親戚借錢如何取得共識？",
"父母提供買房或婚禮費用後，是否因此擁有說話權？"
]
},
{
title: "5. 居住地、工作和生活地點如何配合？",
items: [
"共同買房，登記在誰名下？",
"裝潢、頭期款與房貸如何分擔？",
"如果其中一人工作調動，另一人一定要搬嗎？",
"誰的職涯應該被優先考量？",
"搬到其中一方父母附近後，另一方需要承擔哪些影響？"
]
},
{
title: "6. 發生衝突時你們會怎麼處理？",
items: [
"可以暫時冷靜多久？",
"說好不能用失聯、摔東西或羞辱對方的方式處理",
"吵架時不能把雙方父母拉進來",
"哪些行為是婚姻中絕不能接受的底線？",
"如果反覆解決不了，是否願意一起尋求協助？"
]
}
];
const state = {}; // key: "t-i" -> 'agree'|'talk'|'diff'
function buildCards(){
const container = document.getElementById('cards');
container.innerHTML = '';
topics.forEach((topic, ti) => {
const card = document.createElement('div');
card.className = 'card';
card.innerHTML = `${ti+1}
尚未填寫
${topic.title}`;
topic.items.forEach((text, ii) => {
const key = ti+'-'+ii;
const item = document.createElement('div');
item.className = 'item';
item.innerHTML = `${text}
有共識
待討論
意見不同
`;
card.appendChild(item);
});
container.appendChild(card);
});
container.querySelectorAll('.opt').forEach(btn => {
btn.addEventListener('click', () => {
const key = btn.dataset.key;
const val = btn.dataset.val;
state[key] = (state[key] === val) ? undefined : val;
// update visuals for this item's siblings
const siblings = container.querySelectorAll(`.opt[data-key="${key}"]`);
siblings.forEach(s => {
s.classList.remove('sel-agree','sel-talk','sel-diff');
if(state[key] === s.dataset.val){
s.classList.add('sel-' + s.dataset.val);
}
});
recalc();
});
});
}
function recalc(){
let totalScore = 0, totalCount = 0;
const barList = document.getElementById('barList');
barList.innerHTML = '';
topics.forEach((topic, ti) => {
let sum = 0, count = 0;
topic.items.forEach((_, ii) => {
const key = ti+'-'+ii;
const v = state[key];
if(v){
count++;
sum += (v === 'agree') ? 1 : (v === 'talk' ? 0.5 : 0);
}
});
const scoreEl = document.getElementById('score-'+ti);
if(count === 0){
scoreEl.textContent = '尚未填寫';
} else {
const pct = Math.round((sum/count)*100);
scoreEl.textContent = pct + '% 共識';
totalScore += sum;
totalCount += count;
}
// bar row (show even if 0 answered, as 0%)
const pctForBar = count ? Math.round((sum/count)*100) : 0;
const row = document.createElement('div');
row.className = 'bar-row';
row.innerHTML = `${topic.title.replace(/^\d+\.\s*/,'')}
${count ? pctForBar+'%' : '—'}`;
barList.appendChild(row);
});
const overallPct = totalCount ? Math.round((totalScore/totalCount)*100) : 0;
document.getElementById('pctText').textContent = '共識指數 ' + overallPct + '%';
// heart fill: rect height proportional, y = 88 - (88*pct/100) roughly within heart bbox (0..88)
const fillRect = document.getElementById('fillRect');
const h = 86 * (overallPct/100);
fillRect.setAttribute('y', 88 - h);
fillRect.setAttribute('height', h);
}
function resetAll(){
Object.keys(state).forEach(k => delete state[k]);
buildCards();
recalc();
}
buildCards();
recalc();
https://www.kidora.com.tw/hot_536435.html
潔咪老師限時分享「伴侶溝通表」
2026-07-09
2027-07-09
初心儀式｜桃園到府抓周・文定迎娶・抓周主持培訓
桃園市
https://www.kidora.com.tw/hot_536435.html
初心儀式｜桃園到府抓周・文定迎娶・抓周主持培訓
桃園市
https://www.kidora.com.tw/hot_536435.html
https://schema.org/EventMovedOnline
https://schema.org/OfflineEventAttendanceMode
2026-07-09
http://schema.org/InStock
TWD
0
https://www.kidora.com.tw/hot_536435.html
