diff --git a/web/data/assets/.gitkeep b/web/data/assets/.gitkeep deleted file mode 100644 index e69de29..0000000 diff --git a/web/data/assets/js/dayjs/dayjs.min.js b/web/data/assets/js/dayjs/dayjs.min.js new file mode 100644 index 0000000..d284eec --- /dev/null +++ b/web/data/assets/js/dayjs/dayjs.min.js @@ -0,0 +1 @@ +!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).dayjs=e()}(this,(function(){"use strict";var t=1e3,e=6e4,n=36e5,r="millisecond",i="second",s="minute",u="hour",a="day",o="week",f="month",h="quarter",c="year",d="date",$="Invalid Date",l=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,y=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_")},m=function(t,e,n){var r=String(t);return!r||r.length>=e?t:""+Array(e+1-r.length).join(n)+t},g={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return(e<=0?"+":"-")+m(r,2,"0")+":"+m(i,2,"0")},m:function t(e,n){if(e.date()0,p<=y.r||!y.r){p<=1&&c>0&&(y=h[c-1]);var v=l[y.l];u&&(p=u(""+p)),a="string"==typeof v?v.replace("%d",p):v(p,n,y.l,s);break}}if(n)return a;var M=s?l.future:l.past;return"function"==typeof M?M(a):M.replace("%s",a)},n.to=function(r,e){return i(r,e,this,!0)},n.from=function(r,e){return i(r,e,this)};var d=function(r){return r.$u?t.utc():t()};n.toNow=function(r){return this.to(d(this),r)},n.fromNow=function(r){return this.from(d(this),r)}}})); \ No newline at end of file diff --git a/web/data/assets/js/dayjs/updateLocale.js b/web/data/assets/js/dayjs/updateLocale.js new file mode 100644 index 0000000..811d9e9 --- /dev/null +++ b/web/data/assets/js/dayjs/updateLocale.js @@ -0,0 +1 @@ +!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):(e="undefined"!=typeof globalThis?globalThis:e||self).dayjs_plugin_updateLocale=n()}(this,(function(){"use strict";return function(e,n,t){t.updateLocale=function(e,n){var o=t.Ls[e];if(o)return(n?Object.keys(n):[]).forEach((function(e){o[e]=n[e]})),o}}})); \ No newline at end of file diff --git a/web/src/_templates/app/header.php b/web/src/_templates/app/header.php index 6f821c5..3ef2281 100644 --- a/web/src/_templates/app/header.php +++ b/web/src/_templates/app/header.php @@ -4,10 +4,11 @@ + + + + diff --git a/web/src/app/css/app.css b/web/src/app/css/app.css index e71a60e..df6e296 100644 --- a/web/src/app/css/app.css +++ b/web/src/app/css/app.css @@ -123,26 +123,39 @@ main { background: linear-gradient(to right, #00000082, #00000063, #00000063, #00000082); } +.meet.item .status { color: #fff } .meet.item .status-content { - padding: 2em 1em; - background: #000000a8; - margin-bottom: 1em; - border-radius: 4px; + padding: 1em; box-shadow: 0px 0px 1em #0000008c; + margin-bottom: 1em; } .meet.item .status-content .text { margin: 0; text-align: justify; + font-size: 1.2em; word-break: break-word; } +.meet.item .status-content pre { + font-family: inherit !important; + margin: 0 !important; +} +.meet.item .status .profile { padding: 1em 2em; } +.meet.item .status .date { + width: max-content; + float: right; + position: relative; + top: -1em; + left: -1em; + background: #00000057; + padding: .3em .4em .3em .2em; + border-radius: 10px; + border-bottom: 1px solid #ffffff3d; + font-size: .8em; +} .meet.item .content { display: grid; } -.meet.item .status { - padding: 1em; - color: #fff; -} .item .acct { font-size: .8em; opacity: .7; diff --git a/web/src/app/css/base.css b/web/src/app/css/base.css index 7fa9379..2a2ff5d 100644 --- a/web/src/app/css/base.css +++ b/web/src/app/css/base.css @@ -18,6 +18,7 @@ body { .fixed-top { position: fixed; top: 0 } .fixed-bottom { position: fixed; bottom: 0 } +.absolute { position: absolute } .absolute-top { position: absolute; top: 0 } .absolute-bottom { position: absolute; bottom: 0 } diff --git a/web/src/app/js/app.js b/web/src/app/js/app.js index 2930c7d..72c5f3f 100644 --- a/web/src/app/js/app.js +++ b/web/src/app/js/app.js @@ -123,6 +123,8 @@ function scriptPageHandler(modname, cfg) { } window.onload = function(e) { + dayjs.extend(window.dayjs_plugin_relativeTime); + dayjs.extend(window.dayjs_plugin_updateLocale); if (getNormalizedURI() === app.vars.app_dir) { scriptPageHandler('pages.home', { exact: '' }); scriptPageHandler('pages.meet', { exact: 'meet' }); diff --git a/web/src/app/js/pages/meet.js b/web/src/app/js/pages/meet.js index 167ecb5..d7f4145 100644 --- a/web/src/app/js/pages/meet.js +++ b/web/src/app/js/pages/meet.js @@ -12,14 +12,19 @@ app.pages.meet = { var tpl = app.template.fill(json[i], app.template.get('meet.item'), function (k,v) { if (k === 'account.name') return capitalize(v); + if (k === 'date') return dayjs(parseInt(v)).fromNow(true); }); var item = json[i]; var icon = app.vars.default_icon; if (item.account.avatar !== undefined && item.account.avatar.length > 0) icon = item.account.avatar[0].url[0]; + var textClr = item.text_color; + if (textClr === undefined) + textClr = '#00000094'; tpl = tpl.replaceAll('{avatar}', htmlescape(icon)); tpl = tpl.replaceAll('{actionsHeight}', '6em'); + tpl = tpl.replaceAll('{textColor}', htmlescape(textClr)); dom.innerHTML += tpl; } }; _(); diff --git a/web/src/app/js/templates/meet/item.html b/web/src/app/js/templates/meet/item.html index 54860d1..98da38f 100644 --- a/web/src/app/js/templates/meet/item.html +++ b/web/src/app/js/templates/meet/item.html @@ -12,10 +12,17 @@
-
-
-

{.text}

+ style="bottom: {actionsHeight}; max-width: 40em"> +
+
+
+ + {.date} +
+
+
+
{.text}