nodebb-theme-persona 13.3.51 → 13.3.52

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 (18) hide show
  1. package/package.json +1 -1
  2. package/scss/groups.scss +0 -56
  3. package/templates/account/blocks.tpl +2 -2
  4. package/templates/account/categories.tpl +7 -7
  5. package/templates/account/consent.tpl +1 -1
  6. package/templates/account/followers.tpl +6 -7
  7. package/templates/account/following.tpl +6 -7
  8. package/templates/account/groups.tpl +1 -3
  9. package/templates/account/profile.tpl +2 -2
  10. package/templates/account/tags.tpl +2 -6
  11. package/templates/account/uploads.tpl +10 -11
  12. package/templates/groups/details.tpl +81 -44
  13. package/templates/groups/list.tpl +5 -5
  14. package/templates/partials/account/category-item.tpl +18 -19
  15. package/templates/partials/groups/admin.tpl +82 -187
  16. package/templates/partials/groups/invited.tpl +33 -0
  17. package/templates/partials/groups/list.tpl +19 -19
  18. package/templates/partials/groups/pending.tpl +28 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "nodebb-theme-persona",
3
- "version": "13.3.51",
3
+ "version": "13.3.52",
4
4
  "nbbpm": {
5
5
  "compatibility": "^3.7.0"
6
6
  },
package/scss/groups.scss CHANGED
@@ -96,18 +96,6 @@
96
96
  }
97
97
  }
98
98
 
99
- h1 {
100
- overflow-wrap: break-word;
101
- margin-top: 0;
102
- }
103
-
104
- .post-body {
105
- .topic-title, p {
106
- overflow-y: hidden;
107
- display: block;
108
- }
109
- }
110
-
111
99
  @include media-breakpoint-up(md) {
112
100
  margin-top: 300px;
113
101
 
@@ -120,48 +108,4 @@
120
108
  }
121
109
  }
122
110
  }
123
-
124
- .panel-title {
125
- .label {
126
- padding: .2em .3em .1em;
127
- }
128
- }
129
111
  }
130
-
131
- .groups.list {
132
- [component="groups/summary"] {
133
- .list-cover {
134
- display: block;
135
- background-size: cover;
136
- min-height: 125px;
137
- background-position: 50% 50%;
138
- @include pointer;
139
-
140
- h5 {
141
- background-color: rgba(0,0,0,0.5);
142
- display: inline-block;
143
- padding: 0.25em 0.5em;
144
- color: white;
145
- font-weight: bold;
146
- text-transform: capitalize;
147
- white-space: nowrap;
148
- text-overflow: ellipsis;
149
- overflow-x: hidden;
150
- max-width: 100%;
151
- }
152
- }
153
-
154
- .members {
155
- padding-left: 0;
156
-
157
- > li {
158
- list-style-type: none;
159
- display: inline-block;
160
- }
161
-
162
- .truncated {
163
- vertical-align: bottom;
164
- }
165
- }
166
- }
167
- }
package/templates/account/blocks.tpl CHANGED
@@ -1,5 +1,5 @@
1
1
  <!-- IMPORT partials/account/header.tpl -->
2
- <h1 class="fs-2">[[pages:account/blocks, {username}]]</h1>
2
+ <h1 class="fs-4">[[pages:account/blocks, {username}]]</h1>
3
3
  <div class="row justify-content-end mb-2">
4
4
  <div class="col-3">
5
5
  <div class="dropdown">
@@ -30,6 +30,7 @@
30
30
  </div>
31
31
 
32
32
  <div class="users row">
33
+ <div class="alert alert-warning text-center {{{ if users.length }}}hidden{{{ end }}}">[[user:has-no-blocks]]</div>
33
34
  <div id="users-container" class="users-container list-unstyled d-flex flex-wrap gap-2">
34
35
  {{{ each users }}}
35
36
  <div class="d-flex flex-column gap-1">
@@ -38,7 +39,6 @@
38
39
  </div>
39
40
  {{{ end }}}
40
41
 
41
- <div class="alert alert-warning text-center"<!-- IF users.length --> style="display: none;"<!-- END -->>[[user:has-no-blocks]]</div>
42
42
  <!-- IMPORT partials/paginator.tpl -->
43
43
  </div>
44
44
  </div>
package/templates/account/categories.tpl CHANGED
@@ -1,19 +1,19 @@
1
1
  <!-- IMPORT partials/account/header.tpl -->
2
2
 
3
- <div class="">
3
+ <div>
4
4
  <div class="d-flex justify-content-between align-items-center mb-3">
5
- <h1 class="fs-2">{title}</h1>
5
+ <h1 class="fs-4">{title}</h1>
6
6
  <div class="mb-2">
7
7
  <div class="btn-group bottom-sheet" component="category/watch/all">
8
8
  <button class="btn btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown" type="button" aria-haspopup="true" aria-expanded="false">
9
9
  <span>[[user:change-all]]</span>
10
10
  <span class="caret"></span>
11
11
  </button>
12
- <ul class="dropdown-menu" role="menu">
13
- <li><a class="dropdown-item" href="#" component="category/watching" data-state="watching" role="menuitem"><i class="fa fa-fw fa-bell-o"></i> [[category:watching]]<p class="help-text"><small>[[category:watching.description]]</small></p></a></li>
14
- <li><a class="dropdown-item" href="#" component="category/tracking" data-state="tracking" role="menuitem"><i class="fa fa-fw fa-inbox"></i> [[category:tracking]]<p class="help-text"><small>[[category:tracking.description]]</small></p></a></li>
15
- <li><a class="dropdown-item" href="#" component="category/notwatching" data-state="notwatching" role="menuitem"><i class="fa fa-fw fa-clock-o"></i> [[category:not-watching]]<p class="help-text"><small>[[category:not-watching.description]]</small></p></a></li>
16
- <li><a class="dropdown-item" href="#" component="category/ignoring" data-state="ignoring" role="menuitem"><i class="fa fa-fw fa-eye-slash"></i> [[category:ignoring]]<p class="help-text"><small>[[category:ignoring.description]]</small></p></a></li>
12
+ <ul class="dropdown-menu p-1" role="menu">
13
+ <li><a class="dropdown-item rounded-1" href="#" component="category/watching" data-state="watching" role="menuitem"><i class="fa fa-fw fa-bell-o"></i> [[category:watching]]<p class="help-text"><small>[[category:watching.description]]</small></p></a></li>
14
+ <li><a class="dropdown-item rounded-1" href="#" component="category/tracking" data-state="tracking" role="menuitem"><i class="fa fa-fw fa-inbox"></i> [[category:tracking]]<p class="help-text"><small>[[category:tracking.description]]</small></p></a></li>
15
+ <li><a class="dropdown-item rounded-1" href="#" component="category/notwatching" data-state="notwatching" role="menuitem"><i class="fa fa-fw fa-clock-o"></i> [[category:not-watching]]<p class="help-text"><small>[[category:not-watching.description]]</small></p></a></li>
16
+ <li><a class="dropdown-item rounded-1" href="#" component="category/ignoring" data-state="ignoring" role="menuitem"><i class="fa fa-fw fa-eye-slash"></i> [[category:ignoring]]<p class="help-text"><small>[[category:ignoring.description]]</small></p></a></li>
17
17
  </ul>
