libreoffice-online/browser/admin/adminLog.html

<main>
  <div class="container">
    <script>Admin.Log(host);</script>

    <h3 class="title is-3"><script>document.write(l10nstrings.strLog)</script></h3>

    <div class="buttons is-fullwidth is-right">
      <button type="button" class="button is-info" id="refresh-log" style="min-width:120px;"><script>document.write(l10nstrings.strRefreshLog)</script></button>
      <button type="button" id="button-open-log-list-modal" class="button is-info" style="min-width:120px;">
        <script>document.write(l10nstrings.strSetLogLevels)</script>
      </button>
    </div>

    <div class="level is-fullwidth is-mobile">
      <div class="field is-horizontal">
        <label class="field-label" style="vertical-align: middle; line-height:30px;"><script>document.write(l10nstrings.strChannelFilter)</script></label>
        <div class="control">
          <select class="select" id="log-channel-filter">
            <option><script>document.write(l10nstrings.strChannelFilterNone)</script></option>
          </select>
        </div>
      </div>
    </div>
    <textarea id="log-lines" style="width:100%;height:100%;min-height: calc(100vh - 250px);resize:vertical;" readonly="true"></textarea>
  </div>
</main>

<div class="modal" id="channel-list-modal">
  <div class="modal-background" onclick="document.getElementById('channel-list-modal').classList.remove('is-active');"></div>
  <div class="modal-card">
    <header class="modal-card-head">
      <p class="modal-card-title"><script>document.write(l10nstrings.strLogLevels)</script></p>
      <button class="delete" onclick="document.getElementById('channel-list-modal').classList.remove('is-active');"></button>
    </header>
    <section class="modal-card-body">
      <form class="form-horizontal" id="form-channel-list"></form>
    </section>
    <footer class="modal-card-foot is-fullwidth has-text-right">
        <button type="button" onclick="document.getElementById('channel-list-modal').classList.remove('is-active');" class="button" style="min-width:120px;" data-dismiss="modal"><script>document.write(l10nstrings.strCloseModal)</script></button>
        <button type="button" form="form-channel-list" id="update-log-levels" class="button is-primary" style="min-width:140px;"><script>document.write(l10nstrings.strUpdateLogLevels)</script></button>
    </footer>
  </div>
</div>

<script>
  document.getElementById('a-log-mobile').classList.add('is-active');
  document.getElementById('a-log-tablet').classList.add('is-active');
  document.getElementById('button-open-log-list-modal').onclick = function() {
    document.getElementById('channel-list-modal').classList.add('is-active');
  };
</script>