Automerge backed Markdown editor for the Atmosphere
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687.feedback-frame { position: absolute; inset: 0; z-index: 15; display: flex; flex-direction: column; overflow: auto; background: var(--bg-primary); color: var(--text-primary);}.feedback-frame--embedded { position: relative; z-index: auto; overflow: visible; background: transparent; }.feedback-frame--embedded .feedback-frame-content { display: flex; flex-direction: column; align-items: stretch; width: 100%; margin: 0; gap: 16px; }.feedback-frame--embedded .feedback-board, .feedback-frame--embedded .feedback-composer { padding: 0; border: 0; background: transparent; }.feedback-frame--embedded .feedback-section-heading h2 { margin: 0; font-size: 16px; }.feedback-frame--embedded .feedback-composer h2 { margin: 0 0 16px; padding-bottom: 8px; border-bottom: 1px solid var(--background-modifier-border, #3d3d3d); font-size: 16px; }.sectioned-dialog .feedback-section-heading,.sectioned-dialog .feedback-composer h2 { margin-inline: calc(-1 * var(--dialog-content-inset)); padding-inline: var(--dialog-content-inset); line-height: 20px;}.sectioned-dialog .feedback-section-heading h2 { line-height: 20px; }
.feedback-frame-header { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; padding: 20px max(20px, calc((100% - 1000px) / 2)); border-bottom: 1px solid var(--border-color); background: var(--bg-primary);}
.feedback-frame-header h1 { margin: 0; font-size: 1.4rem; }.feedback-eyebrow { margin: 0 0 5px; color: var(--text-secondary); font-size: .75rem; letter-spacing: .08em; }.feedback-close { min-width: 44px; min-height: 44px; border: 0; background: transparent; color: var(--text-secondary); font-size: 1.5rem; cursor: pointer; }
.feedback-frame-content { width: min(calc(100% - 40px), 1000px); margin: 24px auto; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(260px, .8fr); gap: 24px; align-items: start;}
.feedback-board, .feedback-composer { padding: 20px; border: 1px solid var(--border-color); border-radius: var(--ui-radius); background: var(--bg-secondary); }.feedback-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 4px; padding-bottom: 8px; border-bottom: 1px solid var(--background-modifier-border, #3d3d3d); }.feedback-section-heading h2, .feedback-composer h2 { margin: 0; font-size: 1.1rem; }.feedback-section-heading a { color: var(--accent); font-size: .875rem; }.feedback-open-board { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }.feedback-open-board__icon { width: 18px; height: 16px; flex-shrink: 0; background: currentColor; mask: url('./userinput-favicon.svg') center / contain no-repeat; }.feedback-post { padding: 18px 0; border-top: 1px solid var(--border-color); }.feedback-post:first-child { border-top: 0; }.feedback-post h3 { margin: 0 0 8px; font-size: 1rem; line-height: 1.35; }.feedback-post h3 a { color: inherit; text-decoration: none; }.feedback-post h3 a:hover, .feedback-post h3 a:focus-visible { color: var(--accent); text-decoration: underline; }.feedback-post p, .feedback-muted, .feedback-signin p { color: var(--text-secondary); font-size: .9rem; line-height: 1.5; }.feedback-post p { margin: 0 0 10px; }.feedback-post-meta { display: flex; align-items: center; gap: 5px 12px; flex-wrap: wrap; color: var(--text-secondary); font-size: .8rem; line-height: 1.45; }.feedback-post-tag { color: var(--accent); }.feedback-post-status { text-transform: capitalize; }.feedback-composer label { display: block; margin: 18px 0 8px; font-size: .9rem; }.feedback-composer textarea { box-sizing: border-box; width: 100%; resize: vertical; padding: 11px; border: 1px solid var(--border-color); border-radius: var(--ui-radius); background: var(--bg-primary); color: var(--text-primary); font: inherit; }.feedback-composer input:not([type="checkbox"]) { box-sizing: border-box; width: 100%; min-height: 44px; padding: 10px 11px; border: 1px solid var(--border-color); border-radius: var(--ui-radius); background: var(--bg-primary); color: var(--text-primary); font: inherit; }.feedback-count { margin: 5px 0; color: var(--text-secondary); font-size: .8rem; text-align: right; }.feedback-tags { display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 16px 0; padding: 0 10px 2px; border: 1px solid var(--border-color); border-radius: var(--ui-radius); }.feedback-tags legend { padding: 0 5px; color: var(--text-secondary); font-size: .85rem; }.feedback-tags label { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; margin: 0; font-size: .8rem; }.feedback-tags input[type="checkbox"] { width: 1rem; height: 1rem; margin: 0; accent-color: var(--accent); cursor: pointer; flex-shrink: 0; }.feedback-submit { width: 100%; }.feedback-saved-drafts { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }.feedback-saved-drafts .reams-action-button { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }.feedback-submit:disabled { background: var(--bg-tertiary); border-color: var(--border-color); color: var(--text-secondary); opacity: 1; }.feedback-submit-error { color: var(--text-error, #ef6b73); font-size: .9rem; line-height: 1.5; }.feedback-success { color: var(--text-primary); font-size: .9rem; }.feedback-success a { color: var(--accent); }.feedback-composer textarea:focus-visible, .feedback-frame button:focus-visible, .feedback-frame a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }.feedback-composer input:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }@media (max-width: 700px) { .feedback-frame-header { padding: 12px 16px; } .feedback-frame-content { width: calc(100% - 24px); margin: 12px auto 24px; grid-template-columns: 1fr; gap: 12px; } .feedback-board, .feedback-composer { padding: 16px; }}