18
18
  </div>
19
19
  </div>
package/templates/account/consent.tpl CHANGED
@@ -1,5 +1,5 @@
1
1
  <!-- IMPORT partials/account/header.tpl -->
2
- <h2>[[user:consent.title]]</h2>
2
+ <h3>[[user:consent.title]]</h3>
3
3
  <p class="lead">[[user:consent.lead]]</p>
4
4
  <p>[[user:consent.intro]]</p>
5
5
 
package/templates/account/followers.tpl CHANGED
@@ -1,16 +1,15 @@
1
1
  <!-- IMPORT partials/account/header.tpl -->
2
2
 
3
+ <h1 class="fs-4">[[pages:{template.name}, {username}]]</h1>
3
4
  <div class="users row">
4
5
  <div class="col-12">
5
- <h1 class="fs-2">[[pages:{template.name}, {username}]]</h1>
6
+ <!-- IMPORT partials/users_list.tpl -->
6
7
 
7
- <!-- IMPORT partials/users_list.tpl -->
8
+ <!-- IF !users.length -->
9
+ <div class="alert alert-warning text-center">[[user:has-no-follower]]</div>
10
+ <!-- ENDIF !users.length -->
8
11
 
9
- <!-- IF !users.length -->
10
- <div class="alert alert-warning text-center">[[user:has-no-follower]]</div>
11
- <!-- ENDIF !users.length -->
12
-
13
- <!-- IMPORT partials/paginator.tpl -->
12
+ <!-- IMPORT partials/paginator.tpl -->
14
13
  </div>
15
14
  </div>
16
15
 
package/templates/account/following.tpl CHANGED
@@ -1,16 +1,15 @@
1
1
  <!-- IMPORT partials/account/header.tpl -->
2
2
 
3
+ <h1 class="fs-4">[[pages:{template.name}, {username}]]</h1>
3
4
  <div class="users row">
4
5
  <div class="col-12">
5
- <h1 class="fs-2">[[pages:{template.name}, {username}]]</h1>
6
+ <!-- IMPORT partials/users_list.tpl -->
6
7
 
7
- <!-- IMPORT partials/users_list.tpl -->
8
+ <!-- IF !users.length -->
9
+ <div class="alert alert-warning text-center">[[user:follows-no-one]]</div>
10
+ <!-- ENDIF !users.length -->
8
11
 
9
- <!-- IF !users.length -->
10
- <div class="alert alert-warning text-center">[[user:follows-no-one]]</div>
11
- <!-- ENDIF !users.length -->
12
-
13
- <!-- IMPORT partials/paginator.tpl -->
12
+ <!-- IMPORT partials/paginator.tpl -->
14
13
  </div>
15
14
  </div>
16
15
 
package/templates/account/groups.tpl CHANGED
@@ -1,8 +1,6 @@
1
1
  <!-- IMPORT partials/account/header.tpl -->
2
-
2
+ <h1 class="fs-4">[[pages:{template.name}, {username}]]</h1>
3
3
  <div class="row">
4
- <h1 class="fs-2">[[pages:{template.name}, {username}]]</h1>
5
-
6
4
  <div class="col-12 groups list">
7
5
  <div component="groups/container" id="groups-list" class="row">
8
6
  <!-- IF !groups.length -->
package/templates/account/profile.tpl CHANGED
@@ -164,7 +164,7 @@
164
164
  <div class="row">
165
165
  {{{ if bestPosts.length }}}
166
166
  <div class="col-lg-12 col-12">
167
- <h1>[[pages:account/best, {username}]]</h1>
167
+ <h1 class="fs-3">[[pages:account/best, {username}]]</h1>
168
168
 
169
169
  <div class="col-12">
170
170
  <ul component="posts" class="posts-list list-unstyled">
@@ -177,7 +177,7 @@
177
177
  {{{ end }}}
178
178
  {{{ if latestPosts.length}}}
179
179
  <div class="col-lg-12 col-12">
180
- <h1>[[pages:account/latest-posts, {username}]]</h1>
180
+ <h1 class="fs-3">[[pages:account/latest-posts, {username}]]</h1>
181
181
  <div class="col-12">
182
182
  <ul component="posts" class="posts-list list-unstyled">
183
183
  {{{each latestPosts}}}
package/templates/account/tags.tpl CHANGED
@@ -1,10 +1,6 @@
1
1
  <!-- IMPORT partials/account/header.tpl -->
2
2
 
3
- <div class="row">
4
- <h1 class="fs-2">{title}</h1>
5
- <div class="col-lg-12">
6
- <input component="tags/watch" type="text" class="form-control">
7
- </div>
8
- </div>
3
+ <h1 class="fs-4">{title}</h1>
4
+ <input component="tags/watch" type="text" class="form-control">
9
5
 
10
6
  <!-- IMPORT partials/account/footer.tpl -->
package/templates/account/uploads.tpl CHANGED
@@ -1,17 +1,16 @@
1
1
  <!-- IMPORT partials/account/header.tpl -->
