@khanacademy/perseus 19.0.0 → 19.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/CHANGELOG.md +30 -0
  2. package/dist/es/index.css +209 -104
  3. package/dist/es/index.js +806 -877
  4. package/dist/es/index.js.map +1 -1
  5. package/dist/index.css +209 -104
  6. package/dist/index.d.ts +3 -2
  7. package/dist/index.js +849 -920
  8. package/dist/index.js.map +1 -1
  9. package/dist/mixins/changeable.d.ts +1 -1
  10. package/dist/perseus-api.d.ts +1 -0
  11. package/dist/renderer.d.ts +2 -4
  12. package/dist/server-item-renderer.d.ts +1 -0
  13. package/dist/types.d.ts +4 -0
  14. package/dist/util/geometry.d.ts +2 -0
  15. package/dist/util/graphie.d.ts +107 -1
  16. package/dist/util/math.d.ts +2 -0
  17. package/dist/util/parse-perseus-json.d.ts +3 -3
  18. package/dist/widgets/expression.d.ts +6 -0
  19. package/dist/widgets/label-image.d.ts +2 -0
  20. package/package.json +3 -4
  21. package/src/__testdata__/renderer.testdata.ts +152 -0
  22. package/src/__tests__/renderer.test.tsx +17 -0
  23. package/src/components/math-input.tsx +4 -6
  24. package/src/index.ts +8 -3
  25. package/src/mixins/changeable.ts +1 -1
  26. package/src/renderer.tsx +14 -8
  27. package/src/types.ts +9 -0
  28. package/src/util/geometry.test.ts +75 -0
  29. package/src/util/geometry.ts +19 -0
  30. package/src/util/graphie.test.ts +1291 -0
  31. package/src/util/graphie.ts +832 -784
  32. package/src/util/interactive.ts +23 -51
  33. package/src/util/math.test.ts +11 -0
  34. package/src/util/math.ts +8 -0
  35. package/src/util/parse-perseus-json.test.ts +3 -3
  36. package/src/util/parse-perseus-json.ts +4 -4
  37. package/src/widgets/__tests__/__snapshots__/input-number.test.ts.snap +4 -2
  38. package/src/widgets/__tests__/__snapshots__/numeric-input.test.ts.snap +4 -2
  39. package/src/widgets/__tests__/expression-mobile.test.tsx +8 -5
  40. package/src/widgets/expression.tsx +1 -23
  41. package/src/widgets/label-image.tsx +0 -1
  42. package/tsconfig-build.tsbuildinfo +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,35 @@
1
1
  # @khanacademy/perseus
2
2
 
