diff --git a/web/src/app/css/app.css b/web/src/app/css/app.css index 8c8034c..5f70335 100644 --- a/web/src/app/css/app.css +++ b/web/src/app/css/app.css @@ -20,10 +20,21 @@ body.app { hr { color: #00000045; } +.list hr { + max-width: 80%; +} img.avatar { width: 2.6em; } +.list .emoji { + width: 1.2em; + height: 1.2em; + vertical-align: middle; + position: relative; + top: -2px; + margin-right: 3px; +} a.button { text-decoration: none; @@ -99,6 +110,7 @@ main { #quiz .avatar.round { padding: 3px; background: linear-gradient(30deg, #df00ff, pink, pink, #7c4cff); + box-shadow: -6px 4px 0px #0000004f; } #quizs .avatar img, #quiz .avatar img { diff --git a/web/src/app/js/pages/home.js b/web/src/app/js/pages/home.js index 080cc27..8bb9f03 100644 --- a/web/src/app/js/pages/home.js +++ b/web/src/app/js/pages/home.js @@ -35,10 +35,15 @@ app.pages.home = { container.innerHTML = ''; for (var i in data) { const item = data[i]; - var tpl = app.template.fill(item, app.template.get('home.quiz_item')); + var tpl = app.template.fill(item, app.template.get('home.quiz_item'), + function(k,v) { + console.log(v); + if (k === 'from.name') return app.emoji.expand(capitalize(v)); + }); if (item.responses === undefined) tpl = tpl.replaceAll('{newOrAnsweredItem}', 'NEW'); else tpl = tpl.replaceAll('{newOrAnsweredItem}', 'ANSWERED'); + tpl += '