2
- <div class="row">
3
- <h1 class="fs-2">{title}</h1>
4
-
5
- <!-- IF privateUploads -->
6
- <div class="alert alert-info text-center">[[uploads:private-uploads-info]]</div>
7
- <!-- ELSE -->
8
- <div class="alert alert-info text-center">[[uploads:public-uploads-info]]</div>
9
- <!-- ENDIF privateUploads -->
2
+ <h1 class="fs-4">{title}</h1>
3
+ <!-- IF privateUploads -->
4
+ <div class="alert alert-info text-center">[[uploads:private-uploads-info]]</div>
5
+ <!-- ELSE -->
6
+ <div class="alert alert-info text-center">[[uploads:public-uploads-info]]</div>
7
+ <!-- ENDIF privateUploads -->
10
8
 
11
- <!-- IF !uploads.length -->
12
- <div class="alert alert-warning text-center">[[uploads:no-uploads-found]]</div>
13
- <!-- ENDIF !uploads.length -->
9
+ <!-- IF !uploads.length -->
10
+ <div class="alert alert-warning text-center">[[uploads:no-uploads-found]]</div>
11
+ <!-- ENDIF !uploads.length -->
14
12
 
13
+ <div class="row">
15
14
  <div class="col-12">
16
15
  <table class="table table-striped">
17
16
  <thead>
package/templates/groups/details.tpl CHANGED
@@ -1,6 +1,7 @@
1
- <div component="groups/container" class="groups details row">
1
+ <div component="groups/container" class="groups details">
2
+
2
3
  <div component="groups/cover" style="background-image: url({group.cover:url}); background-position: {group.cover:position};">
3
- <!-- IF group.isOwner -->
4
+ {{{ if group.isOwner }}}
4
5
  <div class="controls">
5
6
  <span class="upload"><i class="fa fa-fw fa-4x fa-upload"></i></span>
6
7
  <span class="resize"><i class="fa fa-fw fa-4x fa-arrows"></i></span>
@@ -8,66 +9,102 @@
8
9
  </div>
9
10
  <div class="save">[[groups:cover-save]] <i class="fa fa-fw fa-floppy-o"></i></div>
10
11
  <div class="indicator">[[groups:cover-saving]] <i class="fa fa-fw fa-refresh fa-spin"></i></div>
11
- <!-- ENDIF group.isOwner -->
12
+ {{{ end }}}
12
13
  </div>
13
14
 
14
- <div class="col-12">
15
+ <div>
15
16
  <!-- IMPORT partials/breadcrumbs.tpl -->
16
17
  </div>
17
18
 
18
- <div class="col-lg-4 col-12">
19
- <div class="card mb-3">
20
- <div class="card-header">
21
- <span class="fs-5">
22
- <i class="fa fa-list-ul"></i> [[groups:details.title]]
23
- <!-- IF group.private --><span class="badge bg-info text-dark">[[groups:details.private]]</span><!-- ENDIF group.private -->
24
- <!-- IF group.hidden --><span class="badge bg-info text-dark">[[groups:details.hidden]]</span>&nbsp;<!-- ENDIF group.hidden -->
25
- </span>
19
+ <div class="d-flex flex-column flex-md-row justify-content-md-between pb-2 mb-4 mt-2 border-bottom">
20
+ <div class="d-flex flex-column">
21
+ <div class="d-flex align-items-center gap-2">
22
+ <h3 class="mb-0">{group.displayName}</h3>
26
23
  </div>
27
- <div class="card-body">
28
- <h2>{group.displayName}</h2>
29
- <p>{group.descriptionParsed}</p>
30
- <!-- IF isAdmin -->
31
- <div class="float-end">
32
- <a href="{config.relative_path}/admin/manage/groups/{group.nameEncoded}" target="_blank" class="btn btn-info"><i class="fa fa-gear"></i> [[user:edit]]</a>
33
- </div>
34
- <!-- ENDIF isAdmin -->
35
- <!-- IF loggedIn -->
36
- <div class="float-end">
37
- {function.membershipBtn, group}&nbsp;
24
+ <div class="d-flex gap-2">
25
+ {group.descriptionParsed}
26
+ <div>
27
+ {{{ if group.private }}}<span class="badge text-bg-light border border-1">[[groups:details.private]]</span>{{{ end }}}
28
+ {{{ if group.hidden }}}<span class="badge text-bg-light border border-1">[[groups:details.hidden]]</span>{{{ end }}}
38
29
  </div>
39
- <!-- ENDIF loggedIn -->
40
30
  </div>
41
31
  </div>
42
-
43
- <div class="card mb-3">
44
- <div class="card-header">
45
- <span class="fs-5">
46
- <i class="fa fa-users"></i> [[groups:details.members]]
47
- </span>
48
- </div>
49
- <div class="card-body">
50
- <!-- IMPORT partials/groups/memberlist.tpl -->
51
- </div>
32
+ <div class="d-flex gap-2 align-items-start">
33
+ {{{ if loggedIn }}}
34
+ {function.membershipBtn, group}
35
+ {{{ end }}}
36
+ {{{ if isAdmin }}}
37
+ <a href="{config.relative_path}/admin/manage/groups/{group.nameEncoded}" target="_blank" class="btn btn-light"><i class="fa fa-gear"></i> [[user:edit]]</a>
38
+ {{{ end }}}
52
39
  </div>
40
+ </div>
53
41
 
54
- <!-- IF group.isOwner -->
55
- <!-- IMPORT partials/groups/admin.tpl -->
56
- <!-- ENDIF group.isOwner -->
42
+ <div class="text-sm mb-3 nav d-flex flex-row flex-wrap gap-1 justify-content-end">
43
+ <button data-bs-toggle="tab" data-bs-target="#groups-posts" class="btn btn-ghost btn-sm text-start d-flex align-items-center ff-secondary fw-semibold {{{ if template.groups/details }}}active{{{ end }}}">
44
+ <div class="flex-grow-1">[[global:posts]]</div>
45
+ </button>
46
+ <button data-bs-toggle="tab" data-bs-target="#groups-members" class="btn btn-ghost btn-sm text-start d-flex align-items-center ff-secondary fw-semibold gap-2">
47
+ <div class="flex-grow-1">[[groups:members]]</div>
48
+ <span component="group/member/count" class="flex-shrink-0 text-xs" title="{group.memberCount}">{humanReadableNumber(group.memberCount)}</span>
49
+ </button>
57
50
 
