diff options
| author | alyssaf16 <alyssa_feinberg@brown.edu> | 2024-07-23 14:06:11 -0400 |
|---|---|---|
| committer | alyssaf16 <alyssa_feinberg@brown.edu> | 2024-07-23 14:06:11 -0400 |
| commit | e82c95293bb2d9db32fc9901f57f1997b74597c1 (patch) | |
| tree | 0c67a0a66fd7d80f1853720400bbf9e5684cb843 /src/client/views/nodes/formattedText | |
| parent | 0b2a8c0d718940ddc06a966d4e027a79bb06ed6e (diff) | |
labeling work
Diffstat (limited to 'src/client/views/nodes/formattedText')
| -rw-r--r-- | src/client/views/nodes/formattedText/FormattedTextBox.scss | 30 | ||||
| -rw-r--r-- | src/client/views/nodes/formattedText/FormattedTextBox.tsx | 13 |
2 files changed, 43 insertions, 0 deletions
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.scss b/src/client/views/nodes/formattedText/FormattedTextBox.scss index 54643b4a5..227cd4312 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.scss +++ b/src/client/views/nodes/formattedText/FormattedTextBox.scss @@ -79,7 +79,37 @@ audiotag:hover { right: 8px; position: absolute; } + .answer-icon { + position: absolute; + right: 10; + bottom: 10; + color: black; + display: inline-block; + font-size: 20px; + cursor: pointer; + border-radius: 50%; + } + + .q-icon { + position: absolute; + right: 6; + bottom: 10; + color: white; + display: inline-block; + font-size: 20px; + cursor: pointer; + border-radius: 50%; + } +} + +.answer-tooltip { + font-size: 15px; + padding: 2px; + max-width: 150; + line-height: 150%; + position: relative; } + .formattedTextBox-alternateButton { align-items: center; flex-direction: column; diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index 274330d31..b00437cf2 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -2092,6 +2092,18 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB </Tooltip> ); } + + @computed get answerIcon() { + return ( + <Tooltip title={<div className="answer-tooltip">{StrCast(this.Document.quiz)}</div>}> + <div className="answer-tool-tip"> + <FontAwesomeIcon className="q-icon" icon="circle" color="white" /> + <FontAwesomeIcon className="answer-icon" icon="question" /> + </div> + </Tooltip> + ); + } + get fieldKey() { return this._fieldKey; } @@ -2210,6 +2222,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB {this.noSidebar || this.Document._layout_noSidebar || this.Document._createDocOnCR || this.layoutDoc._chromeHidden || this.Document.quiz ? null : this.sidebarHandle} {this.audioHandle} {this.layoutDoc._layout_enableAltContentUI && !this.layoutDoc._chromeHidden ? this.overlayAlternateIcon : null} + {this.Document.showQuiz ? this.answerIcon : null} </div> </div> ); |
