class LeftFragment(e: Expr) {
  val leftFrag = html(
    li(
      span(
        `class` := "junct",
        "" +   e.toString
      )
    )
  )
  leftFrag
}


class RightFragment(e: Expr) {
  val rightFrag = html(
    li(
      span(
        `class` := "junct",
        "" +   e.toString
      )
    )
  )
  rightFrag
}


class SequentFragment(e: Expr) {
  val leftFragment = new LeftFragment(e).toString
  val rightFragment = new RightFragment(e).toString
  val sequent = html(
    div(
      id := Gensym.gensym(),
      ul(
        `class` := "commaList",
        leftFragment
      ),
      span(
        `class` := "turnstile",
        "|||"
      ),
      ul(
        `class` := "commaList",
        rightFragment
      )
    )
  )
  sequent
}

class LeafFragment(e: Expr) {
  val sequentFragment = new SequentFragment(e).toString
  val leaf = html(
    table(
      tbody(
        tr(
          td(
            `class` := "inference",
            sequentFragment
          ),
          td(
            `class` := "tagBox",
            div(
              `class` := "tag",
              span(
                `class` := "explained", id := "blah",
                "(->l)"
              )
            )
          )
        )
      )
    )
  )
  leaf
}

class SiblingFragment(e: Expr) {
  val leafFragment = new LeafFragment(e).toString
  val sibling = html(
    div(
      `class` := "sibling",
      span(

      ),
      leafFragment
    )
  )
  leafFragment
}