New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Assessments: Style free responses assessments question #23515
Conversation
or hide full question link
…m:code-dot-org/code-dot-org into style-free-responses-assessments-question
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I have a few style suggestions (that should apply to both components).
@@ -24,7 +34,11 @@ class FreeResponseBySurveyQuestionContainer extends Component { | |||
<h2>{i18n.studentFreeResponseAnswers()}</h2> | |||
{freeResponsesByQuestion.map((question, index) => ( | |||
<div key={index}> | |||
<h3>{`${question.questionNumber}. ${question.questionText}`}</h3> | |||
<div style={styles.text}> | |||
<span>{`${question.questionNumber}. ${question.questionText}`.slice(0, QUESTION_CHARACTER_LIMIT)}</span> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think it's cleaner to write this like this because we care mostly about slicing the question text:
{`${question.questionNumber}. ${question.questionText.slice(0, QUESTION_CHARACTER_LIMIT)}`}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Updated!
<h3>{`${question.questionNumber}. ${question.questionText}`}</h3> | ||
<div style={styles.text}> | ||
<span>{`${question.questionNumber}. ${question.questionText}`.slice(0, QUESTION_CHARACTER_LIMIT)}</span> | ||
{((question.questionText.length >= QUESTION_CHARACTER_LIMIT)) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think it's a bit cleaner to write this line like this:
{ question.questionText.length >= QUESTION_CHARACTER_LIMIT &&
<a href="#"><span>{i18n.seeFullQuestion()}</span></a>
}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed, thanks!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
ditto @caleybrock's comments, otherwise this looks great!
…esponse question exceed character limit
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Since this link doesn't actually do anything, and we have people using this feature, we can't merge until we add that functionality. Happy to pair on this with you.
Hmmm something went wrong with this merge conflict |
24f46db
to
df655fc
Compare
The free response assessments table has question text above the table. When the question exceeds the number of characters to fit within two lines, the question is truncated and a link to view the full question is visible (see full question).
If the question does not exceed the question character limit, the link to view the full question is hidden.
Screen shot
Screen shot