| * { |
| -webkit-font-smoothing: antialiased; |
| -moz-osx-font-smoothing: grayscale; |
| text-rendering: geometricPrecision; |
| } |
|
|
| [data-component="line-comment-v2"] { |
| box-sizing: border-box; |
| font-family: var(--v2-font-family-sans); |
| font-variant-numeric: tabular-nums; |
| min-width: 0; |
| width: 100%; |
| max-width: 400px; |
| } |
|
|
| [data-component="line-comment-v2"] *, |
| [data-component="line-comment-v2"] *::before, |
| [data-component="line-comment-v2"] *::after { |
| box-sizing: border-box; |
| } |
|
|
| [data-component="line-comment-v2"] [data-slot="line-comment-v2-shell"] { |
| background: var(--v2-background-bg-layer-01); |
| border-radius: 6px; |
| box-shadow: var(--v2-elevation-raised); |
| } |
|
|
| |
| [data-component="line-comment-v2"][data-variant="display"] [data-slot="line-comment-v2-shell"] { |
| display: flex; |
| flex-direction: row; |
| align-items: flex-start; |
| padding: 12px; |
| gap: 8px; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="display"] [data-slot="line-comment-v2-column"] { |
| display: flex; |
| flex-direction: column; |
| align-items: flex-start; |
| gap: 8px; |
| flex: 1 1 auto; |
| min-width: 0; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="display"] [data-slot="line-comment-v2-text"] { |
| margin: 0; |
| width: 100%; |
| font-size: 13px; |
| font-style: normal; |
| font-weight: 440; |
| line-height: 1; |
| letter-spacing: -0.04px; |
| color: var(--v2-text-text-base); |
| font-variation-settings: "slnt" 0; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="display"] [data-slot="line-comment-v2-meta"] { |
| font-size: 11px; |
| font-style: normal; |
| font-weight: 530; |
| line-height: 1; |
| letter-spacing: 0.05px; |
| color: var(--v2-text-text-faint); |
| font-variation-settings: "slnt" 0; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="display"] [data-slot="line-comment-v2-tools"] { |
| display: flex; |
| flex-direction: row; |
| align-items: flex-start; |
| flex-shrink: 0; |
| } |
|
|
| [data-slot="line-comment-v2-overflow"] { |
| display: inline-flex; |
| flex-direction: row; |
| justify-content: center; |
| align-items: center; |
| width: 20px; |
| height: 20px; |
| padding: 2px; |
| gap: 3px; |
| margin: 0; |
| border: none; |
| border-radius: 4px; |
| background: transparent; |
| color: var(--v2-icon-icon-muted); |
| cursor: pointer; |
| outline: none; |
| } |
|
|
| [data-slot="line-comment-v2-overflow"]:focus { |
| outline: none; |
| } |
|
|
| [data-slot="line-comment-v2-overflow"]:focus-visible { |
| outline: 2px solid var(--v2-border-border-focus); |
| outline-offset: 2px; |
| } |
|
|
| [data-slot="line-comment-v2-overflow"]:is(:hover, [data-state="hover"]) { |
| background-color: var(--v2-overlay-simple-overlay-hover); |
| } |
|
|
| [data-slot="line-comment-v2-overflow"]:is(:active, [data-state="pressed"]) { |
| background-color: var(--v2-overlay-simple-overlay-pressed); |
| } |
|
|
| [data-slot="line-comment-v2-overflow"] svg { |
| display: block; |
| flex-shrink: 0; |
| } |
|
|
| |
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-shell"] { |
| display: flex; |
| flex-direction: column; |
| align-items: flex-start; |
| padding: 12px; |
| gap: 12px; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-field"] { |
| display: flex; |
| flex-direction: column; |
| align-items: flex-start; |
| gap: 8px; |
| width: 100%; |
| min-width: 0; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-label"] { |
| display: flex; |
| flex-direction: row; |
| align-items: center; |
| width: 100%; |
| font-size: 13px; |
| font-style: normal; |
| font-weight: 530; |
| line-height: 1; |
| letter-spacing: -0.04px; |
| color: var(--v2-text-text-base); |
| user-select: none; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-textarea"] { |
| display: block; |
| width: 100%; |
| min-width: 0; |
| min-height: 80px; |
| padding: 8px; |
| margin: 0; |
| resize: vertical; |
| border: 1px solid var(--v2-border-border-base); |
| border-radius: 6px; |
| background: |
| linear-gradient(180deg, var(--v2-alpha-light-2) 0%, var(--v2-alpha-light-0) 100%), var(--v2-background-bg-base); |
| font-size: 13px; |
| font-style: normal; |
| font-weight: 440; |
| line-height: 1.35; |
| letter-spacing: -0.04px; |
| color: var(--v2-text-text-base); |
| font-variation-settings: "slnt" 0; |
| outline: none; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-textarea"]::placeholder { |
| color: var(--v2-text-text-faint); |
| user-select: none; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-textarea"]:focus { |
| border-color: var(--v2-border-border-focus); |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-footer"] { |
| display: flex; |
| flex-direction: row; |
| align-items: center; |
| gap: 4px; |
| width: 100%; |
| min-width: 0; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-footer-meta"] { |
| flex: 1 1 auto; |
| min-width: 0; |
| font-size: 11px; |
| font-style: normal; |
| font-weight: 530; |
| line-height: 1; |
| letter-spacing: 0.05px; |
| color: var(--v2-text-text-faint); |
| font-variation-settings: "slnt" 0; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-footer-actions"] { |
| display: flex; |
| flex-direction: row; |
| align-items: center; |
| gap: 8px; |
| flex-shrink: 0; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-mention-list"] { |
| display: flex; |
| flex-direction: column; |
| gap: 4px; |
| max-height: 180px; |
| overflow: auto; |
| margin-top: 8px; |
| padding: 4px; |
| border: 0.5px solid var(--v2-border-border-muted); |
| border-radius: 6px; |
| background: var(--v2-background-bg-layer-02); |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-mention-item"] { |
| display: flex; |
| align-items: center; |
| gap: 8px; |
| width: 100%; |
| min-width: 0; |
| padding: 6px 8px; |
| border: 0; |
| border-radius: 4px; |
| background: transparent; |
| color: var(--v2-text-text-base); |
| text-align: start; |
| cursor: pointer; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-mention-item"][data-active] { |
| background: var(--v2-background-bg-layer-03); |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-mention-path"] { |
| display: flex; |
| align-items: center; |
| min-width: 0; |
| font-size: 12px; |
| line-height: 16px; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-mention-dir"] { |
| min-width: 0; |
| color: var(--v2-text-text-muted); |
| white-space: nowrap; |
| overflow: hidden; |
| text-overflow: ellipsis; |
| } |
|
|
| [data-component="line-comment-v2"][data-variant="editor"] [data-slot="line-comment-v2-mention-file"] { |
| color: var(--v2-text-text-base); |
| white-space: nowrap; |
| } |
|
|