51
+ {{{ if group.isOwner }}}
52
+ <button data-bs-toggle="tab" data-bs-target="#groups-pending" class="btn btn-ghost btn-sm text-start d-flex align-items-center ff-secondary fw-semibold gap-2">
53
+ <div class="flex-grow-1">[[groups:details.pending]]</div>
54
+ <span component="group/pending/count" class="flex-shrink-0 text-xs" title="{group.pending.length}">{humanReadableNumber(group.pending.length)}</span>
55
+ </button>
56
+
57
+ <button data-bs-toggle="tab" data-bs-target="#groups-invited" class="btn btn-ghost btn-sm text-start d-flex align-items-center ff-secondary fw-semibold gap-2">
58
+ <div class="flex-grow-1">[[groups:details.invited]]</div>
59
+ <span component="group/invited/count" class="flex-shrink-0 text-xs" title="{group.invited.length}">{humanReadableNumber(group.invited.length)}</span>
60
+ </button>
61
+
62
+ <button data-bs-toggle="tab" data-bs-target="#groups-admin" class="btn btn-ghost btn-sm text-start d-flex align-items-center ff-secondary fw-semibold">
63
+ <div class="flex-grow-1">[[global:header.admin]]</div>
64
+ </button>
65
+ {{{ end }}}
66
+ </div>
67
+
68
+ <div class="d-flex flex-column flex-md-row">
58
69
  <div data-widget-area="left">
59
70
  {{{each widgets.left}}}
60
71
  {{widgets.left.html}}
61
72
  {{{end}}}
62
73
  </div>
63
- </div>
64
- <div class="col-lg-8 col-12">
65
- <div class="col-lg-11">
66
- <!-- IF !posts.length -->
67
- <div class="alert alert-info">[[groups:details.has-no-posts]]</div>
68
- <!-- ENDIF !posts.length -->
69
- <!-- IMPORT partials/posts_list.tpl -->
74
+
75
+ <div class="flex-grow-1" style="min-width:0;">
76
+ <div class="tab-content">
77
+ <div class="tab-pane fade show active" id="groups-posts" role="tabpanel">
78
+ <h3 class="fw-semibold fs-5">[[global:posts]]</h3>
79
+ {{{ if !posts.length }}}
80
+ <div class="alert alert-info my-2">[[groups:details.has-no-posts]]</div>
81
+ {{{ end }}}
82
+ <!-- IMPORT partials/posts_list.tpl -->
83
+ </div>
84
+ <div class="tab-pane fade" id="groups-members" role="tabpanel">
85
+ <h3 class="fw-semibold fs-5 mb-3">[[groups:details.members]]</h3>
86
+
87
+ <!-- IMPORT partials/groups/memberlist.tpl -->
88
+ </div>
89
+ {{{ if group.isOwner }}}
90
+ <div class="tab-pane fade" id="groups-pending" role="tabpanel">
91
+ <h3 class="fw-semibold fs-5 mb-3">[[groups:details.pending]]</h3>
92
+ <!-- IMPORT partials/groups/pending.tpl -->
93
+ </div>
94
+
95
+ <div class="tab-pane fade" id="groups-invited" role="tabpanel">
96
+ <h3 class="fw-semibold fs-5 mb-3">[[groups:details.invited]]</h3>
97
+ <!-- IMPORT partials/groups/invited.tpl -->
98
+ </div>
99
+
100
+ <div class="tab-pane fade" id="groups-admin" role="tabpanel">
101
+ <h3 class="fw-semibold fs-5 mb-3">[[groups:details.owner-options]]</h3>
102
+ <!-- IMPORT partials/groups/admin.tpl -->
103
+ </div>
104
+ {{{ end }}}
105
+ </div>
70
106
  </div>
107
+
71
108
  <div data-widget-area="right">
72
109
  {{{each widgets.right}}}
73
110
  {{widgets.right.html}}
package/templates/groups/list.tpl CHANGED
@@ -7,9 +7,9 @@
7
7
  <div class="groups list">
8
8
  <div class="row justify-content-between">
9
9
  <div class="col-lg-6">
10
- <!-- IF allowGroupCreation -->
10
+ {{{ if allowGroupCreation }}}
11
11
  <button class="btn btn-primary" data-action="new"><i class="fa fa-plus"></i> [[groups:new-group]]</button>
12
- <!-- ENDIF allowGroupCreation -->
12
+ {{{ end }}}
13
13
  </div>
14
14
  <div class="col-lg-6">
15
15
  <div class="row justify-content-end">
@@ -35,14 +35,14 @@
35
35
  <hr />
36
36
 
37
37
  <div component="groups/container" class="row" id="groups-list" data-nextstart={nextStart}>
38
- <!-- IF groups.length -->
38
+ {{{ if groups.length }}}
39
39
  <!-- IMPORT partials/groups/list.tpl -->
40
- <!-- ELSE -->
40
+ {{{ else }}}
41
41
  <div class="col-12">
42
42
  <div class="alert alert-warning">
43
43
  [[groups:no-groups-found]]
44
44
  </div>
45
45
  </div>
46
- <!-- ENDIF groups.length -->
46
+ {{{ end }}}
47
47
  </div>
48
48
  </div>
package/templates/partials/account/category-item.tpl CHANGED
@@ -1,23 +1,22 @@
1
- <li component="categories/category" data-cid="{../cid}" data-parent-cid="{../parentCid}" class="row clearfix">
2
- <meta itemprop="name" content="{../name}">
3
-
4
- <div class="content col-10 depth-{../depth}">
5
- <div class="float-start">
6
- {buildCategoryIcon(@value, "48px", "rounded-circle")}
7
- </div>
8
-
9
- <h2 class="title">
10
- <!-- IMPORT partials/categories/link.tpl -->
11
- </h2>
12
- <div>
13
- <!-- IF ../descriptionParsed -->
14
- <div class="description text-muted">
15
- {../descriptionParsed}
1
+ <li component="categories/category" data-cid="{./cid}" data-parent-cid="{../parentCid}" class="category-{./cid}">
2
+ <meta itemprop="name" content="{./name}">
3
+ <div class="content depth-{./depth} d-flex gap-2">
4
+ <div class="flex-grow-1 align-items-start d-flex gap-2">
5
+ <div>
6
+ {buildCategoryIcon(@value, "24px", "rounded-circle")}
7
+ </div>
8
+ <div class="d-grid gap-0">
9
+ <div class="title fw-semibold">
10
+ <!-- IMPORT partials/categories/link.tpl -->
11
+ </div>
12
+ {{{ if ./descriptionParsed }}}
13
+ <div class="description text-muted text-xs w-100">{./descriptionParsed}</div>
14
+ {{{ end }}}
16
15
  </div>
