improved dev experience, fixed css order

This commit is contained in:
Wyatt Johnson
2018-05-09 13:56:05 -06:00
parent eda9a0cadf
commit 4426be5f39
19 changed files with 158 additions and 95 deletions
+36 -44
View File
@@ -8,53 +8,45 @@
<meta property="article:published" itemprop="datePublished" content="2016-11-16T11:46:06-05:00" />
<meta property="article:modified" itemprop="dateModified" content="2016-11-16T12:09:44-05:00" />
<meta property="article:section" itemprop="articleSection" content="The Section!" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
main {
margin-left:auto;
margin-right:auto;
max-width:500px;
display: block;
}
</style>
<title><%= title %></title>
<%- include ../partials/dev %>
</head>
<body>
<main>
<h1><%= title %></h1>
<p><%= body %></p>
<p><a href="<%= BASE_PATH %>admin">Admin</a> - <a href="<%= BASE_PATH %>dev/assets">All Assets</a></p>
<div id='coralStreamEmbed'></div>
<script src="<%= resolve('embed.js') %>" async onload="
window.TalkEmbed = Coral.Talk.render(document.getElementById('coralStreamEmbed'), {
talk: '<%= BASE_URL %>',
asset_url: '<%= asset_url ? asset_url : '' %>',
asset_id: '<%= asset_id ? asset_id : '' %>',
auth_token: '',
/**
* You can listen to events using the example below.
* The argument passed is the event emitter from
* https://github.com/asyncly/EventEmitter2
*
* events: function(events) {
* events.onAny(function(eventName, data) {
* console.log(eventName, data);
* });
* },
*/
plugins_config: {
<%- include ../partials/dev-nav %>
<div class="container">
<h1 class="mt-3"><%= title %></h1>
<div id='coralStreamEmbed'></div>
<script src="<%= resolve('embed.js') %>"></script>
<script>
window.TalkEmbed = Coral.Talk.render(document.getElementById('coralStreamEmbed'), {
talk: '<%= BASE_URL %>',
asset_url: '<%= asset_url ? asset_url : '' %>',
asset_id: '<%= asset_id ? asset_id : '' %>',
auth_token: '',
/**
* You can disable rendering slot components of a plugin by doing:
*
* 'talk-plugin-love': {
* disable_components: true,
* },
*/
test: 'data',
debug: false
}
})
"></script>
</main>
* You can listen to events using the example below.
* The argument passed is the event emitter from
* https://github.com/asyncly/EventEmitter2
*
* events: function(events) {
* events.onAny(function(eventName, data) {
* console.log(eventName, data);
* });
* },
*/
plugins_config: {
/**
* You can disable rendering slot components of a plugin by doing:
*
* 'talk-plugin-love': {
* disable_components: true,
* },
*/
test: 'data',
debug: false
}
})
</script>
</div>
</body>
</html>
+38 -12
View File
@@ -1,14 +1,40 @@
<html>
<body>
<h1>
Asset list
</h1>
<% assets.forEach(function (asset) { %>
<a href="<%= BASE_PATH %>dev/assets/id/<%= asset.id %>"><%= asset.url %></a><br />
<% }) %>
<p>
(For dev use only. FYI, you can: ?skip=100&limit=25)
</p>
</body>
<head>
<title>All Assets</title>
<%- include ../partials/dev %>
</head>
<body>
<%- include ../partials/dev-nav %>
<div class="container">
<div class="d-flex w-100 justify-content-between mt-3 mb-2">
<h1 class="mb-0">All Assets</h1>
<span class="text-muted"><%= skip + 1 %> - <%= skip + assets.length %> of <%= count %></span>
</div>
<div class="list-group">
<% if (skip === 0) { %><a href="<%= BASE_PATH %>dev/assets/random" class="list-group-item list-group-item-action list-group-item-primary"><i class="fa fa-plus" aria-hidden="true"></i> Create a random article</a><% } %>
<% assets.forEach(function (asset) { %>
<a href="<%= BASE_PATH %>dev/assets/id/<%= asset.id %>" class="list-group-item list-group-item-action flex-column align-items-start">
<div class="d-flex w-100 justify-content-between">
<h5 class="mb-1"><%= asset.title %></h5>
<small>Created <%= asset.created_at.toLocaleString('en-US') %></small>
</div>
<small><%= asset.url %></small>
</a>
<% }) %>
</div>
<% if (count !== assets.length) { %>
<nav aria-label="Page navigation example" class="mt-2">
<ul class="pagination justify-content-center">
<% let page = 1; for (let i = 0; i < count; i += limit) { %>
<% if (i === skip) { %>
<li class="page-item disabled"><a class="page-link" href="#"><%= page %></a></li>
<% } else { %>
<li class="page-item"><a class="page-link" href="?skip=<%= i %>&amp;limit=<%= limit %>"><%= page %></a></li>
<% } %>
<% page++; } %>
</ul>
</nav>
<% } %>
</div>
</body>
</html>