@khanacademy/perseus 1.4.1 → 2.0.1

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @khanacademy/perseus
 
+## 2.0.1
+
+### Patch Changes
+
+-   6272dfbe: Bugfix for definition prompt size in articles
+
+## 2.0.0
+
+### Major Changes
+
+-   b850ebee: Remove `satStyling` from `APIOptions`
+-   b850ebee: Remove `styling` from `APIOptions`
+
+### Patch Changes
+
+-   55841525: Fix graphie font-size to a specific size
+-   a325f740: Switch Definition's prompt from Button to Clickable to resolve text not matching
+
 ## 1.4.1
 
 ### Patch Changes

package/dist/es/index.css

@@ -372,7 +372,15 @@ body.debug .graphie { outline: 1px dashed #fdd; }
 #issue fieldset label { display: inline; }
 #issue fieldset li { margin-top: 0px; margin-bottom: 0px; }
 
-var, div.graphie { white-space: pre; }
+var, div.graphie {
+  white-space: pre;
+  /**
+   * Graphie didn't have a fixed font-size and was just using
+   * the surrounding font-size. However some labels are banking on
+   * specific dimensions, so we need to lock it to a specific size.
+   */
+  font-size: 14px;
+}
 
 #spinner { position: relative; top: 4px; left: 4px; }
 #issue-spinner { position: relative; top: 3px; }
@@ -1352,7 +1360,7 @@ body.mobile ul.inequalities-one-line-radios > li {
   margin: 0;
   max-width: none;
 }
-.bibliotron-article.framework-perseus.perseus-article:not(.perseus-mobile) .perseus-widget-container {
+.bibliotron-article.framework-perseus.perseus-article:not(.perseus-mobile) .perseus-widget-container:not(.perseus-widget__definition) {
   font-size: 14px;
   line-height: 19.6px;
 }
@@ -2552,54 +2560,6 @@ body.mobile .categorizer-container td.category input[type="radio"] + span:active
   color: #666;
   content: "\f111";
 }
-.framework-perseus:not(.perseus-article):not(.perseus-mobile) .perseus-widget-definition {
-  font-size: 14px;
-  line-height: 19.6px;
-}
-@media (max-width: 767px) {
-  .framework-perseus:not(.perseus-article).perseus-mobile .perseus-widget-definition {
-    font-size: 18px;
-    line-height: 1.4;
-  }
-}
-@media (min-width: 768px) and (max-width: 1199px) {
-  .framework-perseus:not(.perseus-article).perseus-mobile .perseus-widget-definition {
-    font-size: 20px;
-    line-height: 1.5;
-  }
-}
-@media (min-width: 1200px) {
-  .framework-perseus:not(.perseus-article).perseus-mobile .perseus-widget-definition {
-    font-size: 22px;
-    line-height: 1.4;
-  }
-}
-.bibliotron-article.framework-perseus.perseus-article .perseus-widget-definition {
-  font-size: 18px;
-  line-height: 1.4;
-}
-.bibliotron-article.framework-perseus.perseus-article:not(.perseus-mobile) .perseus-widget-definition {
-  font-size: 20px;
-  line-height: 30px;
-}
-@media (max-width: 767px) {
-  .bibliotron-article.framework-perseus.perseus-article.perseus-mobile .perseus-widget-definition {
-    font-size: 18px;
-    line-height: 1.4;
-  }
-}
-@media (min-width: 768px) and (max-width: 1199px) {
-  .bibliotron-article.framework-perseus.perseus-article.perseus-mobile .perseus-widget-definition {
-    font-size: 20px;
-    line-height: 1.5;
-  }
-}
-@media (min-width: 1200px) {
-  .bibliotron-article.framework-perseus.perseus-article.perseus-mobile .perseus-widget-definition {
-    font-size: 22px;
-    line-height: 1.4;
-  }
-}
 .perseus-widget-dropdown {
   position: relative;
 }
@@ -3566,202 +3526,6 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
 .renderer-widget-error {
   background-color: #fcc;
 }
-#sat-mission .content-area > div {
-  margin-left: auto;
-  margin-right: auto;
-  width: 592px;
-}
-#sat-mission .content-area > div .perseus-input-with-label {
-  display: flex;
-  align-items: center;
-}
-#sat-mission .content-area > div .perseus-input-with-label .perseus-input-label {
-  font-weight: 600;
-  padding-right: 10px;
-}
-#sat-mission .content-area > div .perseus-input-with-answer-blurb > span,
-#sat-mission .content-area > div .perseus-input-with-answer-blurb > label {
-  display: inline-block;
-}
-#sat-mission .content-area > div .perseus-input-with-answer-blurb .perseus-possible-answers {
-  color: #009900;
-  display: inline-block;
-  padding-right: 4px;
-}
-#sat-mission .content-area > div .perseus-input-with-answer-blurb .perseus-possible-answers dt,
-#sat-mission .content-area > div .perseus-input-with-answer-blurb .perseus-possible-answers dd {
-  display: inline-block;
-}
-#sat-mission .content-area > div .perseus-input-with-answer-blurb .perseus-possible-answers dt {
-  padding: 0 5px 0 13px;
-  color: #121212;
-  text-transform: uppercase;
-}
-#sat-mission .content-area > div .perseus-input-with-answer-blurb .perseus-possible-answers dt::after {
-  content: ":";
-}
-#sat-mission .content-area > div .perseus-input-with-answer-blurb .perseus-possible-answers dd:not(:last-child)::after {
-  content: "or";
-  padding: 0 5px;
-  color: #121212;
-}
-#sat-mission .content-area > div input.perseus-incorrect {
-  color: #990000;
-  background-color: #f2ebeb;
-  border: solid 1px #cc5252;
-}
-#sat-mission .content-area > div input.perseus-correct {
-  color: #009900;
-  background-color: #e4f7e4;
-  border: solid 1px #00cc00;
-}
-#sat-mission .content-area > div input.perseus-unanswered {
-  background-color: #eee;
-  border: solid 1px #999;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns {
-  width: 1024px;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns > .paragraph {
-  margin: 0;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-two-columns {
-  display: flex;
-  justify-content: center;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column {
-  display: -webkit-flex;
-  -webkit-flex-direction: column;
-  display: flex;
-  flex-direction: column;
-  width: 512px;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column:nth-child(1) {
-  background: #eee;
-  border-right: 1px solid #ddd;
-  box-sizing: border-box;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column:nth-child(1) .perseus-column-content {
-  padding-top: 48px;
-  padding-bottom: 22px;
-  padding-left: 46px;
-  padding-right: 32px;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column:nth-child(1) .perseus-widget-passage-container {
-  position: relative;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column:nth-child(1) .perseus-widget-passage-container .perseus-widget-passage-instructions div.paragraph {
-  margin-top: 0;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column:nth-child(1) .perseus-widget-passage {
-  margin: 0;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column:nth-child(1) > .paragraph {
-  margin-right: 40px;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column:nth-child(1) blockquote {
-  padding: 0;
-  margin-right: 22px;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column:nth-child(1) blockquote > .paragraph:nth-child(1) {
-  margin-top: 0;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column:nth-child(2) .perseus-column-content {
-  padding-left: 32px;
-  padding-right: 32px;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column:nth-child(2) .perseus-group {
-  margin-bottom: 20px;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column-content {
-  flex: 1 1 auto;
-  overflow-y: auto;
-}
-#sat-mission .content-area > div.perseus-renderer-two-columns .perseus-column-content > .paragraph {
-  margin-top: 0;
-}
-#sat-mission input[type=text],
-#sat-mission input[type=number] {
-  border: 1px solid #aaa;
-  font-family: "Proxima Nova Semibold", sans-serif;
-  font-size: 14px;
-  margin: 10px 0;
-  padding: 5px;
-}
-#sat-mission input[type=text]:focus,
-#sat-mission input[type=number]:focus {
-  border-color: #0084ce;
-  box-shadow: 0 0 10px rgba(0, 132, 206, 0.8);
-  outline: none;
-}
-#sat-mission .valid-answer input[type=text]:valid,
-#sat-mission .valid-answer input[type=number]:valid {
-  border: 1px solid #0084ce;
-  background: #e4f3f9;
-  color: initial;
-}
-#sat-mission .valid-answer input[type=text]:valid:focus,
-#sat-mission .valid-answer input[type=number]:valid:focus {
-  box-shadow: 0 0 10px rgba(0, 132, 206, 0.8);
-}
-#sat-mission .valid-answer .perseus-group-valid-answer input[type=text]:valid,
-#sat-mission .valid-answer .perseus-group-valid-answer input[type=number]:valid {
-  border: 1px solid #0084ce;
-  background: #e4f3f9;
-  color: initial;
-}
-#sat-mission .valid-answer .perseus-group-valid-answer input[type=text]:valid:focus,
-#sat-mission .valid-answer .perseus-group-valid-answer input[type=number]:valid:focus {
-  box-shadow: 0 0 10px rgba(0, 132, 206, 0.8);
-}
-#sat-mission .valid-answer .perseus-group-invalid-answer input[type=text]:valid,
-#sat-mission .valid-answer .perseus-group-invalid-answer input[type=number]:valid {
-  color: #990000;
-  background-color: #f2ebeb;
-  border: solid 1px #cc5252;
-}
-#sat-mission .valid-answer .perseus-group-invalid-answer input[type=text]:valid:focus,
-#sat-mission .valid-answer .perseus-group-invalid-answer input[type=number]:valid:focus {
-  box-shadow: 0 0 10px rgba(204, 82, 82, 0.8);
-}
-#sat-mission .invalid-answer input[type=text]:valid,
-#sat-mission .invalid-answer input[type=number]:valid {
-  color: #990000;
-  background-color: #f2ebeb;
-  border: solid 1px #cc5252;
-}
-#sat-mission .invalid-answer input[type=text]:valid:focus,
-#sat-mission .invalid-answer input[type=number]:valid:focus {
-  box-shadow: 0 0 10px rgba(204, 82, 82, 0.8);
-}
-#sat-mission .invalid-answer .perseus-group-valid-answer input[type=text]:valid,
-#sat-mission .invalid-answer .perseus-group-valid-answer input[type=number]:valid {
-  border: 1px solid #0084ce;
-  background: #e4f3f9;
-  color: initial;
-}
-#sat-mission .invalid-answer .perseus-group-valid-answer input[type=text]:valid:focus,
-#sat-mission .invalid-answer .perseus-group-valid-answer input[type=number]:valid:focus {
-  box-shadow: 0 0 10px rgba(0, 132, 206, 0.8);
-}
-#sat-mission .invalid-answer .perseus-group-invalid-answer input[type=text]:valid,
-#sat-mission .invalid-answer .perseus-group-invalid-answer input[type=number]:valid {
-  color: #990000;
-  background-color: #f2ebeb;
-  border: solid 1px #cc5252;
-}
-#sat-mission .invalid-answer .perseus-group-invalid-answer input[type=text]:valid:focus,
-#sat-mission .invalid-answer .perseus-group-invalid-answer input[type=number]:valid:focus {
-  box-shadow: 0 0 10px rgba(204, 82, 82, 0.8);
-}
-#sat-mission #sat-route-task .content-area > .perseus-renderer-two-columns,
-#sat-mission #sat-route-section .content-area > .perseus-renderer-two-columns {
-  margin-top: 0;
-}
-#sat-mission #sat-route-task .content-area > .perseus-renderer-two-columns .perseus-column:nth-child(2) > .perseus-column-content > :first-child,
-#sat-mission #sat-route-section .content-area > .perseus-renderer-two-columns .perseus-column:nth-child(2) > .perseus-column-content > :first-child {
-  margin-top: 48px;
-}
 .perseus-error {
   background: #cf5044;
   border: 2px solid red;