17
- <!-- ENDIF ../descriptionParsed -->
16
+ </div>
17
+ <div class="flex-shrink-0">
18
+ <!-- IMPORT partials/category/watch.tpl -->
18
19
  </div>
19
20
  </div>
20
- <div class="col-2">
21
- <!-- IMPORT partials/category/watch.tpl -->
22
- </div>
21
+ <hr />
23
22
  </li>
package/templates/partials/groups/admin.tpl CHANGED
@@ -1,201 +1,96 @@
1
- <div class="card mb-3">
2
- <div class="card-header">
3
- <div class="fs-5">
4
- <i class="fa fa-clock-o"></i> [[groups:details.pending]]
5
- <!-- IF group.pending.length -->
6
- <div class="btn-group float-end">
7
- <button type="button" class="btn btn-outline-secondary btn-sm dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
8
- [[global:more]] <span class="caret"></span>
9
- </button>
10
- <ul class="dropdown-menu" role="menu">
11
- <li><a class="dropdown-item" href="#" data-action="acceptAll" role="menuitem">[[groups:pending.accept-all]]</a></li>
12
- <li><a class="dropdown-item" href="#" data-action="rejectAll" role="menuitem">[[groups:pending.reject-all]]</a></li>
13
- </ul>
14
- </div>
15
- <!-- ENDIF group.pending.length -->
16
- </div>
1
+ <form component="groups/settings" role="form">
2
+ <div class="mb-3">
3
+ <label class="form-label" for="name">[[groups:details.group-name]]</label>
4
+ <input <!-- IF group.system -->readonly<!-- ENDIF group.system --> class="form-control" name="name" id="name" type="text" value="{group.displayName}" />
17
5
  </div>
18
- <div class="card-body">
19
- <div component="groups/pending/alert" class="alert alert-info {{{ if group.pending.length }}}hidden{{{ end }}}">[[groups:pending.none]]</div>
20
-
21
- <table component="groups/pending" class="table table-striped table-hover">
22
- <tbody>
23
- {{{each group.pending}}}
24
- <tr data-uid="{group.pending.uid}">
25
- <td class="p-2">
26
- <a href="{config.relative_path}/user/{group.pending.userslug}">{buildAvatar(group.pending, "24px", true)}</a>
27
- </td>
28
- <td class="member-name p-2">
29
- <a href="{config.relative_path}/user/{group.pending.userslug}">{group.pending.username}</a>
30
- </td>
31
- <td class="p-2">
32
- <div class="btn-group float-end">
33
- <button type="button" class="btn btn-outline-secondary btn-sm dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
34
- [[global:more]] <span class="caret"></span>
35
- </button>
36
- <ul class="dropdown-menu" role="menu">
37
- <li><a class="dropdown-item" href="#" data-action="accept" role="menuitem">[[groups:pending.accept]]</a></li>
38
- <li><a class="dropdown-item" href="#" data-action="reject" role="menuitem">[[groups:pending.reject]]</a></li>
39
- </ul>
40
- </div>
41
- </td>
42
- </tr>
43
- {{{end}}}
44
- </tbody>
45
- </table>
6
+ <div class="mb-3">
7
+ <label class="form-label" for="description">[[groups:details.description]]</label>
8
+ <textarea class="form-control" name="description" id="description" type="text" maxlength="255">{group.description}</textarea>
46
9
  </div>
47
- </div>
48
- <div class="card mb-3">
49
- <div class="card-header">
50
- <span class="fs-5">
51
- <i class="fa fa-gift"></i> [[groups:details.invited]]
52
- </span>
53
- </div>
54
- <div class="card-body">
55
- <div class="input-group mb-2">
56
- <input class="form-control" type="text" component="groups/members/invite" placeholder="[[groups:invited.search]]"/>
57
- <span class="input-group-text search-button"><i class="fa fa-search"></i></span>
58
- </div>
59
10
 
60
- <div class="mb-2">
61
- <textarea class="form-control" component="groups/members/bulk-invite" placeholder="[[groups:bulk-invite-instructions]]"></textarea>
62
- </div>
63
-
64
- <div class="mb-2 clearfix">
65
- <button class="btn btn-outline-secondary btn-sm float-end" component="groups/members/bulk-invite-button">[[groups:bulk-invite]]</button>
11
+ <hr />
12
+ <div class="mb-3">
13
+ <label class="form-label" for="memberPostCids">[[groups:details.member-post-cids]]</label>
14
+ <div class="row">
15
+ <div class="col-md-6">
16
+ <input id="memberPostCids" type="text" class="form-control" value="{group.memberPostCids}">
17
+ </div>
18
+ <div class="col-md-6 member-post-cids-selector">
19
+ <!-- IMPORT partials/category/selector-dropdown-left.tpl -->
20
+ </div>
66
21
  </div>
67
-
68
- <div component="groups/invited/alert" class="alert alert-info {{{ if group.invited.length }}}hidden{{{ end }}}">[[groups:invited.none]]</div>
69
-
70
- <table component="groups/invited" class="table table-striped table-hover">
71
- <tbody>
72
- {{{ each group.invited }}}
73
- <tr data-uid="{group.invited.uid}">
74
- <td class="p-2">
75
- <a href="{config.relative_path}/user/{group.invited.userslug}">{buildAvatar(group.invited, "24px", true)}</a>
76
- </td>
77
- <td class="member-name p-2">
78
- <a href="{config.relative_path}/user/{group.invited.userslug}">{group.invited.username}</a>
79
- </td>
80
- <td class="p-2">
81
- <div class="btn-group float-end">
82
- <button type="button" class="btn btn-outline-secondary btn-sm dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
83
- [[global:more]] <span class="caret"></span>
84
- </button>
85
- <ul class="dropdown-menu" role="menu">
86
- <li><a class="dropdown-item" href="#" data-action="rescindInvite" role="menuitem">[[groups:invited.uninvite]]</a></li>
87
- </ul>
88
- </div>
89
- </td>
90
- </tr>
91
- {{{end}}}
92
- </tbody>
93
- </table>
94
22
  </div>