3
+ ## 19.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#895](https://github.com/Khan/perseus/pull/895) [`15b4bc02`](https://github.com/Khan/perseus/commit/15b4bc02d65fd1900e01ce7dd35863c1be579d73) Thanks [@jeremywiebe](https://github.com/jeremywiebe)! - Export utility Range and Size types from package
8
+
9
+ * [#942](https://github.com/Khan/perseus/pull/942) [`319e330e`](https://github.com/Khan/perseus/commit/319e330ed77d2145266a9b231693ac65320032a2) Thanks [@SonicScrewdriver](https://github.com/SonicScrewdriver)! - Creation of a new callback that can return the WidgetsStartProps
10
+
11
+ - [#937](https://github.com/Khan/perseus/pull/937) [`ef898f77`](https://github.com/Khan/perseus/commit/ef898f77f45f3494f5012d2db52a3461aad93c69) Thanks [@nishasy](https://github.com/nishasy)! - bumped mathquill version + minor type updates
12
+
13
+ ### Patch Changes
14
+
15
+ - [#935](https://github.com/Khan/perseus/pull/935) [`0b737502`](https://github.com/Khan/perseus/commit/0b7375023826ef5ee46eb5ae00136b2356e10be4) Thanks [@benchristel](https://github.com/benchristel)! - Internal: Refactor graphie.ts
16
+
17
+ * [#945](https://github.com/Khan/perseus/pull/945) [`3bfd44e3`](https://github.com/Khan/perseus/commit/3bfd44e37643cdd13392fbaabb9fb4370378d2b3) Thanks [@benchristel](https://github.com/benchristel)! - Internal: Refactor graphie.ts
18
+
19
+ - [#949](https://github.com/Khan/perseus/pull/949) [`59ce1e09`](https://github.com/Khan/perseus/commit/59ce1e0990cecd1123d7b9a671b032fcd03ce1b1) Thanks [@benchristel](https://github.com/benchristel)! - Internal: use built-in JS functions instead of underscore
20
+
21
+ * [#946](https://github.com/Khan/perseus/pull/946) [`f16e4184`](https://github.com/Khan/perseus/commit/f16e4184a24dcdaafc0cb4ebde5651f5bb135df9) Thanks [@benchristel](https://github.com/benchristel)! - Internal: improve type coverage in graphie.ts and interactive.ts
22
+
23
+ - [#951](https://github.com/Khan/perseus/pull/951) [`247f8b1b`](https://github.com/Khan/perseus/commit/247f8b1be0647c39a5cabd9ce72a216d750a707b) Thanks [@handeyeco](https://github.com/handeyeco)! - Rename helper that's not in-use yet.
24
+
25
+ * [#943](https://github.com/Khan/perseus/pull/943) [`62e04cfa`](https://github.com/Khan/perseus/commit/62e04cfa3139c6417442cbb96f8012d098a7c279) Thanks [@benchristel](https://github.com/benchristel)! - Internal: Add tests for Graphie drawing tools
26
+
27
+ - [#944](https://github.com/Khan/perseus/pull/944) [`583becef`](https://github.com/Khan/perseus/commit/583becefbf690e96df709bcb7f8150cf686deadf) Thanks [@benchristel](https://github.com/benchristel)! - Internal: Remove unused code from Graphie drawing tools
28
+
29
+ - Updated dependencies [[`ef898f77`](https://github.com/Khan/perseus/commit/ef898f77f45f3494f5012d2db52a3461aad93c69), [`59ce1e09`](https://github.com/Khan/perseus/commit/59ce1e0990cecd1123d7b9a671b032fcd03ce1b1)]:
30
+ - @khanacademy/math-input@17.0.0
31
+ - @khanacademy/kmath@0.1.9
32
+
3
33
  ## 19.0.0
4
34
 
5
35
  ### Major Changes
package/dist/es/index.css CHANGED
@@ -3622,26 +3622,46 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3622
3622
  color: white !important;
3623
3623
  display: inline-block !important;
3624
3624
  }
3625
- /*
3626
- * MathQuill v0.10.1 http://mathquill.com
3627
- * by Han, Jeanine, and Mary maintainers@mathquill.com
3625
+ /**
3626
+ * @license
3627
+ * MathQuill v0.10.1, by Han, Jeanine, and Mary
3628
+ * http://mathquill.com | maintainers@mathquill.com
3628
3629
  *
3629
3630
  * This Source Code Form is subject to the terms of the
3630
3631
  * Mozilla Public License, v. 2.0. If a copy of the MPL
3631
3632
  * was not distributed with this file, You can obtain
3632
3633
  * one at http://mozilla.org/MPL/2.0/.
3633
3634
  */
3635
+
3636
+ .mq-aria-alert {
3637
+ position: absolute;
3638
+ left: -1000px;
3639
+ top: -1000px;
3640
+ width: 0px;
3641
+ height: 0px;
3642
+ text-align: left;
3643
+ overflow: hidden;
3644
+ }
3645
+ .mq-mathspeak {
3646
+ position: absolute;
3647
+ left: -1000px;
3648
+ top: -1000px;
3649
+ width: 0px;
3650
+ height: 0px;
3651
+ text-align: left;
3652
+ overflow: hidden;
3653
+ }
3634
3654
  @font-face {
3635
3655
  font-family: Symbola;
3636
3656
  src: url(/fonts/Symbola.eot);
3637
- src: local("Symbola Regular"), local("Symbola"), url(/fonts/Symbola.woff2) format("woff2"), url(/fonts/Symbola.woff) format("woff"), url(/fonts/Symbola.ttf) format("truetype"), url(/fonts/Symbola.otf) format("opentype"), url(/fonts/Symbola.svg#Symbola) format("svg");
3657
+ src: local('Symbola Regular'), local('Symbola'), url(/fonts/Symbola.woff2) format('woff2'), url(/fonts/Symbola.woff) format('woff'), url(/fonts/Symbola.ttf) format('truetype'), url(/fonts/Symbola.otf) format('opentype'), url(/fonts/Symbola.svg#Symbola) format('svg');
3638
3658
  }
3639
3659
  .mq-editable-field {
3640
3660
  display: -moz-inline-box;
3641
3661
  display: inline-block;
3642
3662
  }
3643
3663
  .mq-editable-field .mq-cursor {
3644
- border-left: 1px solid black;
3664
+ border-left: 1px solid currentColor;
3645
3665
  margin-left: -1px;
3646
3666
  position: relative;
3647
3667
  z-index: 1;
@@ -3661,15 +3681,14 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3661
3681
  -webkit-box-shadow: #8bd 0 0 1px 2px, inset #6ae 0 0 2px 0;
3662
3682
  -moz-box-shadow: #8bd 0 0 1px 2px, inset #6ae 0 0 2px 0;
3663
3683
  box-shadow: #8bd 0 0 1px 2px, inset #6ae 0 0 2px 0;
3664
- border-color: #709AC0;
3665
- border-radius: 1px;
3684
+ border-color: #709ac0;
3666
3685
  }
3667
3686
  .mq-math-mode .mq-editable-field {
3668
3687
  margin: 1px;
3669
3688
  }
3670
3689
  .mq-editable-field .mq-latex-command-input {
3671
3690
  color: inherit;
3672
- font-family: "Courier New", monospace;
3691
+ font-family: 'Courier New', monospace;
3673
3692
  border: 1px solid gray;
3674
3693
  padding-right: 1px;
3675
3694
  margin-right: 1px;
@@ -3712,6 +3731,46 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3712
3731
  overflow: hidden;
3713
3732
  vertical-align: middle;
3714
3733
  }
3734
+ .mq-root-block .mq-digit,
3735
+ .mq-math-mode .mq-root-block .mq-digit {
3736
+ margin-left: 0.009em;
3737
+ margin-right: 0.009em;
3738
+ }
3739
+ .mq-root-block .mq-group-start,
3740
+ .mq-math-mode .mq-root-block .mq-group-start {
3741
+ margin-left: 0.11em;
3742
+ margin-right: -0.01em;
3743
+ }
3744
+ .mq-root-block .mq-group-other,
3745
+ .mq-math-mode .mq-root-block .mq-group-other {
3746
+ margin-left: -0.01em;
3747
+ margin-right: -0.01em;
3748
+ }
3749
+ .mq-root-block .mq-group-leading-1,
3750
+ .mq-math-mode .mq-root-block .mq-group-leading-1,
3751
+ .mq-root-block .mq-group-leading-2,
3752
+ .mq-math-mode .mq-root-block .mq-group-leading-2 {
3753
+ margin-left: 0;
3754
+ margin-right: -0.01em;
3755
+ }
3756
+ .mq-root-block .mq-group-leading-3,
3757
+ .mq-math-mode .mq-root-block .mq-group-leading-3 {
3758
+ margin-left: 0.036em;
3759
+ margin-right: -0.01em;
3760
+ }
3761
+ .mq-root-block.mq-suppress-grouping .mq-group-start,
3762
+ .mq-math-mode .mq-root-block.mq-suppress-grouping .mq-group-start,
3763
+ .mq-root-block.mq-suppress-grouping .mq-group-other,
3764
+ .mq-math-mode .mq-root-block.mq-suppress-grouping .mq-group-other,
3765
+ .mq-root-block.mq-suppress-grouping .mq-group-leading-1,
3766
+ .mq-math-mode .mq-root-block.mq-suppress-grouping .mq-group-leading-1,
3767
+ .mq-root-block.mq-suppress-grouping .mq-group-leading-2,
3768
+ .mq-math-mode .mq-root-block.mq-suppress-grouping .mq-group-leading-2,
3769
+ .mq-root-block.mq-suppress-grouping .mq-group-leading-3,
3770
+ .mq-math-mode .mq-root-block.mq-suppress-grouping .mq-group-leading-3 {
3771
+ margin-left: 0.009em;
3772
+ margin-right: 0.009em;
3773
+ }
3715
3774
  .mq-math-mode {
3716
3775
  font-variant: normal;
3717
3776
  font-weight: normal;
@@ -3729,8 +3788,16 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3729
3788
  .mq-math-mode var,
3730
3789
  .mq-math-mode .mq-text-mode,
3731
3790
  .mq-math-mode .mq-nonSymbola {
3732
- font-family: "Times New Roman", Symbola, serif;
3733
- line-height: .9;
3791
+ font-family: 'Times New Roman', Symbola, serif;
3792
+ line-height: 0.9;
3793
+ }
3794
+ .mq-math-mode svg {
3795
+ fill: currentColor;
3796
+ position: absolute;
3797
+ top: 0;
3798
+ left: 0;
3799
+ width: 100%;
3800
+ height: 100%;
3734
3801
  }
3735
3802
  .mq-math-mode * {
3736
3803
  font-size: inherit;
@@ -3744,25 +3811,29 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3744
3811
  box-sizing: border-box;
3745
3812
  }
3746
3813
  .mq-math-mode .mq-empty {
3747
- background: #ccc;
3814
+ background: rgba(0, 0, 0, 0.2);
3748
3815
  }
3749
3816
  .mq-math-mode .mq-empty.mq-root-block {
3750
3817
  background: transparent;
3751
3818
  }
3819
+ .mq-math-mode .mq-empty.mq-quiet-delimiter {
3820
+ background: transparent;
3821
+ }
3752
3822
  .mq-math-mode.mq-empty {
3753
3823
  background: transparent;
3754
3824
  }
3755
3825
  .mq-math-mode .mq-text-mode {
3756
3826
  display: inline-block;
3827
+ white-space: pre;
3757
3828
  }
3758
3829
  .mq-math-mode .mq-text-mode.mq-hasCursor {
3759
- box-shadow: inset darkgray 0 .1em .2em;
3760
- padding: 0 .1em;
3830
+ box-shadow: inset darkgray 0 0.1em 0.2em;
3831
+ padding: 0 0.1em;
3761
3832
  margin: 0 -0.1em;
3762
3833
  min-width: 1ex;
3763
3834
  }
3764
3835
  .mq-math-mode .mq-font {
3765
- font: 1em "Times New Roman", Symbola, serif;
3836
+ font: 1em 'Times New Roman', Symbola, serif;
3766
3837
  }
3767
3838
  .mq-math-mode .mq-font * {
3768
3839
  font-family: inherit;
@@ -3787,6 +3858,26 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3787
3858
  .mq-math-mode big {
3788
3859
  font-size: 200%;
3789
3860
  }
3861
+ .mq-math-mode .mq-int > big {
3862
+ display: inline-block;
3863
+ -webkit-transform: scaleX(0.7);
3864
+ -moz-transform: scaleX(0.7);
3865
+ -ms-transform: scaleX(0.7);
3866
+ -o-transform: scaleX(0.7);
3867
+ transform: scaleX(0.7);
3868
+ vertical-align: -0.16em;
3869
+ }
3870
+ .mq-math-mode .mq-int > .mq-supsub {
3871
+ font-size: 80%;
3872
+ vertical-align: -1.1em;
3873
+ padding-right: 0.2em;
3874
+ }
3875
+ .mq-math-mode .mq-int > .mq-supsub > .mq-sup > .mq-sup-inner {
3876
+ vertical-align: 1.3em;
3877
+ }
3878
+ .mq-math-mode .mq-int > .mq-supsub > .mq-sub {
3879
+ margin-left: -0.35em;
3880
+ }
3790
3881
  .mq-math-mode .mq-roman {
3791
3882
  font-style: normal;
3792
3883
  }
@@ -3797,11 +3888,11 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3797
3888
  font-family: monospace, Symbola, serif;
3798
3889
  }
3799
3890
  .mq-math-mode .mq-overline {
3800
- border-top: 1px solid black;
3891
+ border-top: 1px solid;
3801
3892
  margin-top: 1px;
3802
3893
  }
3803
3894
  .mq-math-mode .mq-underline {
3804
- border-bottom: 1px solid black;
3895
+ border-bottom: 1px solid;
3805
3896
  margin-bottom: 1px;
3806
3897
  }
3807
3898
  .mq-math-mode .mq-binary-operator {
@@ -3814,14 +3905,10 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3814
3905
  font-size: 90%;
3815
3906
  vertical-align: -0.5em;
3816
3907
  }
3817
- .mq-math-mode .mq-supsub.mq-limit {
3818
- font-size: 80%;
3819
- vertical-align: -0.4em;
3820
- }
3821
3908
  .mq-math-mode .mq-supsub.mq-sup-only {
3822
- vertical-align: .5em;
3909
+ vertical-align: 0.5em;
3823
3910
  }
3824
- .mq-math-mode .mq-supsub.mq-sup-only .mq-sup {
3911
+ .mq-math-mode .mq-supsub.mq-sup-only > .mq-sup {
3825
3912
  display: inline-block;
3826
3913
  vertical-align: text-bottom;
3827
3914
  }
@@ -3832,11 +3919,8 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3832
3919
  display: block;
3833
3920
  float: left;
3834
3921
  }
3835
- .mq-math-mode .mq-supsub.mq-limit .mq-sub {
3836
- margin-left: -0.25em;
3837
- }
3838
3922
  .mq-math-mode .mq-supsub .mq-binary-operator {
3839
- padding: 0 .1em;
3923
+ padding: 0 0.1em;
3840
3924
  }
3841
3925
  .mq-math-mode .mq-supsub .mq-fraction {
3842
3926
  font-size: 70%;
@@ -3845,24 +3929,30 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3845
3929
  font-size: 80%;
3846
3930
  vertical-align: 0.8em;
3847
3931
  margin-right: -0.6em;
3848
- margin-left: .2em;
3849
- min-width: .5em;
3932
+ margin-left: 0.2em;
3933
+ min-width: 0.5em;
3850
3934
  }
3851
- .mq-math-mode .mq-paren {
3852
- padding: 0 .1em;
3853
- vertical-align: top;
3854
- -webkit-transform-origin: center .06em;
3855
- -moz-transform-origin: center .06em;
3856
- -ms-transform-origin: center .06em;
3857
- -o-transform-origin: center .06em;
3858
- transform-origin: center .06em;
3935
+ .mq-math-mode .mq-ghost svg {
3936
+ opacity: 0.2;
3937
+ }
3938
+ .mq-math-mode .mq-bracket-middle {
3939
+ margin-top: 0.1em;
3940
+ margin-bottom: 0.1em;
3941
+ }
3942
+ .mq-math-mode .mq-bracket-l,
3943
+ .mq-math-mode .mq-bracket-r {
3944
+ position: absolute;
3945
+ top: 0;
3946
+ bottom: 2px;
3947
+ }
3948
+ .mq-math-mode .mq-bracket-l {
3949
+ left: 0;
3859
3950
  }
3860
- .mq-math-mode .mq-paren.mq-ghost {
3861
- color: silver;
3951
+ .mq-math-mode .mq-bracket-r {
3952
+ right: 0;
3862
3953
  }
3863
- .mq-math-mode .mq-paren + span {
3864
- margin-top: .1em;
3865
- margin-bottom: .1em;
3954
+ .mq-math-mode .mq-bracket-container {
3955
+ position: relative;
3866
3956
  }
3867
3957
  .mq-math-mode .mq-array {
3868
3958
  vertical-align: middle;
@@ -3872,22 +3962,22 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3872
3962
  display: block;
3873
3963
  }
3874
3964
  .mq-math-mode .mq-operator-name {
3875
- font-family: Symbola, "Times New Roman", serif;
3876
- line-height: .9;
3965
+ font-family: Symbola, 'Times New Roman', serif;
3966
+ line-height: 0.9;
3877
3967
  font-style: normal;
3878
3968
  }
3879
3969
  .mq-math-mode var.mq-operator-name.mq-first {
3880
- padding-left: .2em;
3970
+ padding-left: 0.2em;
3881
3971
  }
3882
3972
  .mq-math-mode var.mq-operator-name.mq-last,
3883
3973
  .mq-math-mode .mq-supsub.mq-after-operator-name {
3884
- padding-right: .2em;
3974
+ padding-right: 0.2em;
3885
3975
  }
3886
3976
  .mq-math-mode .mq-fraction {
3887
3977
  font-size: 90%;
3888
3978
  text-align: center;
3889
3979
  vertical-align: -0.4em;
3890
- padding: 0 .2em;
3980
+ padding: 0 0.2em;
3891
3981
  }
3892
3982
  .mq-math-mode .mq-fraction,
3893
3983
  .mq-math-mode .mq-large-operator,
@@ -3901,7 +3991,8 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3901
3991
  display: inline-block;
3902
3992
  }
3903
3993
  .mq-math-mode .mq-numerator,
3904
- .mq-math-mode .mq-denominator {
3994
+ .mq-math-mode .mq-denominator,
3995
+ .mq-math-mode .mq-dot-recurring {
3905
3996
  display: block;
3906
3997
  }
3907
3998
  .mq-math-mode .mq-numerator {
@@ -3913,38 +4004,53 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3913
4004
  width: 100%;
3914
4005
  padding: 0.1em;
3915
4006
  }
4007
+ .mq-math-mode .mq-dot-recurring {
4008
+ text-align: center;
4009
+ height: 0.3em;
4010
+ }
3916
4011
  .mq-math-mode .mq-sqrt-prefix {
3917
- padding-top: 0;
4012
+ position: absolute;
4013
+ top: 1px;
4014
+ bottom: 0.15em;
4015
+ width: 0.95em;
4016
+ }
4017
+ .mq-math-mode .mq-sqrt-container {
3918
4018
  position: relative;
3919
- top: 0.1em;
3920
- vertical-align: top;
3921
- -webkit-transform-origin: top;
3922
- -moz-transform-origin: top;
3923
- -ms-transform-origin: top;
3924
- -o-transform-origin: top;
3925
- transform-origin: top;
3926
4019
  }
3927
4020
  .mq-math-mode .mq-sqrt-stem {
3928
4021
  border-top: 1px solid;
3929
4022
  margin-top: 1px;
3930
- padding-left: .15em;
3931
- padding-right: .2em;
3932
- margin-right: .1em;
4023
+ margin-left: 0.9em;
4024
+ padding-left: 0.15em;
4025
+ padding-right: 0.2em;
4026
+ margin-right: 0.1em;
3933
4027
  padding-top: 1px;
3934
4028
  }
3935
- .mq-math-mode .mq-vector-prefix {
4029
+ .mq-math-mode .mq-diacritic-above {
3936
4030
  display: block;
3937
4031
  text-align: center;
3938
- line-height: .25em;
3939
- margin-bottom: -0.1em;
3940
- font-size: 0.75em;
4032
+ line-height: 0.4em;
3941
4033
  }
3942
- .mq-math-mode .mq-vector-stem {
4034
+ .mq-math-mode .mq-diacritic-stem {
4035
+ display: block;
4036
+ text-align: center;
4037
+ }
4038
+ .mq-math-mode .mq-hat-prefix {
4039
+ display: block;
4040
+ text-align: center;
4041
+ line-height: 0.95em;
4042
+ margin-bottom: -0.7em;
4043
+ transform: scaleX(1.5);
4044
+ -moz-transform: scaleX(1.5);
4045
+ -o-transform: scaleX(1.5);
4046
+ -webkit-transform: scaleX(1.5);
4047
+ }
4048
+ .mq-math-mode .mq-hat-stem {
3943
4049
  display: block;
3944
4050
  }
3945
4051
  .mq-math-mode .mq-large-operator {
3946
4052
  vertical-align: -0.2em;
3947
- padding: .2em;
4053
+ padding: 0.2em;
3948
4054
  text-align: center;
3949
4055
  }
3950
4056
  .mq-math-mode .mq-large-operator .mq-from,
@@ -3964,29 +4070,51 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3964
4070
  .mq-math-mode,
3965
4071
  .mq-math-mode .mq-editable-field {
3966
4072
  cursor: text;
3967
- font-family: Symbola, "Times New Roman", serif;
4073
+ font-family: Symbola, 'Times New Roman', serif;
4074
+ }
4075
+ .mq-math-mode .mq-overarc {
4076
+ border-top: 1px solid black;
4077
+ -webkit-border-top-right-radius: 50% 0.3em;
4078
+ -moz-border-radius-topright: 50% 0.3em;
4079
+ border-top-right-radius: 50% 0.3em;
4080
+ -webkit-border-top-left-radius: 50% 0.3em;
4081
+ -moz-border-radius-topleft: 50% 0.3em;
4082
+ border-top-left-radius: 50% 0.3em;
4083
+ margin-top: 1px;
4084
+ padding-top: 0.15em;
3968
4085
  }
3969
4086
  .mq-math-mode .mq-overarrow {
4087
+ min-width: 0.5em;
3970
4088
  border-top: 1px solid black;
3971
4089
  margin-top: 1px;
3972
4090
  padding-top: 0.2em;
3973
- }
3974
- .mq-math-mode .mq-overarrow:before {
3975
- display: block;
4091
+ text-align: center;
3976
4092
  position: relative;
3977
- top: -0.34em;
4093
+ }
4094
+ .mq-math-mode .mq-overarrow:after {
4095
+ position: absolute;
4096
+ right: -0.1em;
4097
+ top: -0.48em;
3978
4098
  font-size: 0.5em;
3979
- line-height: 0em;
3980
4099
  content: '\27A4';
3981
- text-align: right;
3982
4100
  }
3983
- .mq-math-mode .mq-overarrow.mq-arrow-left:before {
4101
+ .mq-math-mode .mq-overarrow.mq-arrow-left:after {
4102
+ content: '';
4103
+ display: none;
4104
+ }
4105
+ .mq-math-mode .mq-overarrow.mq-arrow-left:before,
4106
+ .mq-math-mode .mq-overarrow.mq-arrow-leftright:before {
4107
+ position: absolute;
4108
+ top: -0.48em;
4109
+ left: -0.1em;
4110
+ font-size: 0.5em;
4111
+ content: '\27A4';
3984
4112
  -moz-transform: scaleX(-1);
3985
4113
  -o-transform: scaleX(-1);
3986
4114
  -webkit-transform: scaleX(-1);
3987
4115
  transform: scaleX(-1);
3988
4116
  filter: FlipH;
3989
- -ms-filter: "FlipH";
4117
+ -ms-filter: 'FlipH';
3990
4118
  }
3991
4119
  .mq-math-mode .mq-selection,
3992
4120
  .mq-editable-field .mq-selection,
@@ -3994,34 +4122,21 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
3994
4122
  .mq-editable-field .mq-selection .mq-non-leaf,
3995
4123
  .mq-math-mode .mq-selection .mq-scaled,
3996
4124
  .mq-editable-field .mq-selection .mq-scaled {
3997
- background: #B4D5FE !important;
3998
- background: Highlight !important;
3999
- color: HighlightText;
4000
- border-color: HighlightText;
4001
- }
4002
- .mq-math-mode .mq-selection .mq-matrixed,
4003
- .mq-editable-field .mq-selection .mq-matrixed {
4004
- background: #39F !important;
4005
- }
4006
- .mq-math-mode .mq-selection .mq-matrixed-container,
4007
- .mq-editable-field .mq-selection .mq-matrixed-container {
4008
- filter: progid:DXImageTransform.Microsoft.Chroma(color='#3399FF') !important;
4125
+ background: #b4d5fe !important;
4009
4126
  }
4010
4127
  .mq-math-mode .mq-selection.mq-blur,
4011
4128
  .mq-editable-field .mq-selection.mq-blur,
4012
4129
  .mq-math-mode .mq-selection.mq-blur .mq-non-leaf,
4013
4130
  .mq-editable-field .mq-selection.mq-blur .mq-non-leaf,
4014
4131
  .mq-math-mode .mq-selection.mq-blur .mq-scaled,
4015
- .mq-editable-field .mq-selection.mq-blur .mq-scaled,
4016
- .mq-math-mode .mq-selection.mq-blur .mq-matrixed,
4017
- .mq-editable-field .mq-selection.mq-blur .mq-matrixed {
4018
- background: #D4D4D4 !important;
4132
+ .mq-editable-field .mq-selection.mq-blur .mq-scaled {
4133
+ background: #d4d4d4 !important;
4019
4134
  color: black;
4020
4135
  border-color: black;
4021
4136
  }
4022
- .mq-math-mode .mq-selection.mq-blur .mq-matrixed-container,
4023
- .mq-editable-field .mq-selection.mq-blur .mq-matrixed-container {
4024
- filter: progid:DXImageTransform.Microsoft.Chroma(color='#D4D4D4') !important;
4137
+ html body .mq-math-mode .mq-selection .mq-nthroot-container *,
4138
+ html body .mq-editable-field .mq-selection .mq-nthroot-container * {
4139
+ background: transparent !important;
4025
4140
  }
4026
4141
  .mq-editable-field .mq-textarea,
4027
4142
  .mq-math-mode .mq-textarea {
@@ -4031,9 +4146,7 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
4031
4146
  user-select: text;
4032
4147
  }
4033
4148
  .mq-editable-field .mq-textarea *,
4034
- .mq-math-mode .mq-textarea *,
4035
- .mq-editable-field .mq-selectable,
4036
- .mq-math-mode .mq-selectable {
4149
+ .mq-math-mode .mq-textarea * {
4037
4150
  -webkit-user-select: text;
4038
4151
  -moz-user-select: text;
4039
4152
  user-select: text;
@@ -4047,14 +4160,6 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
4047
4160
  resize: none;
4048
4161
  width: 1px;
4049
4162
  height: 1px;
4050
- }
4051
- .mq-math-mode .mq-matrixed {
4052
- background: white;
4053
- display: -moz-inline-box;
4054
- display: inline-block;
4055
- }
4056
- .mq-math-mode .mq-matrixed-container {
4057
- filter: progid:DXImageTransform.Microsoft.Chroma(color='white');
4058
- margin-top: -0.1em;
4163
+ box-sizing: content-box;
4059
4164
  }
4060
4165