aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorMario <mario@mariovavti.com>2023-02-15 18:06:16 +0000
committerMario <mario@mariovavti.com>2023-02-15 18:06:16 +0000
commit321cd9f2e03bd3895aaf3bda70b5a67281610894 (patch)
tree50b79421317d9770e4501b039676a9fdb0af9e90
parent09a60774d746de57d6f9e479a1f6cf70c691f031 (diff)
downloadvolse-hubzilla-321cd9f2e03bd3895aaf3bda70b5a67281610894.tar.gz
volse-hubzilla-321cd9f2e03bd3895aaf3bda70b5a67281610894.tar.bz2
volse-hubzilla-321cd9f2e03bd3895aaf3bda70b5a67281610894.zip
more restructure for better responsive behaviour
-rw-r--r--view/tpl/conv_item.tpl60
-rw-r--r--view/tpl/conv_list.tpl60
-rw-r--r--view/tpl/navbar_default.tpl2
-rw-r--r--view/tpl/search_item.tpl60
4 files changed, 94 insertions, 88 deletions
diff --git a/view/tpl/conv_item.tpl b/view/tpl/conv_item.tpl
index 8e66aa505..f676c04c9 100644
--- a/view/tpl/conv_item.tpl
+++ b/view/tpl/conv_item.tpl
@@ -26,8 +26,33 @@
<hr class="m-0">
{{/if}}
{{/if}}
- <div class="p-2 lh-sm d-flex wall-item-head{{if !$item.title && !$item.event && !$item.photo}} rounded-top{{/if}}{{if $item.is_new && !$item.event && !$item.is_comment}} wall-item-head-new{{/if}}" >
- <div class="wall-item-info pe-2" id="wall-item-info-{{$item.id}}" >
+ <div class="p-2 wall-item-head{{if !$item.title && !$item.event && !$item.photo}} rounded-top{{/if}}{{if $item.is_new && !$item.event && !$item.is_comment}} wall-item-head-new{{/if}}" >
+ <div class="text-end float-end">
+ <div class="wall-item-ago opacity-75" id="wall-item-ago-{{$item.id}}">
+ {{if $item.editedtime}}
+ <i class="fa fa-pencil"></i>
+ {{/if}}
+ {{if $item.delayed}}
+ <i class="fa fa-clock-o"></i>
+ {{/if}}
+ {{if $item.location}}
+ <small class="wall-item-location p-location" id="wall-item-location-{{$item.id}}">{{$item.location}}</small>
+ {{/if}}
+ {{if $item.verified}}
+ <i class="fa fa-check text-success" title="{{$item.verified}}"></i>
+ {{elseif $item.forged}}
+ <i class="fa fa-exclamation text-danger" title="{{$item.forged}}"></i>
+ {{/if}}
+ <small class="autotime" title="{{$item.isotime}}"><time class="dt-published" datetime="{{$item.isotime}}">{{$item.localtime}}</time>{{if $item.editedtime}}&nbsp;{{$item.editedtime}}{{/if}}{{if $item.expiretime}}&nbsp;{{$item.expiretime}}{{/if}}</small>
+ </div>
+ {{if $item.thr_parent}}
+ <a href="javascript:doscroll('{{$item.thr_parent}}',{{$item.parent}});" class="ms-3" title="{{$item.top_hint}}"><i class="fa fa-angle-double-up"></i></a>
+ {{/if}}
+ {{if $item.pinned}}
+ <div class="wall-item-pinned" title="{{$item.pinned}}" id="wall-item-pinned-{{$item.id}}"><i class="fa fa-thumb-tack"></i></div>
+ {{/if}}
+ </div>
+ <div class="float-start wall-item-info pe-2" id="wall-item-info-{{$item.id}}" >
<div class="wall-item-photo-wrapper{{if $item.owner_url}} wwfrom{{/if}} h-card p-author" id="wall-item-photo-wrapper-{{$item.id}}">
{{if $item.contact_id}}
<div class="spinner-wrapper contact-edit-rotator contact-edit-rotator-{{$item.contact_id}}"><div class="spinner s"></div></div>
@@ -46,7 +71,7 @@
{{/if}}
</div>
</div>
- <div class="wall-item-author text-truncate">
+ <div class="wall-item-author">
{{if $item.previewing}}<span class="preview-indicator"><i class="fa fa-eye" title="{{$item.preview_lbl}}"></i></span>{{/if}}
{{if $item.lock}}
<div class="wall-item-lock dropdown">
@@ -54,33 +79,10 @@
<div id="panel-{{$item.id}}" class="dropdown-menu"></div>
</div>
{{/if}}
- <a href="{{$item.profile_url}}" class="wall-item-name-link u-url"{{if $item.app}} title="{{$item.str_app}}"{{/if}}><span class="wall-item-name{{$item.sparkle}}" id="wall-item-name-{{$item.id}}" ><bdi>{{$item.name}}</bdi></span></a>{{if $item.owner_url}}&nbsp;{{$item.via}}&nbsp;<a href="{{$item.owner_url}}" title="{{$item.olinktitle}}" class="wall-item-name-link"><span class="wall-item-name{{$item.osparkle}}" id="wall-item-ownername-{{$item.id}}"><bdi>{{$item.owner_name}}</bdi></span></a>{{/if}}<br>
- <small class="wall-item-addr opacity-75">{{$item.author_id}}</small>
- </div>
- <div class="text-end ms-auto">
- <div class="wall-item-ago text-nowrap opacity-75" id="wall-item-ago-{{$item.id}}">
- {{if $item.editedtime}}
- <i class="fa fa-pencil"></i>
- {{/if}}
- {{if $item.delayed}}
- <i class="fa fa-clock-o"></i>
- {{/if}}
- {{if $item.location}}
- <small class="wall-item-location p-location" id="wall-item-location-{{$item.id}}">{{$item.location}}</small>
- {{/if}}
- {{if $item.verified}}
- <i class="fa fa-check text-success" title="{{$item.verified}}"></i>
- {{elseif $item.forged}}
- <i class="fa fa-exclamation text-danger" title="{{$item.forged}}"></i>
- {{/if}}
- <small class="autotime" title="{{$item.isotime}}"><time class="dt-published" datetime="{{$item.isotime}}">{{$item.localtime}}</time>{{if $item.editedtime}}&nbsp;{{$item.editedtime}}{{/if}}{{if $item.expiretime}}&nbsp;{{$item.expiretime}}{{/if}}</small>
+ <div class="text-truncate">
+ <a href="{{$item.profile_url}}" class="lh-sm wall-item-name-link u-url"{{if $item.app}} title="{{$item.str_app}}"{{/if}}><span class="wall-item-name{{$item.sparkle}}" id="wall-item-name-{{$item.id}}" ><bdi>{{$item.name}}</bdi></span></a>{{if $item.owner_url}}&nbsp;{{$item.via}}&nbsp;<a href="{{$item.owner_url}}" title="{{$item.olinktitle}}" class="wall-item-name-link"><span class="wall-item-name{{$item.osparkle}}" id="wall-item-ownername-{{$item.id}}"><bdi>{{$item.owner_name}}</bdi></span></a>{{/if}}
</div>
- {{if $item.thr_parent}}
- <a href="javascript:doscroll('{{$item.thr_parent}}',{{$item.parent}});" class="ms-3" title="{{$item.top_hint}}"><i class="fa fa-angle-double-up"></i></a>
- {{/if}}
- {{if $item.pinned}}
- <div class="wall-item-pinned" title="{{$item.pinned}}" id="wall-item-pinned-{{$item.id}}"><i class="fa fa-thumb-tack"></i></div>
- {{/if}}
+ <small class="lh-sm text-truncate d-block wall-item-addr opacity-75">{{$item.author_id}}</small>
</div>
</div>
{{if $item.divider}}
diff --git a/view/tpl/conv_list.tpl b/view/tpl/conv_list.tpl
index 350b1c328..37975eb20 100644
--- a/view/tpl/conv_list.tpl
+++ b/view/tpl/conv_list.tpl
@@ -26,8 +26,33 @@
<hr class="m-0">
{{/if}}
{{/if}}
- <div class="p-2 lh-sm d-flex wall-item-head{{if !$item.title && !$item.event && !$item.photo}} rounded-top{{/if}}{{if $item.is_new && !$item.event && !$item.is_comment}} wall-item-head-new{{/if}}" >
- <div class="wall-item-info pe-2" id="wall-item-info-{{$item.id}}" >
+ <div class="p-2 wall-item-head{{if !$item.title && !$item.event && !$item.photo}} rounded-top{{/if}}{{if $item.is_new && !$item.event && !$item.is_comment}} wall-item-head-new{{/if}}" >
+ <div class="text-end float-end">
+ <div class="wall-item-ago opacity-75" id="wall-item-ago-{{$item.id}}">
+ {{if $item.editedtime}}
+ <i class="fa fa-pencil"></i>
+ {{/if}}
+ {{if $item.delayed}}
+ <i class="fa fa-clock-o"></i>
+ {{/if}}
+ {{if $item.location}}
+ <small class="wall-item-location p-location" id="wall-item-location-{{$item.id}}">{{$item.location}}</small>
+ {{/if}}
+ {{if $item.verified}}
+ <i class="fa fa-check text-success" title="{{$item.verified}}"></i>
+ {{elseif $item.forged}}
+ <i class="fa fa-exclamation text-danger" title="{{$item.forged}}"></i>
+ {{/if}}
+ <small class="autotime" title="{{$item.isotime}}"><time class="dt-published" datetime="{{$item.isotime}}">{{$item.localtime}}</time>{{if $item.editedtime}}&nbsp;{{$item.editedtime}}{{/if}}{{if $item.expiretime}}&nbsp;{{$item.expiretime}}{{/if}}</small>
+ </div>
+ {{if $item.thr_parent}}
+ <a href="javascript:doscroll('{{$item.thr_parent}}',{{$item.parent}});" class="ms-3" title="{{$item.top_hint}}"><i class="fa fa-angle-double-up"></i></a>
+ {{/if}}
+ {{if $item.pinned}}
+ <div class="wall-item-pinned" title="{{$item.pinned}}" id="wall-item-pinned-{{$item.id}}"><i class="fa fa-thumb-tack"></i></div>
+ {{/if}}
+ </div>
+ <div class="float-start wall-item-info pe-2" id="wall-item-info-{{$item.id}}" >
<div class="wall-item-photo-wrapper{{if $item.owner_url}} wwfrom{{/if}} h-card p-author" id="wall-item-photo-wrapper-{{$item.id}}">
{{if $item.contact_id}}
<div class="spinner-wrapper contact-edit-rotator contact-edit-rotator-{{$item.contact_id}}"><div class="spinner s"></div></div>
@@ -46,7 +71,7 @@
{{/if}}
</div>
</div>
- <div class="wall-item-author text-truncate">
+ <div class="wall-item-author">
{{if $item.previewing}}<span class="preview-indicator"><i class="fa fa-eye" title="{{$item.preview_lbl}}"></i></span>{{/if}}
{{if $item.lock}}
<div class="wall-item-lock dropdown">
@@ -54,33 +79,10 @@
<div id="panel-{{$item.id}}" class="dropdown-menu"></div>
</div>
{{/if}}
- <a href="{{$item.profile_url}}" class="wall-item-name-link u-url"{{if $item.app}} title="{{$item.str_app}}"{{/if}}><span class="wall-item-name{{$item.sparkle}}" id="wall-item-name-{{$item.id}}" ><bdi>{{$item.name}}</bdi></span></a>{{if $item.owner_url}}&nbsp;{{$item.via}}&nbsp;<a href="{{$item.owner_url}}" title="{{$item.olinktitle}}" class="wall-item-name-link"><span class="wall-item-name{{$item.osparkle}}" id="wall-item-ownername-{{$item.id}}"><bdi>{{$item.owner_name}}</bdi></span></a>{{/if}}<br>
- <small class="wall-item-addr opacity-75">{{$item.author_id}}</small>
- </div>
- <div class="text-end ms-auto">
- <div class="wall-item-ago text-nowrap opacity-75" id="wall-item-ago-{{$item.id}}">
- {{if $item.editedtime}}
- <i class="fa fa-pencil"></i>
- {{/if}}
- {{if $item.delayed}}
- <i class="fa fa-clock-o"></i>
- {{/if}}
- {{if $item.location}}
- <small class="wall-item-location p-location" id="wall-item-location-{{$item.id}}">{{$item.location}}</small>
- {{/if}}
- {{if $item.verified}}
- <i class="fa fa-check text-success" title="{{$item.verified}}"></i>
- {{elseif $item.forged}}
- <i class="fa fa-exclamation text-danger" title="{{$item.forged}}"></i>
- {{/if}}
- <small class="autotime" title="{{$item.isotime}}"><time class="dt-published" datetime="{{$item.isotime}}">{{$item.localtime}}</time>{{if $item.editedtime}}&nbsp;{{$item.editedtime}}{{/if}}{{if $item.expiretime}}&nbsp;{{$item.expiretime}}{{/if}}</small>
+ <div class="text-truncate">
+ <a href="{{$item.profile_url}}" class="lh-sm wall-item-name-link u-url"{{if $item.app}} title="{{$item.str_app}}"{{/if}}><span class="wall-item-name{{$item.sparkle}}" id="wall-item-name-{{$item.id}}" ><bdi>{{$item.name}}</bdi></span></a>{{if $item.owner_url}}&nbsp;{{$item.via}}&nbsp;<a href="{{$item.owner_url}}" title="{{$item.olinktitle}}" class="wall-item-name-link"><span class="wall-item-name{{$item.osparkle}}" id="wall-item-ownername-{{$item.id}}"><bdi>{{$item.owner_name}}</bdi></span></a>{{/if}}
</div>
- {{if $item.thr_parent}}
- <a href="javascript:doscroll('{{$item.thr_parent}}',{{$item.parent}});" class="ms-3" title="{{$item.top_hint}}"><i class="fa fa-angle-double-up"></i></a>
- {{/if}}
- {{if $item.pinned}}
- <div class="wall-item-pinned" title="{{$item.pinned}}" id="wall-item-pinned-{{$item.id}}"><i class="fa fa-thumb-tack"></i></div>
- {{/if}}
+ <small class="lh-sm text-truncate d-block wall-item-addr opacity-75">{{$item.author_id}}</small>
</div>
</div>
{{if $item.divider}}
diff --git a/view/tpl/navbar_default.tpl b/view/tpl/navbar_default.tpl
index 36363bcf1..ca61bcb8e 100644
--- a/view/tpl/navbar_default.tpl
+++ b/view/tpl/navbar_default.tpl
@@ -41,7 +41,7 @@
</div>
{{/if}}
{{if ! $is_owner}}
- <div class="dropdown-menu" role="menu" aria-labelledby="avatar">
+ <div class="dropdown-menu" role="menu" aria-labelledby="avatar" {{$color_mode}}>
<a class="dropdown-item" href="{{$nav.rusermenu.0}}" role="menuitem">{{$nav.rusermenu.1}}</a>
<a class="dropdown-item" href="{{$nav.rusermenu.2}}" role="menuitem">{{$nav.rusermenu.3}}</a>
</div>
diff --git a/view/tpl/search_item.tpl b/view/tpl/search_item.tpl
index 70c030b19..2b36e62fc 100644
--- a/view/tpl/search_item.tpl
+++ b/view/tpl/search_item.tpl
@@ -20,8 +20,33 @@
<hr class="m-0">
{{/if}}
{{/if}}
- <div class="p-2 lh-sm d-flex wall-item-head{{if !$item.title && !$item.event && !$item.photo}} rounded-top{{/if}}{{if $item.is_new && !$item.event && !$item.is_comment}} wall-item-head-new{{/if}}" >
- <div class="wall-item-info pe-2" id="wall-item-info-{{$item.id}}" >
+ <div class="p-2 wall-item-head{{if !$item.title && !$item.event && !$item.photo}} rounded-top{{/if}}{{if $item.is_new && !$item.event && !$item.is_comment}} wall-item-head-new{{/if}}" >
+ <div class="text-end float-end">
+ <div class="wall-item-ago opacity-75" id="wall-item-ago-{{$item.id}}">
+ {{if $item.editedtime}}
+ <i class="fa fa-pencil"></i>
+ {{/if}}
+ {{if $item.delayed}}
+ <i class="fa fa-clock-o"></i>
+ {{/if}}
+ {{if $item.location}}
+ <small class="wall-item-location p-location" id="wall-item-location-{{$item.id}}">{{$item.location}}</small>
+ {{/if}}
+ {{if $item.verified}}
+ <i class="fa fa-check text-success" title="{{$item.verified}}"></i>
+ {{elseif $item.forged}}
+ <i class="fa fa-exclamation text-danger" title="{{$item.forged}}"></i>
+ {{/if}}
+ <small class="autotime" title="{{$item.isotime}}"><time class="dt-published" datetime="{{$item.isotime}}">{{$item.localtime}}</time>{{if $item.editedtime}}&nbsp;{{$item.editedtime}}{{/if}}{{if $item.expiretime}}&nbsp;{{$item.expiretime}}{{/if}}</small>
+ </div>
+ {{if $item.thr_parent}}
+ <a href="javascript:doscroll('{{$item.thr_parent}}',{{$item.parent}});" class="ms-3" title="{{$item.top_hint}}"><i class="fa fa-angle-double-up"></i></a>
+ {{/if}}
+ {{if $item.pinned}}
+ <div class="wall-item-pinned" title="{{$item.pinned}}" id="wall-item-pinned-{{$item.id}}"><i class="fa fa-thumb-tack"></i></div>
+ {{/if}}
+ </div>
+ <div class="float-start wall-item-info pe-2" id="wall-item-info-{{$item.id}}" >
<div class="wall-item-photo-wrapper{{if $item.owner_url}} wwfrom{{/if}} h-card p-author" id="wall-item-photo-wrapper-{{$item.id}}">
{{if $item.contact_id}}
<div class="spinner-wrapper contact-edit-rotator contact-edit-rotator-{{$item.contact_id}}"><div class="spinner s"></div></div>
@@ -40,7 +65,7 @@
{{/if}}
</div>
</div>
- <div class="wall-item-author text-truncate">
+ <div class="wall-item-author">
{{if $item.previewing}}<span class="preview-indicator"><i class="fa fa-eye" title="{{$item.preview_lbl}}"></i></span>{{/if}}
{{if $item.lock}}
<div class="wall-item-lock dropdown">
@@ -48,33 +73,10 @@
<div id="panel-{{$item.id}}" class="dropdown-menu"></div>
</div>
{{/if}}
- <a href="{{$item.profile_url}}" class="wall-item-name-link u-url"{{if $item.app}} title="{{$item.str_app}}"{{/if}}><span class="wall-item-name{{$item.sparkle}}" id="wall-item-name-{{$item.id}}" ><bdi>{{$item.name}}</bdi></span></a>{{if $item.owner_url}}&nbsp;{{$item.via}}&nbsp;<a href="{{$item.owner_url}}" title="{{$item.olinktitle}}" class="wall-item-name-link"><span class="wall-item-name{{$item.osparkle}}" id="wall-item-ownername-{{$item.id}}"><bdi>{{$item.owner_name}}</bdi></span></a>{{/if}}<br>
- <small class="wall-item-addr opacity-75">{{$item.author_id}}</small>
- </div>
- <div class="text-end ms-auto">
- <div class="wall-item-ago text-nowrap opacity-75" id="wall-item-ago-{{$item.id}}">
- {{if $item.editedtime}}
- <i class="fa fa-pencil"></i>
- {{/if}}
- {{if $item.delayed}}
- <i class="fa fa-clock-o"></i>
- {{/if}}
- {{if $item.location}}
- <small class="wall-item-location p-location" id="wall-item-location-{{$item.id}}">{{$item.location}}</small>
- {{/if}}
- {{if $item.verified}}
- <i class="fa fa-check text-success" title="{{$item.verified}}"></i>
- {{elseif $item.forged}}
- <i class="fa fa-exclamation text-danger" title="{{$item.forged}}"></i>
- {{/if}}
- <small class="autotime" title="{{$item.isotime}}"><time class="dt-published" datetime="{{$item.isotime}}">{{$item.localtime}}</time>{{if $item.editedtime}}&nbsp;{{$item.editedtime}}{{/if}}{{if $item.expiretime}}&nbsp;{{$item.expiretime}}{{/if}}</small>
+ <div class="text-truncate">
+ <a href="{{$item.profile_url}}" class="lh-sm wall-item-name-link u-url"{{if $item.app}} title="{{$item.str_app}}"{{/if}}><span class="wall-item-name{{$item.sparkle}}" id="wall-item-name-{{$item.id}}" ><bdi>{{$item.name}}</bdi></span></a>{{if $item.owner_url}}&nbsp;{{$item.via}}&nbsp;<a href="{{$item.owner_url}}" title="{{$item.olinktitle}}" class="wall-item-name-link"><span class="wall-item-name{{$item.osparkle}}" id="wall-item-ownername-{{$item.id}}"><bdi>{{$item.owner_name}}</bdi></span></a>{{/if}}
</div>
- {{if $item.thr_parent}}
- <a href="javascript:doscroll('{{$item.thr_parent}}',{{$item.parent}});" class="ms-3" title="{{$item.top_hint}}"><i class="fa fa-angle-double-up"></i></a>
- {{/if}}
- {{if $item.pinned}}
- <div class="wall-item-pinned" title="{{$item.pinned}}" id="wall-item-pinned-{{$item.id}}"><i class="fa fa-thumb-tack"></i></div>
- {{/if}}
+ <small class="lh-sm text-truncate d-block wall-item-addr opacity-75">{{$item.author_id}}</small>
</div>
</div>
{{if $item.divider}}