95
- </div>
96
23
 
97
- <div class="card mb-3">
98
- <div class="card-header pointer" data-bs-toggle="collapse" data-bs-target=".options">
99
- <span class="fs-5">
100
- <i class="fa fa-caret-down float-end"></i>
101
- <i class="fa fa-cogs"></i> [[groups:details.owner-options]]
102
- </span>
24
+ <hr />
25
+
26
+ <div class="mb-3 user-title-option">
27
+ <label class="form-label" for="userTitle">[[groups:details.badge-text]]</label>
28
+ <div class="d-flex gap-2">
29
+ <input component="groups/userTitleOption" class="form-control" name="userTitle" id="userTitle" type="text" maxlength="40" value="{group.userTitleEscaped}"<!-- IF !group.userTitleEnabled --> disabled<!-- ENDIF !group.userTitleEnabled --> />
30
+ <button component="groups/userTitleOption" type="button" class="btn btn-outline-secondary btn-sm text-nowrap" data-action="icon-select"<!-- IF !group.userTitleEnabled --> disabled<!-- ENDIF !group.userTitleEnabled -->>[[groups:details.change-icon]]</button>
31
+ </div>
103
32
  </div>
104
33
 
105
- <div class="card-body options collapse">
106
- <form component="groups/settings" role="form">
107
- <div class="mb-3">
108
- <label class="form-label" for="name">[[groups:details.group-name]]</label>
109
- <input <!-- IF group.system -->readonly<!-- ENDIF group.system --> class="form-control" name="name" id="name" type="text" value="{group.displayName}" />
34
+ <div class="mb-3 user-title-option">
35
+ <div class="d-flex align-items-center gap-3">
36
+ <label class="form-label mb-0">[[groups:details.badge-preview]]</label>
37
+ <span class="badge rounded-1 text-uppercase text-truncate rounded-1 {{{ if !group.userTitleEnabled }}} hide{{{ end }}}" style="max-width:150px; color: {group.textColor}; background-color: {group.labelColor}"><i class="fa{{{ if group.icon }}} {group.icon}{{{ if group.userTitle}}} me-1{{{ end }}}{{{ end }}}"></i><span class="badge-text">{{{ if group.userTitle }}}{group.userTitle}{{{ end }}}</span></span>
38
+ </div>
39
+ <hr/>
40
+ <div class="d-flex flex-column gap-2">
41
+ <div class="d-flex align-items-center gap-2">
42
+ <label class="form-label mb-0" for="labelColor" class="badge-color-label">[[groups:details.change-label-colour]]</label>
43
+ <input component="groups/userTitleOption" type="color" name="labelColor" id="labelColor" value="<!-- IF group.labelColor -->{group.labelColor}<!-- ENDIF group.labelColor -->" />
110
44
  </div>
111
- <div class="mb-3">
112
- <label class="form-label" for="description">[[groups:details.description]]</label>
113
- <textarea class="form-control" name="description" id="description" type="text" maxlength="255">{group.description}</textarea>
45
+ <div class="d-flex align-items-center gap-2">
46
+ <label class="form-label mb-0" for="textColor" class="badge-color-label">[[groups:details.change-text-colour]]</label>
47
+ <input component="groups/userTitleOption" type="color" name="textColor" id="textColor" value="<!-- IF group.textColor -->{group.textColor}<!-- ENDIF group.textColor -->" />
114
48
  </div>
115
-
116
- <hr />
117
- <div class="mb-3">
118
- <label class="form-label" for="memberPostCids">[[groups:details.member-post-cids]]</label>
119
- <div class="row">
120
- <div class="col-md-6">
121
- <input id="memberPostCids" type="text" class="form-control" value="{group.memberPostCids}">
122
- </div>
123
- <div class="col-md-6 member-post-cids-selector">
124
- <!-- IMPORT partials/category/selector-dropdown-left.tpl -->
125
- </div>
126
- </div>
127
- </div>
128
-
129
- <hr />
130
-
131
- <div class="mb-3 user-title-option">
132
- <label class="form-label" for="userTitle">[[groups:details.badge-text]]</label>
133
- <div class="d-flex gap-2">
134
- <input component="groups/userTitleOption" class="form-control" name="userTitle" id="userTitle" type="text" maxlength="40" value="{group.userTitleEscaped}"<!-- IF !group.userTitleEnabled --> disabled<!-- ENDIF !group.userTitleEnabled --> />
135
- <button component="groups/userTitleOption" type="button" class="btn btn-outline-secondary btn-sm text-nowrap" data-action="icon-select"<!-- IF !group.userTitleEnabled --> disabled<!-- ENDIF !group.userTitleEnabled -->>[[groups:details.change-icon]]</button>
136
- </div>
137
- </div>
138
-
139
- <div class="mb-3 user-title-option">
140
- <div class="d-flex align-items-center gap-3">
141
- <label class="form-label mb-0">[[groups:details.badge-preview]]</label>
142
- <span class="badge rounded-1 text-uppercase text-truncate rounded-1 {{{ if !group.userTitleEnabled }}} hide{{{ end }}}" style="max-width:150px; color: {group.textColor}; background-color: {group.labelColor}"><i class="fa{{{ if group.icon }}} {group.icon}{{{ if group.userTitle}}} me-1{{{ end }}}{{{ end }}}"></i><span class="badge-text">{{{ if group.userTitle }}}{group.userTitle}{{{ end }}}</span></span>
143
- </div>
144
- <hr/>
145
- <div class="d-flex flex-column gap-2">
146
- <div class="d-flex align-items-center gap-2">
147
- <label class="form-label mb-0" for="labelColor" class="badge-color-label">[[groups:details.change-label-colour]]</label>
148
- <input component="groups/userTitleOption" type="color" name="labelColor" id="labelColor" value="<!-- IF group.labelColor -->{group.labelColor}<!-- ENDIF group.labelColor -->" />
149
- </div>
150
- <div class="d-flex align-items-center gap-2">
151
- <label class="form-label mb-0" for="textColor" class="badge-color-label">[[groups:details.change-text-colour]]</label>
152
- <input component="groups/userTitleOption" type="color" name="textColor" id="textColor" value="<!-- IF group.textColor -->{group.textColor}<!-- ENDIF group.textColor -->" />
153
- </div>
154
- <input type="hidden" name="icon" value="<!-- IF group.icon -->{group.icon}<!-- ENDIF group.icon -->" />
155
- </div>
156
- <div id="icons" class="hidden">
157
- <div class="icon-container">
158
- <div class="row nbb-fa-icons">
159
- <!-- IMPORT partials/fontawesome.tpl -->
160
- </div>
161
- </div>
49
+ <input type="hidden" name="icon" value="<!-- IF group.icon -->{group.icon}<!-- ENDIF group.icon -->" />
50
+ </div>
51
+ <div id="icons" class="hidden">
52
+ <div class="icon-container">
53
+ <div class="row nbb-fa-icons">
54
+ <!-- IMPORT partials/fontawesome.tpl -->
162
55
  </div>
