search

tmke8 / latex2mmlc

https://tmke8.github.io/latex2mmlc/
MIT License
0 stars 0 forks source link

Use `<menclose>` for rendering `\cancel{...}` and fix it with global CSS for Chrome #266

Open tmke8 opened 1 month ago

tmke8 commented 1 month ago

I think I'm less averse to global CSS for fixing browser problems.

tmke8 commented 2 days ago

This doesn't actually work, however, because in order to add the updiagonal strike, there needs to be an additional object there to transform.

By this I mean that I'd need to have something like <menclose>[content]<span id="dummy"></span></menclose>.

tmke8 commented 1 day ago 
<!doctype html>
<title>cancel with CSS</title>
<style>
  mrow.menclose {
    position: relative;
    padding: 0.5ex 0ex;
  }

  .upstrike {
    display: inline-block;
    position: absolute;
    left: 0.5px;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: currentColor;
    clip-path: polygon(0.05em 100%, 0em calc(100% - 0.05em), calc(100% - 0.05em) 0em, 100% 0.05em);
  }
</style>

<body>
  <math>
    <mrow class="menclose">
      <mrow>
        <mi>a</mi>
        <mi>b</mi>
        <mi>c</mi>
      </mrow>
      <mrow class="upstrike"></mrow>
    </mrow>
  </math>