@instructure/quiz-interactions/src/components/hotspot/Result/FeedbackPopover/styles.js

A React UI component Library for quiz interaction types.

const generateStyle = (componentTheme, props) => {
  const mp = '@media print'

  const feedbackVariants = {
    correct: {backgroundColor: componentTheme.feedbackCorrectColor},
    incorrect: {backgroundColor: componentTheme.feedbackIncorrectColor},
    unknown: {backgroundColor: componentTheme.feedbackUnknownColor},
  }

  return {
    feedback: {
      display: 'flex',
      alignItems: 'center',
      padding: `${componentTheme.feedbackTopBottomPadding} ${componentTheme.feedbackLeftRightPadding}`,
      color: componentTheme.feedbackTextColor,
      ...feedbackVariants[props.status],
      [mp]: {
        colorAdjust: 'exact',
      },
    },
    feedbackText: {
      marginLeft: componentTheme.feedbackTextMargin,
    },
  }
}

export default generateStyle