163
56
  </div>
164
- <hr />
165
- <div class="form-check">
166
- <label class="form-check-label" for="userTitleEnabled">[[groups:details.userTitleEnabled]]</label>
167
- <input class="form-check-input" name="userTitleEnabled" id="userTitleEnabled" type="checkbox"<!-- IF group.userTitleEnabled --> checked<!-- ENDIF group.userTitleEnabled -->>
168
- </div>
169
- <div class="form-check">
170
- <label class="form-check-label" for="private">[[groups:details.private]]</label>
171
- <input class="form-check-input" name="private" id="private" type="checkbox"<!-- IF group.private --> checked<!-- ENDIF group.private -->>
172
- <!-- IF !allowPrivateGroups -->
173
- <p class="form-text">
174
- [[groups:details.private-system-help]]
175
- </p>
176
- <!-- ENDIF !allowPrivateGroups -->
177
- <p class="form-text">
178
- [[groups:details.private-help]]
179
- </p>
180
- </div>
181
- <div class="form-check">
182
- <label class="form-check-label" for="disableJoinRequests">[[groups:details.disableJoinRequests]]</label>
183
- <input class="form-check-input" name="disableJoinRequests" id="disableJoinRequests" type="checkbox"<!-- IF group.disableJoinRequests --> checked<!-- ENDIF group.disableJoinRequests -->>
184
- </div>
185
- <div class="form-check">
186
- <label class="form-check-label" for="disableLeave">[[groups:details.disableLeave]]</label>
187
- <input class="form-check-input" name="disableLeave" id="disableLeave" type="checkbox"{{{if group.disableLeave}}} checked{{{end}}}>
188
- </div>
189
- <div class="form-check">
190
- <label class="form-check-label" for="hidden">[[groups:details.hidden]]</label>
191
- <input class="form-check-input" name="hidden" id="hidden" type="checkbox"<!-- IF group.hidden --> checked<!-- ENDIF group.hidden -->>
192
- <p class="form-text">
193
- [[groups:details.hidden-help]]
194
- </p>
195
- </div>
57
+ </div>
58
+ </div>
59
+ <hr />
60
+ <div class="form-check">
61
+ <label class="form-check-label" for="userTitleEnabled">[[groups:details.userTitleEnabled]]</label>
62
+ <input class="form-check-input" name="userTitleEnabled" id="userTitleEnabled" type="checkbox"<!-- IF group.userTitleEnabled --> checked<!-- ENDIF group.userTitleEnabled -->>
63
+ </div>
64
+ <div class="form-check">
65
+ <label class="form-check-label" for="private">[[groups:details.private]]</label>
66
+ <input class="form-check-input" name="private" id="private" type="checkbox"<!-- IF group.private --> checked<!-- ENDIF group.private -->>
67
+ <!-- IF !allowPrivateGroups -->
68
+ <p class="form-text">
69
+ [[groups:details.private-system-help]]
70
+ </p>
71
+ <!-- ENDIF !allowPrivateGroups -->
72
+ <p class="form-text">
73
+ [[groups:details.private-help]]
74
+ </p>
75
+ </div>
76
+ <div class="form-check">
77
+ <label class="form-check-label" for="disableJoinRequests">[[groups:details.disableJoinRequests]]</label>
78
+ <input class="form-check-input" name="disableJoinRequests" id="disableJoinRequests" type="checkbox"<!-- IF group.disableJoinRequests --> checked<!-- ENDIF group.disableJoinRequests -->>
79
+ </div>
80
+ <div class="form-check">
81
+ <label class="form-check-label" for="disableLeave">[[groups:details.disableLeave]]</label>
82
+ <input class="form-check-input" name="disableLeave" id="disableLeave" type="checkbox"{{{if group.disableLeave}}} checked{{{end}}}>
83
+ </div>
84
+ <div class="form-check">
85
+ <label class="form-check-label" for="hidden">[[groups:details.hidden]]</label>
86
+ <input class="form-check-input" name="hidden" id="hidden" type="checkbox"<!-- IF group.hidden --> checked<!-- ENDIF group.hidden -->>
87
+ <p class="form-text">
88
+ [[groups:details.hidden-help]]
89
+ </p>
90
+ </div>
196
91
 
197
- <button class="btn btn-link text-danger float-end" type="button" data-action="delete">[[groups:details.delete-group]]</button>
198
- <button class="btn btn-primary" type="button" data-action="update">[[global:save-changes]]</button>
199
- </form>
92
+ <div class="d-flex justify-content-end gap-2">
93
+ <button class="btn btn-link text-danger" type="button" data-action="delete">[[groups:details.delete-group]]</button>
94
+ <button class="btn btn-primary" type="button" data-action="update">[[global:save-changes]]</button>
200
95
  </div>
