Trying to make the apps like work better on a phone.
git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@4241 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
parent
ebef51b4ea
commit
53692a1ea8
@ -3,22 +3,57 @@ async function main() {
|
|||||||
var core_apps = await core.apps('core');
|
var core_apps = await core.apps('core');
|
||||||
var doc = `<!DOCTYPE html>
|
var doc = `<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
|
<head>
|
||||||
|
<style>
|
||||||
|
.container {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fill, 8em);
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
.app {
|
||||||
|
height: 8em;
|
||||||
|
width: 8em;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
.app > a {
|
||||||
|
text-decoration: none;
|
||||||
|
max-width: 8em;
|
||||||
|
text-overflow: ellipsis ellipsis;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
<body style="background: #888">
|
<body style="background: #888">
|
||||||
<h1>Apps</h1>
|
<h1>Apps</h1>
|
||||||
<ul id="apps"></ul>
|
<div id="apps" class="container"></div>
|
||||||
<h1>Core Apps</h1>
|
<h1>Core Apps</h1>
|
||||||
<ul id="core_apps"></ul>
|
<div id="core_apps" class="container"></div>
|
||||||
</body>
|
</body>
|
||||||
<script>
|
<script>
|
||||||
function populate_apps(id, name, apps) {
|
function populate_apps(id, name, apps) {
|
||||||
var list = document.getElementById(id);
|
var list = document.getElementById(id);
|
||||||
for (let app of Object.keys(apps).sort()) {
|
for (let app of Object.keys(apps).sort()) {
|
||||||
var li = list.appendChild(document.createElement('li'));
|
let div = list.appendChild(document.createElement('div'));
|
||||||
var a = document.createElement('a');
|
div.classList.add('app');
|
||||||
a.innerText = app;
|
|
||||||
|
let icon_a = document.createElement('a');
|
||||||
|
let icon = document.createElement('div');
|
||||||
|
icon.appendChild(document.createTextNode('📦'));
|
||||||
|
icon.style.fontSize = 'xxx-large';
|
||||||
|
icon_a.appendChild(icon);
|
||||||
|
icon_a.href = '/~' + name + '/' + app + '/';
|
||||||
|
icon_a.target = '_top';
|
||||||
|
div.appendChild(icon_a);
|
||||||
|
|
||||||
|
let a = document.createElement('a');
|
||||||
|
a.appendChild(document.createTextNode(app));
|
||||||
a.href = '/~' + name + '/' + app + '/';
|
a.href = '/~' + name + '/' + app + '/';
|
||||||
a.target = '_top';
|
a.target = '_top';
|
||||||
li.appendChild(a);
|
div.appendChild(a);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
populate_apps('apps', '${core.user.credentials?.session?.name}', ${JSON.stringify(apps)});
|
populate_apps('apps', '${core.user.credentials?.session?.name}', ${JSON.stringify(apps)});
|
||||||
|
Loading…
Reference in New Issue
Block a user