kibana-123/ui_framework/doc_site/src/views/table/controlled_table_loading_items.html

Kibana is an open source (Apache Licensed), browser based analytics and search dashboard for Elasticsearch. Kibana is a snap to setup and start using. Kibana strives to be easy to get started with, while also being flexible and powerful, just like Elastic

<div class="kuiControlledTable">
  <!-- ToolBar -->
  <div class="kuiToolBar">
    <div class="kuiToolBarSearch">
      <div class="kuiToolBarSearchBox">
        <div class="kuiToolBarSearchBox__icon kuiIcon fa-search"></div>
        <input
          class="kuiToolBarSearchBox__input"
          type="text"
          placeholder="Search..."
        >
      </div>
    </div>

    <div class="kuiToolBarSection">
      <button class="kuiButton kuiButton--primary">
        Add
      </button>

      <button class="kuiButton kuiButton--basic kuiButton--icon">
        <span class="kuiButton__icon kuiIcon fa-gear"></span>
      </button>

      <button class="kuiButton kuiButton--basic kuiButton--icon">
        <span class="kuiButton__icon kuiIcon fa-bars"></span>
      </button>
    </div>

    <div class="kuiToolBarSection">
      <div class="kuiToolBarText">
        0 of 33
      </div>

      <div class="kuiButtonGroup kuiButtonGroup--united">
        <button class="kuiButton kuiButton--basic kuiButton--icon">
          <span class="kuiButton__icon kuiIcon fa-chevron-left"></span>
        </button>
        <button class="kuiButton kuiButton--basic kuiButton--icon">
          <span class="kuiButton__icon kuiIcon fa-chevron-right"></span>
        </button>
      </div>
    </div>
  </div>

  <!-- LoadingResults -->
  <div class="kuiPanel kuiPanel--centered">
    <div class="kuiLoadingItems">
      Loading&hellip;
    </div>
  </div>

  <!-- ToolBarFooter -->
  <div class="kuiToolBarFooter">
    <div class="kuiToolBarFooterSection">
      <div class="kuiToolBarText">
        0 of 33
      </div>

      <div class="kuiButtonGroup kuiButtonGroup--united">
        <button class="kuiButton kuiButton--basic kuiButton--icon">
          <span class="kuiButton__icon kuiIcon fa-chevron-left"></span>
        </button>
        <button class="kuiButton kuiButton--basic kuiButton--icon">
          <span class="kuiButton__icon kuiIcon fa-chevron-right"></span>
        </button>
      </div>
    </div>
  </div>

</div>