201
- </div>
96
+ </form>
package/templates/partials/groups/invited.tpl ADDED
@@ -0,0 +1,33 @@
1
+ <label class="text-xs text-muted">[[groups:invited.search]]</label>
2
+ <div class="input-group mb-2">
3
+ <input class="form-control" type="text" component="groups/members/invite"/>
4
+ <span class="input-group-text search-button"><i class="fa fa-search"></i></span>
5
+ </div>
6
+
7
+ <div class="mb-2">
8
+ <label class="text-xs text-muted">[[groups:bulk-invite-instructions]]</label>
9
+ <textarea class="form-control" component="groups/members/bulk-invite"></textarea>
10
+ </div>
11
+
12
+ <div class="mb-2 clearfix">
13
+ <button type="button" class="btn btn-primary btn-sm float-end" component="groups/members/bulk-invite-button">[[groups:bulk-invite]]</button>
14
+ </div>
15
+
16
+ <div style="max-height: 500px; overflow: auto;">
17
+ <div component="groups/invited/alert" class="alert alert-info {{{ if group.invited.length }}}hidden{{{ end }}}">[[groups:invited.none]]</div>
18
+ <table component="groups/invited" class="table table-hover">
19
+ <tbody>
20
+ {{{ each group.invited }}}
21
+ <tr data-uid="{group.invited.uid}" class="align-middle">
22
+ <td class="member-name p-2 d-flex align-items-center justify-content-between">
23
+ <div class="d-flex align-items-center gap-2">
24
+ <a class="text-decoration-none" href="{config.relative_path}/user/{group.invited.userslug}">{buildAvatar(group.invited, "24px", true)}</a>
25
+ <a href="{config.relative_path}/user/{group.invited.userslug}">{group.invited.username}</a>
26
+ </div>
27
+ <button class="btn btn-outline-secondary btn-sm text-nowrap" data-action="rescindInvite">[[groups:invited.uninvite]]</button>
28
+ </td>
29
+ </tr>
30
+ {{{ end }}}
31
+ </tbody>
32
+ </table>
33
+ </div>
package/templates/partials/groups/list.tpl CHANGED
@@ -1,21 +1,21 @@
1
- {{{each groups}}}
2
- <div class="col-lg-4 col-md-6 col-sm-12 mb-3" component="groups/summary" data-slug="{groups.slug}">
3
- <div class="card h-100">
4
- <a href="{config.relative_path}/groups/{groups.slug}" class="card-header list-cover" style="{{{ if groups.cover:thumb:url }}}background-image: url({./cover:thumb:url});background-size: cover; min-height: 125px; background-position: {./cover:position}{{{ end }}}">
5
- <h5 class="card-title">{groups.displayName} <small>{groups.memberCount}</small></h5>
6
- </a>
7
- <div class="card-body">
8
- <ul class="members">
9
- {{{each groups.members}}}
10
- <li>
11
- <a href="{config.relative_path}/user/{groups.members.userslug}">{buildAvatar(groups.members, "24px", true)}</a>
12
- </li>
13
- {{{end}}}
14
- {{{ if groups.truncated }}}
15
- <li class="truncated"><i class="fa fa-ellipsis-h"></i></li>
16
- {{{ end }}}
17
- </ul>
18
- </div>
1
+ {{{each groups}}}
2
+ <div class="col-lg-4 col-md-6 col-sm-12 mb-3" component="groups/summary" data-slug="{groups.slug}">
3
+ <div class="card h-100">
4
+ <a href="{config.relative_path}/groups/{groups.slug}" class="card-header list-cover" style="{{{ if groups.cover:thumb:url }}}background-image: url({./cover:thumb:url});background-size: cover; min-height: 125px; background-position: {./cover:position}{{{ end }}}">
5
+ <h5 class="card-title d-inline-block mw-100 px-2 py-1 text-truncate text-capitalize fw-bold rounded-1" style="color: white;background-color: rgba(0,0,0,0.5);">{groups.displayName} <small>{groups.memberCount}</small></h5>
6
+ </a>
7
+ <div class="card-body">
8
+ <p class="text-muted">
9
+ {./description}
10
+ </p>
11
+ <ul class="members list-unstyled d-flex align-items-center gap-2 flex-wrap">
12
+ {{{each groups.members}}}
13
+ <li>
14
+ <a href="{config.relative_path}/user/{groups.members.userslug}">{buildAvatar(groups.members, "24px", true)}</a>
15
+ </li>
16
+ {{{end}}}
17
+ </ul>
19
18
  </div>
20
19
  </div>
21
- {{{end}}}
20
+ </div>
21
+ {{{end}}}
package/templates/partials/groups/pending.tpl ADDED
@@ -0,0 +1,28 @@
1
+ {{{ if group.pending.length }}}
2
+ <div class="d-flex justify-content-end gap-2 mb-3">
3
+ <button class="btn btn-danger btn-sm" data-action="rejectAll">[[groups:pending.reject-all]]</button>
4
+ <button class="btn btn-success btn-sm" data-action="acceptAll">[[groups:pending.accept-all]]</button>
5
+ </div>
6
+ {{{ end }}}
7
+
8
+ <div style="max-height: 500px;overflow: auto;">
9
+ <div component="groups/pending/alert" class="alert alert-info {{{ if group.pending.length }}}hidden{{{ end }}}">[[groups:pending.none]]</div>
10
+ <table component="groups/pending" class="table table-hover">
11
+ <tbody>
12
+ {{{ each group.pending }}}
13
+ <tr data-uid="{group.pending.uid}" class="align-middle">
14
+ <td class="member-name p-2 d-flex align-items-center justify-content-between">
15
+ <div class="d-flex gap-2">
16
+ <a class="text-decoration-none" href="{config.relative_path}/user/{group.pending.userslug}">{buildAvatar(group.pending, "24px", true)}</a>
17
+ <a href="{config.relative_path}/user/{group.pending.userslug}">{group.pending.username}</a>
18
+ </div>
19
+ <div class="d-flex gap-2">
20
+ <button class="btn btn-danger btn-sm" data-action="reject">[[groups:pending.reject]]</a></li>
21
+ <button class="btn btn-success btn-sm" data-action="accept">[[groups:pending.accept]]</a></li>
22
+ </div>
23
+ </td>
24
+ </tr>
25
+ {{{ end }}}
26
+ </tbody>
27
+ </table>
28
+ </div>