nodebb-theme-harmony 1.0.0-beta.45 → 1.0.0-beta.47

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/package.json +1 -1
  2. package/public/harmony.js +23 -7
  3. package/scss/chats.scss +24 -10
  4. package/scss/common.scss +0 -4
  5. package/templates/chats.tpl +2 -2
  6. package/templates/footer.tpl +1 -1
  7. package/templates/header.tpl +1 -1
  8. package/templates/partials/chats/message-window.tpl +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "nodebb-theme-harmony",
3
- "version": "1.0.0-beta.45",
3
+ "version": "1.0.0-beta.47",
4
4
  "nbbpm": {
5
5
  "compatibility": "^3.0.0"
6
6
  },
package/public/harmony.js CHANGED
@@ -56,18 +56,27 @@ $(document).ready(function () {
56
56
  });
57
57
 
58
58
  const bottomBar = $('[component="bottombar"]');
59
- $('body').on('shown.bs.dropdown', '.sticky-tools', function () {
59
+ const $body = $('body');
60
+ const $window = $(window);
61
+ $body.on('shown.bs.dropdown', '.sticky-tools', function () {
60
62
  bottomBar.addClass('hidden');
61
63
  });
62
- $('body').on('hidden.bs.dropdown', '.sticky-tools', function () {
64
+ $body.on('hidden.bs.dropdown', '.sticky-tools', function () {
63
65
  bottomBar.removeClass('hidden');
64
66
  });
65
67
 
66
68
  let lastScrollTop = 0;
67
- const $window = $(window);
69
+ let newPostsLoaded = false;
70
+
71
+
68
72
  function onWindowScroll() {
69
73
  const st = $window.scrollTop();
70
- if (st !== lastScrollTop) {
74
+ if (newPostsLoaded) {
75
+ newPostsLoaded = false;
76
+ lastScrollTop = st;
77
+ return;
78
+ }
79
+ if (st !== lastScrollTop && !navigator.scrollActive) {
71
80
  const diff = Math.abs(st - lastScrollTop);
72
81
  const scrolledDown = st > lastScrollTop;
73
82
  const scrolledUp = st < lastScrollTop;
@@ -77,13 +86,14 @@ $(document).ready(function () {
77
86
  -bottomBar.find('.bottombar-nav').outerHeight(true) :
78
87
  0,
79
88
  });
80
- lastScrollTop = st;
81
89
  }
82
90
  }
91
+ lastScrollTop = st;
83
92
  }
84
93
 
85
94
  const delayedScroll = utils.throttle(onWindowScroll, 250);
86
95
  function enableAutohide() {
96
+ $window.off('scroll', delayedScroll);
87
97
  if (config.theme.autohideBottombar) {
88
98
  lastScrollTop = $window.scrollTop();
89
99
  $window.on('scroll', delayedScroll);
@@ -93,13 +103,19 @@ $(document).ready(function () {
93
103
  hooks.on('action:posts.loading', function () {
94
104
  $window.off('scroll', delayedScroll);
95
105
  });
96
- hooks.on('action:posts.loaded', enableAutohide);
106
+ hooks.on('action:posts.loaded', function () {
107
+ newPostsLoaded = true;
108
+ enableAutohide();
109
+ });
97
110
  hooks.on('action:ajaxify.end', function () {
98
111
  $window.off('scroll', delayedScroll);
112
+ $body.removeClass('chat-loaded');
99
113
  bottomBar.css({ bottom: 0 });
100
114
  enableAutohide();
101
115
  });
102
- enableAutohide();
116
+ hooks.on('action:chat.loaded', function () {
117
+ $body.toggleClass('chat-loaded', !!(ajaxify.data.template.chats && ajaxify.data.roomId));
118
+ });
103
119
  });
104
120
  }
105
121
 
package/scss/chats.scss CHANGED
@@ -5,6 +5,19 @@
5
5
  }
6
6
  body.page-user-chats {
7
7
  overflow: hidden;
8
+ [data-widget-area="footer"] {
9
+ display: none;
10
+ }
11
+ height: 100%;
12
+ > .layout-container {
13
+ height: 100%;
14
+ > #panel {
15
+ height: 100%;
16
+ > .container {
17
+ height: 100%;
18
+ }
19
+ }
20
+ }
8
21
  }
9
22
  [component="chat/nav-wrapper"] {
10
23
  width: 300px;
@@ -43,17 +56,18 @@ body.page-user-chats {
43
56
  [component="chat/nav-wrapper"] {
44
57
  width: 100%;
45
58
  }
46
- .page-user-chats {
47
- .chats-full {
48
- padding-bottom: 8rem!important;
49
- }
50
59
 
51
- [component="chat/nav-wrapper"][data-loaded="1"] {
52
- display: none!important;
53
- }
54
60
 
55
- [component="chat/nav-wrapper"][data-loaded="0"] + [component="chat/main-wrapper"] {
56
- display: none!important;
57
- }
61
+ .page-user-chats.chat-loaded .bottombar {
62
+ display: none!important;
58
63
  }
64
+
65
+ [component="chat/nav-wrapper"][data-loaded="1"] {
66
+ display: none!important;
67
+ }
68
+
69
+ [component="chat/nav-wrapper"][data-loaded="0"] + [component="chat/main-wrapper"] {
70
+ display: none!important;
71
+ }
72
+
59
73
  }
package/scss/common.scss CHANGED
@@ -10,10 +10,6 @@ body {
10
10
  }
11
11
  .tracking-tight { letter-spacing: -0.025em; }
12
12
 
13
- .text-md { font-size: 1.125rem!important; } // 18px
14
- .text-sm { font-size: 0.875rem!important; } // 14px
15
- .text-xs { font-size: 0.75rem!important; } // 12px
16
-
17
13
  .caret {
18
14
  &::after {
19
15
  border: none;
package/templates/chats.tpl CHANGED
@@ -1,4 +1,4 @@
1
- <div class="chats-full d-flex gap-1 vh-100 py-3">
1
+ <div class="chats-full d-flex gap-1 h-100 mt-3 mt-md-0 py-md-3">
2
2
  <div class="d-flex flex-column h-100" component="chat/nav-wrapper" data-loaded="{{{ if roomId }}}1{{{ else }}}0{{{ end }}}">
3
3
  <div class="chat-search dropdown mb-2">
4
4
  <label class="text-xs text-muted">[[users:search-user-for-chat]]</label>
@@ -21,7 +21,7 @@
21
21
  {{{end}}}
22
22
  </ul>
23
23
  </div>
24
- <div class="flex-1 ms-md-2 ps-md-2 border-1 border-start-md" component="chat/main-wrapper">
24
+ <div class="flex-1 ms-md-2 ps-md-2 border-1 border-start-md h-100" component="chat/main-wrapper">
25
25
  <!-- IMPORT partials/chats/message-window.tpl -->
26
26
  </div>
27
27
  <div class="imagedrop"><div>[[topic:composer.drag_and_drop_images]]</div></div>
package/templates/footer.tpl CHANGED
@@ -6,7 +6,7 @@
6
6
  <!-- IMPORT partials/mobile-footer.tpl -->
7
7
  {{{ if !isSpider }}}
8
8
  <div class="">
9
- <div component="toaster/tray" class="alert-window fixed-bottom mb-5 mb-md-2 me-md-5 ms-auto" style="width:300px;">
9
+ <div component="toaster/tray" class="alert-window fixed-bottom mb-5 mb-md-2 me-2 me-md-5 ms-auto" style="width:300px;">
10
10
  <div id="reconnect-alert" class="alert alert-dismissible alert-warning clearfix hide" component="toaster/toast">
11
11
  <button type="button" class="btn-close float-end" data-bs-dismiss="alert" aria-hidden="true"></button>
12
12
  <p>[[global:reconnecting-message, {config.siteTitle}]]</p>
package/templates/header.tpl CHANGED
@@ -24,7 +24,7 @@
24
24
  </head>
25
25
 
26
26
  <body class="{bodyClass} skin-{{{if bootswatchSkin}}}{bootswatchSkin}{{{else}}}noskin{{{end}}}">
27
- <div class="d-flex justify-content-between pb-4 pb-md-0">
27
+ <div class="layout-container d-flex justify-content-between pb-4 pb-md-0">
28
28
  <!-- IMPORT partials/sidebar-left.tpl -->
29
29
 
30
30
  <main id="panel" class="d-flex flex-column gap-3 flex-grow-1 mt-3" style="min-width: 0;">
package/templates/partials/chats/message-window.tpl CHANGED
@@ -6,7 +6,7 @@
6
6
 
7
7
  {{{ if roomId }}}
8
8
  <div component="chat/messages" class="expanded-chat d-flex flex-column h-100" data-roomid="{roomId}">
9
- <div component="chat/header" class="d-flex align-items-center px-3 gap-2">
9
+ <div component="chat/header" class="d-flex align-items-center px-md-3 gap-3">
10
10
  <a href="#" data-action="close" role="button" class="d-flex d-md-none btn btn-outline align-text-top"><i class="fa fa-chevron-left"></i></a>
11
11
  <h5 class="members flex-1 fw-semibold tracking-tight mb-0">
12
12
  {./chatWithMessage}