nodebb-theme-persona 11.3.5 → 11.3.9

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 (7) hide show
  1. package/less/account.less +1 -1
  2. package/less/mobile.less +290 -291
  3. package/package.json +1 -1
  4. package/public/modules/quickreply.js +9 -1
  5. package/public/persona.js +8 -4
  6. package/templates/partials/menu.tpl +12 -3
  7. package/templates/post-queue.tpl +10 -3
package/less/account.less CHANGED
@@ -32,7 +32,7 @@
32
32
  margin-bottom: 1em;
33
33
  background-origin: content-box;
34
34
  width: 100%;
35
- top: 50px;
35
+ top: calc(var(--panel-offset) + @navbar-height);
36
36
  position: absolute;
37
37
  left: auto;
38
38
  right: 0px;
package/less/mobile.less CHANGED
@@ -1,291 +1,290 @@
1
-
2
- .slideout-menu {
3
- overflow-y: auto;
4
- -webkit-overflow-scrolling: touch;
5
- }
6
-
7
- /* iPhone 5 and other such devices */
8
- @media (max-width: @screen-sm-max) {
9
- .chat-modal {
10
- width: 100%;
11
- height: 100%;
12
- top: 0px !important;
13
- left: 0px !important;
14
-
15
- .modal-dialog {
16
- margin: 0;
17
- height: 100%;
18
- width: 100%;
19
-
20
- .modal-content {
21
- height: 100%;
22
- border: none;
23
- }
24
- }
25
- }
26
-
27
- .account {
28
- margin-top: 256px;
29
-
30
- .cover .controls i {
31
- font-size: 3em;
32
- }
33
- }
34
- }
35
-
36
- @media (max-width: @screen-md-max) {
37
- body {
38
- padding-top: 0;
39
- padding-bottom: 0;
40
- }
41
-
42
- #panel {
43
- background-color: inherit;
44
- min-height: 100%;
45
- padding-top: 80px;
46
- padding-bottom: 40px;
47
- }
48
-
49
- body, #panel, .slideout-menu {
50
- -webkit-overflow-scrolling: touch;
51
- }
52
-
53
- .navbar-toggle {
54
- padding: 10px 17px;
55
- margin: 0;
56
- line-height: 30px;
57
- border: none;
58
-
59
- html[data-dir="rtl"] button& {
60
- margin-left: 0;
61
- }
62
-
63
- .header & .notification-icon {
64
- left: auto;
65
- right: 7px;
66
- top: 10px;
67
-
68
- &.unread-count::after {
69
- position: static;
70
- }
71
- }
72
- }
73
-
74
- #menu {
75
- padding-top: 100px;
76
- }
77
-
78
- .slideout-menu {
79
- z-index: 10000 !important;
80
- background-color: #1D1F20;
81
- background-image: linear-gradient(145deg, #1D1F20, #404348);
82
-
83
- a, button {
84
- color: #fff;
85
- text-decoration: none;
86
-
87
- &:hover {
88
- text-decoration: underline;
89
- }
90
- }
91
-
92
- .chat-list {
93
- max-height: 100%;
94
-
95
- li {
96
- width: auto;
97
- border: none;
98
- color: #fff;
99
- position: relative;
100
- height: 60px;
101
-
102
- &:hover {
103
- background: none;
104
- }
105
-
106
- &:not(:last-child) {
107
- border-bottom: none;
108
- }
109
-
110
- .main-avatar {
111
- position: absolute;
112
- top: 0;
113
- left: 0;
114
-
115
- .avatar {
116
- height: 40px;
117
- width: 40px;
118
- font-size: 20px;
119
- border-radius: 0;
120
- }
121
- }
122
-
123
- .members {
124
- display: none;
125
- }
126
-
127
- .room-name {
128
- display: block;
129
- overflow: hidden;
130
- white-space: nowrap;
131
- text-overflow: ellipsis;
132
- padding-left: 60px;
133
- }
134
-
135
- .teaser-content {
136
- padding-left: 60px;
137
- display: block;
138
- font-size: 13px;
139
- opacity: .8;
140
- overflow: hidden;
141
- white-space: nowrap;
142
- text-overflow: ellipsis;
143
- }
144
- }
145
- }
146
-
147
- .menu-section {
148
- .chat-list, .notification-list-mobile {
149
- .user-link {
150
- display: inline;
151
- }
152
- .unread {
153
- background-color: inherit;
154
- }
155
- }
156
- .chat-list .unread .room-name::after,
157
- .notification-list-mobile .unread a::after {
158
- content: "new";
159
- text-transform: uppercase;
160
- color: #FFF;
161
- margin-left: 5px;
162
- font-size: 10px;
163
- background: #C91106;
164
- border: 1px solid #890405;
165
- padding: 2px 3px;
166
- border-radius: 5px;
167
- }
168
- }
169
-
170
- .counter {
171
- font-style: normal;
172
-
173
- &:after {
174
- left: 5px;
175
- top: -1px;
176
- padding: 3px 7px;
177
- background: #333;
178
- border: 1px solid #222;
179
- }
180
-
181
- &:before {
182
- display: none;
183
- }
184
- }
185
- }
186
-
187
- .menu-header-title {
188
- font-weight: 400;
189
- letter-spacing: 0.5px;
190
- margin: 0;
191
- }
192
-
193
- .menu-section {
194
- margin: 25px 0;
195
- }
196
-
197
- .menu-section-title {
198
- text-transform: uppercase;
199
- color: #85888d;
200
- font-weight: 200;
201
- font-size: 13px;
202
- letter-spacing: 1px;
203
- padding: 0 20px;
204
- margin:0;
205
- }
206
-
207
- .menu-section-list {
208
- padding: 0;
209
- margin: 10px 0;
210
- list-style: none;
211
-
212
- a, button {
213
- display: block;
214
- padding: 10px 20px;
215
- text-align: left;
216
- width: 100%;
217
-
218
- &:hover {
219
- background-color: rgba(255, 255, 255, 0.1);
220
- text-decoration: none;
221
- }
222
- }
223
-
224
- .user-status {
225
- padding-left: 40px;
226
- }
227
- }
228
-
229
- .slideout-open,
230
- .slideout-open body,
231
- .slideout-open .slideout-panel {
232
- overflow: hidden;
233
- overflow-y: hidden !important;
234
- }
235
-
236
- @keyframes fade {
237
- from {
238
- opacity: 0;
239
- }
240
- to {
241
- opacity: .3;
242
- }
243
- }
244
- .subnav-is-opened .main-nav__secondary-nav {
245
- display: block;
246
- animation: fade 250ms ease-in-out both;
247
- }
248
-
249
- .slideout-open .slideout-panel {
250
- &::after {
251
- position: fixed;
252
- top: 0;
253
- bottom: 0;
254
- left: 0;
255
- right: 0;
256
- z-index: 1040;
257
- content: ' ';
258
-
259
- opacity: 0;
260
- }
261
- }
262
-
263
- .menu-profile {
264
- text-align: center;
265
- background: #101010;
266
- position: absolute;
267
- height: 75px;
268
- width: 100%;
269
- top: 0px;
270
- z-index: 1;
271
-
272
- img, .user-icon {
273
- .user-icon-style(70px, 4rem);
274
- position: absolute;
275
- bottom: -22px;
276
- left: 93px;
277
- border-radius: 50%;
278
- }
279
-
280
- i {
281
- position: absolute;
282
- left: 145px;
283
- font-size: 21px;
284
- top: 28px;
285
- }
286
- }
287
-
288
- [data-section="notifications"] ul li a:first-child {
289
- display: none;
290
- }
291
- }
1
+
2
+ .slideout-menu {
3
+ overflow-y: auto;
4
+ -webkit-overflow-scrolling: touch;
5
+ }
6
+
7
+ /* iPhone 5 and other such devices */
8
+ @media (max-width: @screen-sm-max) {
9
+ .chat-modal {
10
+ width: 100%;
11
+ height: 100%;
12
+ top: 0px !important;
13
+ left: 0px !important;
14
+
15
+ .modal-dialog {
16
+ margin: 0;
17
+ height: 100%;
18
+ width: 100%;
19
+
20
+ .modal-content {
21
+ height: 100%;
22
+ border: none;
23
+ }
24
+ }
25
+ }
26
+
27
+ .account {
28
+ margin-top: 256px;
29
+
30
+ .cover .controls i {
31
+ font-size: 3em;
32
+ }
33
+ }
34
+ }
35
+
36
+ @media (max-width: @screen-md-max) {
37
+ body {
38
+ padding-top: 0;
39
+ padding-bottom: 0;
40
+ }
41
+
42
+ #panel {
43
+ background-color: inherit;
44
+ min-height: 100%;
45
+ padding-bottom: 40px;
46
+ }
47
+
48
+ body, #panel, .slideout-menu {
49
+ -webkit-overflow-scrolling: touch;
50
+ }
51
+
52
+ .navbar-toggle {
53
+ padding: 10px 17px;
54
+ margin: 0;
55
+ line-height: 30px;
56
+ border: none;
57
+
58
+ html[data-dir="rtl"] button& {
59
+ margin-left: 0;
60
+ }
61
+
62
+ .header & .notification-icon {
63
+ left: auto;
64
+ right: 7px;
65
+ top: 10px;
66
+
67
+ &.unread-count::after {
68
+ position: static;
69
+ }
70
+ }
71
+ }
72
+
73
+ #menu {
74
+ padding-top: 100px;
75
+ }
76
+
77
+ .slideout-menu {
78
+ z-index: 10000 !important;
79
+ background-color: #1D1F20;
80
+ background-image: linear-gradient(145deg, #1D1F20, #404348);
81
+
82
+ a, button {
83
+ color: #fff;
84
+ text-decoration: none;
85
+
86
+ &:hover {
87
+ text-decoration: underline;
88
+ }
89
+ }
90
+
91
+ .chat-list {
92
+ max-height: 100%;
93
+
94
+ li {
95
+ width: auto;
96
+ border: none;
97
+ color: #fff;
98
+ position: relative;
99
+ height: 60px;
100
+
101
+ &:hover {
102
+ background: none;
103
+ }
104
+
105
+ &:not(:last-child) {
106
+ border-bottom: none;
107
+ }
108
+
109
+ .main-avatar {
110
+ position: absolute;
111
+ top: 0;
112
+ left: 0;
113
+
114
+ .avatar {
115
+ height: 40px;
116
+ width: 40px;
117
+ font-size: 20px;
118
+ border-radius: 0;
119
+ }
120
+ }
121
+
122
+ .members {
123
+ display: none;
124
+ }
125
+
126
+ .room-name {
127
+ display: block;
128
+ overflow: hidden;
129
+ white-space: nowrap;
130
+ text-overflow: ellipsis;
131
+ padding-left: 60px;
132
+ }
133
+
134
+ .teaser-content {
135
+ padding-left: 60px;
136
+ display: block;
137
+ font-size: 13px;
138
+ opacity: .8;
139
+ overflow: hidden;
140
+ white-space: nowrap;
141
+ text-overflow: ellipsis;
142
+ }
143
+ }
144
+ }
145
+
146
+ .menu-section {
147
+ .chat-list, .notification-list-mobile {
148
+ .user-link {
149
+ display: inline;
150
+ }
151
+ .unread {
152
+ background-color: inherit;
153
+ }
154
+ }
155
+ .chat-list .unread .room-name::after,
156
+ .notification-list-mobile .unread a::after {
157
+ content: "new";
158
+ text-transform: uppercase;
159
+ color: #FFF;
160
+ margin-left: 5px;
161
+ font-size: 10px;
162
+ background: #C91106;
163
+ border: 1px solid #890405;
164
+ padding: 2px 3px;
165
+ border-radius: 5px;
166
+ }
167
+ }
168
+
169
+ .counter {
170
+ font-style: normal;
171
+
172
+ &:after {
173
+ left: 5px;
174
+ top: -1px;
175
+ padding: 3px 7px;
176
+ background: #333;
177
+ border: 1px solid #222;
178
+ }
179
+
180
+ &:before {
181
+ display: none;
182
+ }
183
+ }
184
+ }
185
+
186
+ .menu-header-title {
187
+ font-weight: 400;
188
+ letter-spacing: 0.5px;
189
+ margin: 0;
190
+ }
191
+
192
+ .menu-section {
193
+ margin: 25px 0;
194
+ }
195
+
196
+ .menu-section-title {
197
+ text-transform: uppercase;
198
+ color: #85888d;
199
+ font-weight: 200;
200
+ font-size: 13px;
201
+ letter-spacing: 1px;
202
+ padding: 0 20px;
203
+ margin:0;
204
+ }
205
+
206
+ .menu-section-list {
207
+ padding: 0;
208
+ margin: 10px 0;
209
+ list-style: none;
210
+
211
+ a, button {
212
+ display: block;
213
+ padding: 10px 20px;
214
+ text-align: left;
215
+ width: 100%;
216
+
217
+ &:hover {
218
+ background-color: rgba(255, 255, 255, 0.1);
219
+ text-decoration: none;
220
+ }
221
+ }
222
+
223
+ .user-status {
224
+ padding-left: 40px;
225
+ }
226
+ }
227
+
228
+ .slideout-open,
229
+ .slideout-open body,
230
+ .slideout-open .slideout-panel {
231
+ overflow: hidden;
232
+ overflow-y: hidden !important;
233
+ }
234
+
235
+ @keyframes fade {
236
+ from {
237
+ opacity: 0;
238
+ }
239
+ to {
240
+ opacity: .3;
241
+ }
242
+ }
243
+ .subnav-is-opened .main-nav__secondary-nav {
244
+ display: block;
245
+ animation: fade 250ms ease-in-out both;
246
+ }
247
+
248
+ .slideout-open .slideout-panel {
249
+ &::after {
250
+ position: fixed;
251
+ top: 0;
252
+ bottom: 0;
253
+ left: 0;
254
+ right: 0;
255
+ z-index: 1040;
256
+ content: ' ';
257
+
258
+ opacity: 0;
259
+ }
260
+ }
261
+
262
+ .menu-profile {
263
+ text-align: center;
264
+ background: #101010;
265
+ position: absolute;
266
+ height: 75px;
267
+ width: 100%;
268
+ top: 0px;
269
+ z-index: 1;
270
+
271
+ img, .user-icon {
272
+ .user-icon-style(70px, 4rem);
273
+ position: absolute;
274
+ bottom: -22px;
275
+ left: 93px;
276
+ border-radius: 50%;
277
+ }
278
+
279
+ i {
280
+ position: absolute;
281
+ left: 145px;
282
+ font-size: 21px;
283
+ top: 28px;
284
+ }
285
+ }
286
+
287
+ [data-section="notifications"] ul li a:first-child {
288
+ display: none;
289
+ }
290
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "nodebb-theme-persona",
3
- "version": "11.3.5",
3
+ "version": "11.3.9",
4
4
  "nbbpm": {
5
5
  "compatibility": "^1.18.0"
6
6
  },
package/public/modules/quickreply.js CHANGED
@@ -48,7 +48,15 @@ define('persona/quickreply', [
48
48
  return alerts.error(err);
49
49
  }
50
50
  if (data && data.queued) {
51
- alerts.success(data.message);
51
+ alerts.alert({
52
+ type: 'success',
53
+ title: '[[global:alert.success]]',
54
+ message: data.message,
55
+ timeout: 10000,
56
+ clickfn: function () {
57
+ ajaxify.go(`/post-queue#${data.id}`);
58
+ },
59
+ });
52
60
  }
53
61
 
54
62
  components.get('topic/quickreply/text').val('');
package/public/persona.js CHANGED
@@ -30,8 +30,11 @@ $(document).ready(function () {
30
30
  const headerRect = headerEl.getBoundingClientRect();
31
31
  const headerStyle = window.getComputedStyle(headerEl);
32
32
 
33
- let offset = headerRect.y + headerRect.height +
34
- (parseInt(headerStyle.marginTop, 10) || 0) + (parseInt(headerStyle.marginBottom, 10) || 0);
33
+ let offset =
34
+ headerRect.y + headerRect.height +
35
+ (parseInt(headerStyle.marginTop, 10) || 0) +
36
+ (parseInt(headerStyle.marginBottom, 10) || 0);
37
+
35
38
  // body element itself introduces a hardcoded 70px padding on desktop resolution
36
39
  if (env === 'lg') {
37
40
  offset -= 70;
@@ -253,8 +256,9 @@ $(document).ready(function () {
253
256
 
254
257
  $(window).on('resize action:ajaxify.start', function () {
255
258
  navSlideout.close();
256
- if (chatsSlideout) { chatsSlideout.close(); }
257
- $('.account .cover').css('top', $('[component="navbar"]').height());
259
+ if (chatsSlideout) {
260
+ chatsSlideout.close();
261
+ }
258
262
  });
259
263
 
260
264
  navSlideout
package/templates/partials/menu.tpl CHANGED
@@ -109,7 +109,7 @@
109
109
  <i class="fa fa-fw fa-gear"></i> <span>[[user:settings]]</span>
110
110
  </a>
111
111
  </li>
112
- <!-- IF showModMenu -->
112
+ {{{ if showModMenu }}}
113
113
  <li role="presentation" class="divider"></li>
114
114
  <li class="dropdown-header">[[pages:moderator-tools]]</li>
115
115
  <li>
@@ -127,7 +127,16 @@
127
127
  <i class="fa fa-fw fa-ban"></i> <span>[[pages:ip-blacklist]]</span>
128
128
  </a>
129
129
  </li>
130
- <!-- ENDIF showModMenu -->
130
+ {{{ else }}}
131
+ {{{ if postQueueEnabled }}}
132
+ <li>
133
+ <a href="{relative_path}/post-queue">
134
+ <i class="fa fa-fw fa-list-alt"></i> <span>[[pages:post-queue]]</span>
135
+ </a>
136
+ </li>
137
+ {{{ end }}}
138
+ {{{ end }}}
139
+
131
140
  <li role="presentation" class="divider"></li>
132
141
  <li component="user/logout">
133
142
  <form method="post" action="{relative_path}/logout">
@@ -204,7 +213,7 @@
204
213
  <!-- IF function.displayMenuItem, @index -->
205
214
  <li class="{navigation.class}{{{ if navigation.dropdown }}} dropdown{{{ end }}}">
206
215
  <a title="{navigation.title}" class="navigation-link {{{ if navigation.dropdown }}}dropdown-toggle{{{ end }}}"
207
- {{{ if navigation.dropdown }}} href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" {{{ else }}} href="{navigation.route}"{{{ end }}} {{{ if navigation.id }}}id="{navigation.id}"{{{ end }}}{{{ if navigation.properties.targetBlank }}} target="_blank"{{{ end }}}>
216
+ {{{ if navigation.dropdown }}} href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" {{{ else }}} href="{navigation.route}"{{{ end }}} {{{ if navigation.id }}}id="{navigation.id}"{{{ end }}}{{{ if navigation.targetBlank }}} target="_blank"{{{ end }}}>
208
217
  {{{ if navigation.iconClass }}}
209
218
  <i class="fa fa-fw {navigation.iconClass}" data-content="{navigation.content}"></i>
210
219
  {{{ end }}}
package/templates/post-queue.tpl CHANGED
@@ -7,10 +7,12 @@
7
7
  <div class="col-xs-12">
8
8
  <div class="post-queue preventSlideout posts-list">
9
9
  {{{ if !posts.length }}}
10
+ {{{ if isAdmin }}}
10
11
  <p class="panel-body">
11
12
  [[post-queue:description, {config.relative_path}/admin/settings/post#post-queue]]
12
13
  </p>
13
14
  {{{ end }}}
15
+ {{{ end }}}
14
16
 
15
17
  {{{ each posts }}}
16
18
  <div class="panel panel-default" data-id="{posts.id}">
@@ -62,9 +64,14 @@
62
64
  </div>
63
65
  </div>
64
66
  <div class="panel-footer text-right">
65
- <div class="btn-group">
66
- <button class="btn btn-success btn-xs" data-action="accept"><i class="fa fa-check"></i> [[post-queue:accept]] </button>
67
- <button class="btn btn-danger btn-xs" data-action="reject"><i class="fa fa-times"></i> [[post-queue:reject]]</button>
67
+ <div>
68
+ {{{ if canAccept }}}
69
+ <button class="btn btn-danger btn-xs" data-action="reject"><i class="fa fa-fw fa-times"></i> [[post-queue:reject]]</button>
70
+ <button class="btn btn-info btn-xs" data-action="notify"><i class="fa fa-fw fa-bell-o"></i> [[post-queue:notify]]</button>
71
+ <button class="btn btn-success btn-xs" data-action="accept"><i class="fa fa-fw fa-check"></i> [[post-queue:accept]] </button>
72
+ {{{ else }}}
73
+ <button class="btn btn-danger btn-xs" data-action="reject"><i class="fa fa-fw fa-times"></i> [[post-queue:remove]]</button>
74
+ {{{ end }}}
68
75
  </div>
69
76
  </div>
70
77
  </div>