61 lines
2.4 KiB
HTML
61 lines
2.4 KiB
HTML
|
|
||
|
|
<link href="{{context}}/static/css/default.css" type="text/css" rel="stylesheet">
|
||
|
|
<link href="{{context}}/static/css/border.css" type="text/css" rel="stylesheet">
|
||
|
|
<link href="{{context}}/static/css/border.css" type="text/css" rel="stylesheet">
|
||
|
|
<script src="{{system.context}}/static/js/fontawesome/js/all.js"></script>
|
||
|
|
<script src="{{system.context}}/static/js/jquery/jquery.js"></script>
|
||
|
|
<script src="{{system.context}}/static/js/search.js"></script>
|
||
|
|
<script src="{{system.context}}/static/js/jx/dom.js"></script>
|
||
|
|
<script src="{{system.context}}/static/js/jx/utils.js"></script>
|
||
|
|
<style>
|
||
|
|
.album {
|
||
|
|
height:75%;
|
||
|
|
overflow: hidden;
|
||
|
|
overflow-y: auto;
|
||
|
|
}
|
||
|
|
.album-pane {display:grid; grid-template-columns: repeat(2,1fr); gap:4px;
|
||
|
|
font-weight:lighter;
|
||
|
|
min-height:101%;
|
||
|
|
|
||
|
|
}
|
||
|
|
.album img {width:150px; margin:4px;}
|
||
|
|
|
||
|
|
.search {padding:4px; display:grid; grid-template-columns: auto 32px 48px; gap:2px; align-items:center;;}
|
||
|
|
.search input[type=text] {padding:4px; outline:0px; border-color:transparent; background-color:#f3f3f3; width:100%;}
|
||
|
|
.search .found {color:maroon; font-family:courier; font-size:14px; }
|
||
|
|
</style>
|
||
|
|
<div>
|
||
|
|
|
||
|
|
{%set _participants = routes['api/studio/_participants']()%}
|
||
|
|
<div class="search border-bottom">
|
||
|
|
<div>
|
||
|
|
<input type="text" id="search" class="search" placeholder="[search by alias]" onkeypress="search.find('album-pane','search')"/>
|
||
|
|
</div>
|
||
|
|
<div class="active" align="center" style="background-color:#f3f3f3" onclick="jx.dom.set.value('search',''); search.find('album-pane','search')">
|
||
|
|
<i class="fa-solid fa-trash"></i>
|
||
|
|
</div>
|
||
|
|
<div class="found" align="center" style="display:grid; align-items:center; background-color:#f3f3f3; height:100%; text-align: center">
|
||
|
|
<div id="found">{{_participants|length}}</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="album" >
|
||
|
|
|
||
|
|
<div class="album-pane" id="album-pane">
|
||
|
|
|
||
|
|
{%for _user in _participants %}
|
||
|
|
|
||
|
|
<div data="{{_user.alias|safe}}" style=";">
|
||
|
|
<div align="center">
|
||
|
|
<img src="{{_user.png|safe}}"/>
|
||
|
|
</div>
|
||
|
|
<div class="border-top">
|
||
|
|
<div class="bold" >{{_user.alias}}</div>
|
||
|
|
<div class="small">{{_user.email}}</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{%endfor%}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|