Retargeting question-info CSS (#85)

* Retargeting question-info CSS

* Add note about exercises.json

* Bring the font size and margins back down

* Update version

README.md

@@ -8,3 +8,6 @@ UI components for OpenStax assessments.
 - `yarn test` run tests and get coverage results
 - `yarn lint` run eslint
 - `yarn ladle serve` run Ladle server at http://localhost:61000 to view component stories
+
+Note: exercises.json needs to be created at the top level for ladle
+See src/components/Print.stories.tsx

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openstax/assessment-components",
-  "version": "1.2.5",
+  "version": "1.2.6",
   "license": "MIT",
   "source": "./src/index.ts",
   "types": "./dist/src/index.d.ts",

src/components/Card.tsx

@@ -39,10 +39,11 @@ const StepCardHeader = styled.div`
   line-height: 3rem;
   letter-spacing: -0.72px;
 
-  div.question-info {
+  h2.question-info {
     display: flex;
     align-items: baseline;
-    font-weight: bold;
+    font-size: inherit;
+    margin: inherit;
 
     .question-id {
       font-weight: normal;

src/components/__snapshots__/Card.spec.tsx.snap

@@ -8,7 +8,7 @@ exports[`StepCard matches snapshot 1`] = `
     className="sc-bczRLJ eAXREJ"
   >
     <div
-      className="sc-dkzDqf hbFgnH"
+      className="sc-dkzDqf ihThJf"
     >
       <div>
         <h2
@@ -55,7 +55,7 @@ exports[`StepCard matches snapshot with more than one question 1`] = `
     className="sc-bczRLJ eAXREJ"
   >
     <div
-      className="sc-dkzDqf hbFgnH"
+      className="sc-dkzDqf ihThJf"
     >
       <div>
         <h2
@@ -109,7 +109,7 @@ exports[`TaskStepCard can optionally provide task 1`] = `
     className="sc-bczRLJ eAXREJ exercise-step"
   >
     <div
-      className="sc-dkzDqf hbFgnH"
+      className="sc-dkzDqf ihThJf"
     >
       <div>
         <h2
@@ -148,7 +148,7 @@ exports[`TaskStepCard can optionally provide type 1`] = `
     className="sc-bczRLJ eAXREJ exercise-step"
   >
     <div
-      className="sc-dkzDqf hbFgnH"
+      className="sc-dkzDqf ihThJf"
     >
       <div>
         <h2
@@ -187,7 +187,7 @@ exports[`TaskStepCard matches snapshot 1`] = `
     className="sc-bczRLJ eAXREJ exercise-step"
   >
     <div
-      className="sc-dkzDqf hbFgnH"
+      className="sc-dkzDqf ihThJf"
     >
       <div>
         <h2

src/components/__snapshots__/Exercise.spec.tsx.snap

@@ -12,7 +12,7 @@ exports[`Exercise using step data matches snapshot 1`] = `
       className="sc-bczRLJ eAXREJ exercise-step sc-evZas dPJYxI sc-ksZaOG kmSAkY"
     >
       <div
-        className="sc-dkzDqf hbFgnH"
+        className="sc-dkzDqf ihThJf"
       >
         <div>
           <h2
@@ -203,7 +203,7 @@ exports[`Exercise with question state data matches snapshot 1`] = `
       className="sc-bczRLJ eAXREJ exercise-step sc-evZas dPJYxI sc-ksZaOG kmSAkY"
     >
       <div
-        className="sc-dkzDqf hbFgnH"
+        className="sc-dkzDqf ihThJf"
       >
         <div>
           <h2
@@ -442,7 +442,7 @@ exports[`Exercise with question state data renders header icons with multiple ch
       className="sc-bczRLJ eAXREJ exercise-step sc-evZas dPJYxI sc-ksZaOG kmSAkY"
     >
       <div
-        className="sc-dkzDqf hbFgnH"
+        className="sc-dkzDqf ihThJf"
       >
         <div>
           <h2
@@ -767,7 +767,7 @@ exports[`Exercise with question state data renders header icons with two-step ex
       className="sc-bczRLJ eAXREJ exercise-step sc-evZas dPJYxI sc-ksZaOG kmSAkY"
     >
       <div
-        className="sc-dkzDqf hbFgnH"
+        className="sc-dkzDqf ihThJf"
       >
         <div>
           <h2
@@ -1078,7 +1078,7 @@ exports[`Exercise with question state data shows a detailed solution 1`] = `
       className="sc-bczRLJ eAXREJ exercise-step sc-evZas dPJYxI sc-ksZaOG kmSAkY"
     >
       <div
-        className="sc-dkzDqf hbFgnH"
+        className="sc-dkzDqf ihThJf"
       >
         <div>
           <h2