Modify preview-card styles #88
Conversation
jomcarvajal
requested review from
bethshook and
jivey
and removed request for
a team
src/components/Exercise.stories.tsx
Outdated
| @@ -103,7 +104,7 @@ const exerciseWithQuestionStatesProps = (): ExerciseWithQuestionStatesProps => { | |||
| is_answer_order_important: false, | |||
| answers: [{ | |||
| id: '1', | |||
| correctness: undefined, | |||
| correctness: '1.0', | |||
There was a problem hiding this comment.
Does this break any of the other stories? Seems alright, I just can't remember why it was undefined originally
There was a problem hiding this comment.
This marks a question as correct, I can keep it as undefined and create a new variable just for new stories
src/components/Exercise/styles.ts
Outdated
|
|
||
| .question-info { | ||
| font-weight: bold; | ||
| font-size: 1.6rem; |
There was a problem hiding this comment.
Does this match Figma? I think Figma might be slightly smaller. Also I'm not sure when that other PR will get merged, so maybe we do include the fix you made last week for the broken separator :D
There was a problem hiding this comment.
You're right, it should be 1.2rem
|
|
||
| beforeEach(() => { | ||
| exercise = { | ||
| uid: '1@1', |
There was a problem hiding this comment.
I think these are indented 4 but we use 2 in this repo (and most of the repos)
| /** | ||
| * An Exercise version with less interaction with card and grants an Overlay with Include/Remove component | ||
| */ | ||
| export const ExercisePreview = ( |
There was a problem hiding this comment.
I'd prefer this to take selected and onSelectionChange props, that keeps it flexible on the consuming side
| @@ -160,7 +160,7 @@ export const mixins = { | |||
| .answer-letter-wrapper::before { | |||
| color: ${invertBubble ? '#fff' : color}; | |||
| border-color: ${color}; | |||
| ${invertBubble ? `background-color: ${color};` : null} | |||
| ${invertBubble ? `background-color: ${color} !important;` : null} | |||
There was a problem hiding this comment.
When a card is selected, all background should change color(including letter wrappers). But when a letter is marked as correct, I forced to overrides the "correct theme"
There was a problem hiding this comment.
Ah I see now, I didn't realize we set an explicit background on those
@jivey bubbles mean "answer-letters" ? |
|
@jomcarvajal Yeah I think the |
New ExercisePreview component added (show_all_feedback: false )
New style for selected cards
