Style the "Awaiting Grade" notice #7401
Conversation
| @@ -670,6 +670,9 @@ | |||
| }, | |||
| "css": "& .sensei-lms-course-navigation-module__summary { font-family: var(--wp--preset--font-family--system); }" | |||
| }, | |||
| "sensei-lms/course-theme-notices": { | |||
| "css": "& .sensei-course-theme-quiz-graded-notice__title { font-family: var(--wp--preset--font-family--system); font-size: clamp(1.5rem, 1.167rem + 1.111vw, 2rem); font-weight: 590; } .sensei-course-theme-quiz-graded-notice__text { font-size: clamp(1.25rem, 1.083rem + 0.556vw, 1.5rem); line-height: 1.3; } .sensei-course-theme-quiz-graded-notice__reset-quiz-form .sensei-course-theme__button { font-size: clamp(1.313rem, 1.188rem + 0.417vw, 1.5rem); }" | |||
| }, | |||
There was a problem hiding this comment.
Do you think converting this title to a heading element like h3 can be a good idea rather than styling the div content to make it look like a title heading? Then we can also style it without CSS by using the elements->h3 property here. That'll also probably make .sensei-course-theme-quiz-graded-notice__text stylable using the 'typography' property instead.
There was a problem hiding this comment.
Nice suggestion! I'm made some changes to this PR and also to Sensei:
Automattic/sensei@57f6d8a
Automattic/sensei@d3ddc7b
Note that I made it an h2 in order for the HTML to be semantic.
That's weird. I wonder why it would work for me but not you. 🙁 |
True, could be another Gutenberg issue. Maybe you can check with Gutenberg enabled? |
* Update styles of question feedback (#7373) * Specify the grade style to be applied only in the question header * Update background color for gold variation * Update background color for default variation * Update border color for gold variation * Tweak CSS formatting * Tweak color for border of ordering question --------- Co-authored-by: Donna Peplinskie <donnapep@gmail.com> * Update version and description * Add new changelog * Remove legacy Learning Mode CSS as it's part of Sensei now (#7431) * Course: Add body class for theme variations (#7432) * Add custom property with variation name * Add function to add body class and enqueue proper stylesheets * Add stylesheets for all variations * Add version number * Style the "Awaiting Grade" notice (#7401) * Style "Awaiting Grade" notice * Move custom CSS to other areas of theme.json * Remove typography setting as it needs to be done via CSS * Do the same for the variations * Fix notice style getting broken for css parsing issue --------- Co-authored-by: Imran Hossain <imranh920@gmail.com> * Bump versions and update change log --------- Co-authored-by: Imran Hossain <imranh920@gmail.com>
Changes proposed in this Pull Request:
Tweaks the styles of the "Awaiting Grade" notice for each theme variation.
Testing Instructions
See Automattic/sensei#7197
Related issue(s):
Automattic/sensei#7074