+
+
+
+
+
+
-
-
-
-
-
-
+
+
写一句祝福
+
@@ -1080,26 +1090,92 @@ watch(
width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 9999px;
backdrop-filter: blur(12px); border: 0.5px solid rgba(168, 140, 107, 0.3); color: #a88c6b; background: rgba(255,255,255,0.6);
}
+.action-dock {
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 50;
+ display: flex;
+ flex-direction: column;
+ align-items: stretch;
+ gap: 10px;
+ padding: 0 16px calc(12px + env(safe-area-inset-bottom, 0px));
+ pointer-events: none;
+}
+.action-dock-row {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ gap: 10px;
+ pointer-events: none;
+}
+.action-dock-row > * { pointer-events: auto; }
+.action-pill {
+ min-width: 52px;
+ min-height: 52px;
+ padding: 8px 14px;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ gap: 6px;
+ border-radius: 9999px;
+ cursor: pointer;
+ backdrop-filter: blur(14px);
+ -webkit-backdrop-filter: blur(14px);
+ border: 0.5px solid rgba(168, 140, 107, 0.28);
+ background: rgba(255, 253, 249, 0.42);
+ color: #a88c6b;
+ box-shadow: 0 6px 18px rgba(92, 74, 53, 0.08);
+ transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
+}
+.action-pill:active { transform: scale(0.97); }
+.action-pill-icon { width: 18px; height: 18px; display: block; }
+.action-rsvp {
+ font-size: 13px;
+ letter-spacing: 0.18em;
+ padding: 10px 18px;
+}
.like-fab {
- width: 38px; min-height: 48px; padding: 6px 4px 5px;
- display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
- border-radius: 9999px; cursor: pointer;
- backdrop-filter: blur(12px);
- border: 0.5px solid rgba(168, 140, 107, 0.3);
- background: rgba(255,255,255,0.6);
+ flex-direction: column;
+ gap: 3px;
+ padding: 8px 12px;
+ min-width: 52px;
}
.like-fab.liked {
- border-color: rgba(244, 114, 182, 0.55);
- background: rgba(255, 241, 247, 0.9);
+ border-color: rgba(244, 114, 182, 0.45);
+ background: rgba(255, 241, 247, 0.5);
}
.like-fab.busy { opacity: 0.7; pointer-events: none; }
-.like-icon { font-size: 14px; color: #a88c6b; line-height: 1; }
+.like-icon { font-size: 18px; color: #a88c6b; line-height: 1; }
.like-fab.liked .like-icon { color: #f472b6; }
.like-count {
- font-size: 9px; letter-spacing: 0.02em; color: #a88c6b;
+ font-size: 11px; letter-spacing: 0.02em; color: #a88c6b;
line-height: 1; text-align: center; max-width: 100%;
}
.like-fab.liked .like-count { color: #f472b6; font-weight: 600; }
+.action-comment {
+ pointer-events: auto;
+ width: 100%;
+ min-height: 48px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 8px;
+ border-radius: 9999px;
+ cursor: pointer;
+ backdrop-filter: blur(16px);
+ -webkit-backdrop-filter: blur(16px);
+ border: 0.5px solid rgba(168, 140, 107, 0.26);
+ background: rgba(255, 253, 249, 0.38);
+ color: #a88c6b;
+ font-size: 13px;
+ letter-spacing: 0.28em;
+ box-shadow: 0 8px 22px rgba(92, 74, 53, 0.1);
+ transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
+}
+.action-comment:active { transform: scale(0.99); }
+.action-comment-icon { width: 18px; height: 18px; opacity: 0.9; }
.danmaku-color-row {
display: flex; flex-wrap: wrap; gap: 10px; padding: 2px 2px 0;
}