85 lines
2.4 KiB
Twig
85 lines
2.4 KiB
Twig
|
{#
|
||
|
|
OTS Signage Modern Theme - Displays Page Override
|
||
|
|
Two-column layout with folder panel on left
|
||
|
|
#}
|
||
|
|
{% extends "authed.twig" %}
|
||
|
|
|
||
|
|
{% block pageTitle %}Displays{% endblock %}
|
||
|
|
|
||
|
|
{% block content %}
|
||
|
|
<div class="ots-theme two-column-layout">
|
||
|
|
<aside class="left-panel">
|
||
|
|
<div class="panel-header">
|
||
|
|
<h3>Folders</h3>
|
||
|
|
<button class="btn-icon-sm" aria-label="Expand/collapse">
|
||
|
|
<span>✎</span>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
<div class="folder-tree">
|
||
|
|
<div class="folder-item active">
|
||
|
|
<span class="folder-icon">📁</span>
|
||
|
|
<span class="folder-name">All Items</span>
|
||
|
|
</div>
|
||
|
|
<div class="folder-item">
|
||
|
|
<span class="folder-icon">📂</span>
|
||
|
|
<span class="folder-name">Root Folder</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</aside>
|
||
|
|
|
||
|
|
<main class="content-panel">
|
||
|
|
<div class="page-header">
|
||
|
|
<h1>Displays</h1>
|
||
|
|
<p class="text-muted">Manage and monitor your digital signage displays</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="content-toolbar">
|
||
|
|
<input type="search" placeholder="Search displays…" class="form-control search-field" />
|
||
|
|
<div class="toolbar-actions">
|
||
|
|
<button class="btn btn-outline">Columns</button>
|
||
|
|
<a href="{{ baseUrl }}/display/add" class="btn btn-primary">Add Display</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="stat-row">
|
||
|
|
<div class="stat-box">
|
||
|
|
<div class="stat-label">Total</div>
|
||
|
|
<div class="stat-value">1</div>
|
||
|
|
</div>
|
||
|
|
<div class="stat-box">
|
||
|
|
<div class="stat-label">Online</div>
|
||
|
|
<div class="stat-value text-success">1</div>
|
||
|
|
</div>
|
||
|
|
<div class="stat-box">
|
||
|
|
<div class="stat-label">Offline</div>
|
||
|
|
<div class="stat-value text-danger">0</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="table-wrapper">
|
||
|
|
<table class="table table-striped">
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th>Display</th>
|
||
|
|
<th>Status</th>
|
||
|
|
<th>Folder</th>
|
||
|
|
<th>Group</th>
|
||
|
|
<th>Last Check-in</th>
|
||
|
|
<th>Actions</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
<tr>
|
||
|
|
<td>Test1</td>
|
||
|
|
<td><span class="badge badge-success">Online</span></td>
|
||
|
|
<td>Test Screens</td>
|
||
|
|
<td>-</td>
|
||
|
|
<td>just now</td>
|
||
|
|
<td><button class="btn-icon-sm" aria-label="Actions">⋮</button></td>
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
</main>
|
||
|
|
</div>
|
||
|
|
{% endblock %}
|