livecodingspace-app/public/web/app.html

<div id="appGUI" class="mdc-layout-grid">
  <div class="mdc-layout-grid__inner">
      <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-12">
          <h1 class="mdc-typography--headline4">Connection Settings</h1>
        </div>
    <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-3">
      <div id="reflectorMenu" class="text-field-container">
        <div id="reflectorSelect" class="mdc-text-field mdc-text-field--outlined mdc-text-field--dense">
          <input id="currentReflector" type="text" class="mdc-text-field__input mdc-typography--headline6" style="width:300px;">
          <label for="currentReflector" class="mdc-floating-label">Reflector</label>
          <div class="mdc-notched-outline">
            <svg>
              <path class="mdc-notched-outline__path"/>
            </svg>
          </div>
          <div class="mdc-notched-outline__idle"></div>
        </div>
      </div>
    </div>
    <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-4">
      <div id="dbMenu" class="text-field-container">
        <div id="dbSelect" class="mdc-text-field mdc-text-field--outlined mdc-text-field--dense">
          <input id="currentdb" type="text" class="mdc-text-field__input mdc-typography--headline6" style="width:300px;">
          <label for="currentdb" class="mdc-floating-label mdc-floating-label--float-above">DB Host</label>
          <div class="mdc-notched-outline">
            <svg>
              <path class="mdc-notched-outline__path"/>
            </svg>
          </div>
          <div class="mdc-notched-outline__idle"></div>
        </div>
      </div>
    </div>
  </div>
</div>
<hr class="mdc-list-divider mdc-theme--text-hint-on-background divider" />
<div id="userLobby"></div>
<div id="main"></div>
<hr class="mdc-list-divider mdc-theme--text-hint-on-background divider" />
<div id="footer">
  <div id="about" class="mdc-layout-grid">
    <div class="mdc-layout-grid__inner">
      <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-10">
      </div>
      <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-2">
        <h3 class="mdc-typography--headline6 mdc-theme--text-hint-on-background">
          <a class="mdc-typography link-in-text mdc-theme--text-hint-on-background" href="https://www.krestianstvo.org">Krestianstvo.org</a> 2018</h3>
      </div>
    </div>
  </div>
</div>