diff --git a/src/App.css b/src/App.css index ca5a40dc..5b57fd17 100644 --- a/src/App.css +++ b/src/App.css @@ -2459,50 +2459,6 @@ body.has-player .chat-fab { gap: 0.4rem; } -.profile-email-btn { - display: inline-flex; - align-items: center; - justify-content: center; - height: 1.75rem; - padding: 0 0.65rem; - border-radius: var(--radius-sm); - border: 1.5px solid; - font-size: var(--text-xs); - font-family: inherit; - font-weight: 500; - cursor: pointer; - box-sizing: border-box; - transition: background var(--dur-base), border-color var(--dur-base), color - var(--dur-base); -} - -.profile-email-btn--save { - background: var(--color-accent); - color: var(--color-on-accent); - border-color: var(--color-accent); -} - -.profile-email-btn--save:hover:not(:disabled) { - background: var(--color-accent-hover); - border-color: var(--color-accent-hover); -} - -.profile-email-btn--save:disabled { - opacity: 0.45; - cursor: not-allowed; -} - -.profile-email-btn--cancel { - background: transparent; - color: var(--color-text-muted); - border-color: var(--color-border); -} - -.profile-email-btn--cancel:hover { - color: var(--color-text); - border-color: var(--color-text-muted); -} - .profile-description-actions { display: flex; align-items: center; @@ -3512,6 +3468,20 @@ body.has-player .chat-fab { color: var(--color-accent); } +.btn-secondary:disabled { + opacity: 0.45; + cursor: not-allowed; + pointer-events: none; +} + +/* The compact size, for the inline editors that sit in a narrow column or + beside small text: a comment, a chat message, the profile's email. Every + inline editor ends in a btn-primary Save then a btn-secondary Cancel. */ +.btn-sm { + font-size: var(--text-sm); + padding: 0.25rem 0.75rem; +} + .btn-danger { background: var(--color-danger-bg); color: var(--color-text); @@ -4907,15 +4877,6 @@ body.has-player .chat-fab { gap: 0.4rem; } -/* Compact buttons for the inline edit box — the full-size form buttons are too - bulky for the narrow message column. */ -.chat-edit-actions .btn-primary, -.chat-edit-actions .btn-secondary { - font-size: var(--text-xs); - padding: 0.25rem 0.7rem; - box-shadow: none; -} - .chat-composer { display: flex; gap: 0.5rem; @@ -5837,46 +5798,6 @@ body.has-player .chat-fab { align-items: center; } -.comment-submit-btn { - background: var(--color-accent); - color: #fff; - border: none; - border-radius: var(--radius-md); - padding: 0.4rem 1rem; - font-family: inherit; - font-size: var(--text-sm); - font-weight: 700; - cursor: pointer; - transition: background var(--dur-base), opacity var(--dur-base); - letter-spacing: 0.02em; -} - -.comment-submit-btn:not(:disabled):hover { - background: var(--color-accent-hover); -} - -.comment-submit-btn:disabled { - opacity: 0.4; - cursor: default; -} - -.comment-cancel-btn { - background: transparent; - border: 1.5px solid var(--color-border-subtle); - border-radius: var(--radius-md); - padding: 0.4rem 1rem; - font-family: inherit; - font-size: var(--text-sm); - color: var(--color-text); - opacity: 0.6; - cursor: pointer; - transition: opacity var(--dur-base); -} - -.comment-cancel-btn:hover { - opacity: 1; -} - .comment-node-inner--deleted { opacity: 0.35; } diff --git a/src/components/chat/ChatEditBox.tsx b/src/components/chat/ChatEditBox.tsx index 847375ce..6a039139 100644 --- a/src/components/chat/ChatEditBox.tsx +++ b/src/components/chat/ChatEditBox.tsx @@ -78,13 +78,17 @@ export function ChatEditBox(
-
diff --git a/src/components/comment/CommentForm.tsx b/src/components/comment/CommentForm.tsx index c7277f95..6164de7a 100644 --- a/src/components/comment/CommentForm.tsx +++ b/src/components/comment/CommentForm.tsx @@ -109,7 +109,7 @@ export function CommentForm({
@@ -118,7 +118,7 @@ export function CommentForm({ {showCancel && (