nodebb-theme-harmony 2.0.0-pre.9 → 2.0.1

package/templates/account/info.tpl

@@ -1,202 +1,271 @@
-<!-- IMPORT partials/account/header.tpl -->
-
-{{{ if sessions.length }}}
-<div class="mb-3">
-	<h4>[[global:sessions]]</h4>
-	<ul class="list-group" component="user/sessions">
-		<!-- IMPORT partials/account/session-list.tpl -->
-	</ul>
-</div>
-{{{ end }}}
-
-<div class="row">
-	<div class="col-sm-6 mb-3">
-		<div class="card mb-3">
-			<h5 class="card-header">
-				[[global:recentips]]
-			</h5>
-			<div class="card-body">
-				<ul>
-					{{{each ips}}}
-					<li>{@value}</li>
-					{{{end}}}
-				</ul>
-			</div>
-		</div>
-
-		<div class="card mb-3">
-			<h5 class="card-header">
-				[[user:info.username-history]]
-			</h5>
-			<div class="card-body">
-				<ul class="list-group">
-					{{{each usernames}}}
-					<li class="list-group-item">
-						{../value}
-						<small class="float-end"><span class="timeago" title="{../timestampISO}"></span></small>
-					</li>
-					{{{end}}}
-				</ul>
-			</div>
-		</div>
-
-		<div class="card">
-			<h5 class="card-header">
-				[[user:info.email-history]]
-			</h5>
-			<div class="card-body">
-				<ul class="list-group">
-					{{{each emails}}}
-					<li class="list-group-item">
-						{../value}
-						<small class="float-end"><span class="timeago" title="{../timestampISO}"></span></small>
-					</li>
-					{{{end}}}
-				</ul>
-			</div>
-		</div>
-	</div>
-	<div class="col-sm-6 mb-3">
-		<div class="card mb-3">
-			<h5 class="card-header">
-				[[user:info.latest-flags]]
-			</h5>
-			<div class="card-body">
-				{{{ if history.flags.length }}}
-				<ul class="recent-flags list-unstyled">
-					{{{ each history.flags }}}
-					<li>
-						<p>
-							{{{ if history.flags.targetPurged }}}
-							<div>[[flags:target-purged]]</div>
-							{{{ else }}}
-							<a class="title" href="{config.relative_path}/post/{./pid}">{./title}</a><br />
-							{{{ end }}}
-							<span class="timestamp">[[flags:flagged-timeago-readable, {./timestampISO}, {./timestampReadable}]]</span>
-						</p>
-					</li>
-					{{{ end }}}
-				</ul>
-				{{{ else }}}
-				<div class="alert alert-success">[[user:info.no-flags]]</div>
-				{{{ end }}}
-			</div>
-		</div>
-
-		<div class="card mb-3">
-			<h5 class="card-header">
-				[[user:info.ban-history]]
-
-				{{{ if (!banned && !isSelf) }}}
-				<button class="btn btn-sm float-end btn-danger" component="account/ban">[[user:ban-account]]</button>
-				{{{ end }}}
-				{{{ if (banned && !isSelf) }}}
-				<button class="btn btn-sm float-end btn-success" component="account/unban">[[user:unban-account]]</button>
-				{{{ end }}}
-			</h5>
-			<div class="card-body">
-				{{{ if history.bans.length }}}
-				<ul class="ban-history list-unstyled">
-					{{{each history.bans}}}
-					<li>
-						<p>
-							<a href="{config.relative_path}/user/{./user.userslug}">{buildAvatar(./user, "24px", true)}</a>
-							<strong>
-								<a href="{{{ if ./user.userslug }}}{config.relative_path}/user/{./user.userslug}{{{ else }}}#{{{ end }}}" itemprop="author" data-username="{./user.username}" data-uid="{./user.uid}">{./user.username}</a>
-							</strong>
-							<span class="timestamp timeago" title="{./timestampISO}"></span> &mdash; {./timestampReadable}<br />
-							{{{ if ./until }}}
-							<span class="expiry">[[user:info.banned-until, {./untilReadable}]]</span><br />
-							{{{ else }}}
-							<span class="expiry">[[user:info.banned-permanently]]</span><br />
-							{{{ end }}}
-							<span class="reason"><strong>[[user:info.banned-reason-label]]</strong>: {./reason}</span>
-						</p>
-					</li>
-					{{{end}}}
-				</ul>
-				{{{ else }}}
-				<div class="alert alert-success">[[user:info.no-ban-history]]</div>
-				{{{ end }}}
-			</div>
-		</div>
-
-		<div class="card mb-3">
-			<h5 class="card-header">
-				[[user:info.mute-history]]
-
-				{{{ if !muted }}}
-				{{{ if !isSelf }}}
-				<button class="btn btn-sm float-end btn-danger" component="account/mute">[[user:mute-account]]</button>
-				{{{ end }}}
-				{{{ else }}}
-				{{{ if !isSelf }}}
-				<button class="btn btn-sm float-end btn-success" component="account/unmute">[[user:unmute-account]]</button>
-				{{{ end }}}
-				{{{ end }}}
-			</h5>
-			<div class="card-body">
-				{{{ if history.mutes.length }}}
-				<ul class="ban-history list-unstyled">
-					{{{ each history.mutes }}}
-					<li>
-						<p>
-							<a href="{config.relative_path}/user/{./user.userslug}">{buildAvatar(./user, "24px", true)}</a>
-							<strong>
-								<a href="{{{ if ./user.userslug }}}{config.relative_path}/user/{./user.userslug}{{{ else }}}#{{{ end }}}" itemprop="author" data-username="{./user.username}" data-uid="{./user.uid}">{./user.username}</a>
-							</strong>
-							<span class="timestamp timeago" title="{./timestampISO}"></span> &mdash; {./timestampReadable}<br />
-							{{{ if ./until }}}
-							<span class="expiry">[[user:info.muted-until, {./untilReadable}]]</span><br />
-							{{{ end }}}
-
-							<span class="reason"><strong>[[user:info.banned-reason-label]]</strong>: {./reason}</span>
-						</p>
-					</li>
-					{{{ end }}}
-				</ul>
-				{{{ else }}}
-				<div class="alert alert-success">[[user:info.no-mute-history]]</div>
-				{{{ end }}}
-			</div>
-		</div>
-
-		{{{ if isAdminOrGlobalModerator }}}
-		<div class="card">
-			<h5 class="card-header">
-				[[user:info.moderation-note]]
-			</h5>
-			<div class="card-body">
-				<textarea component="account/moderation-note" class="form-control mb-3" aria-label="[[user:info.moderation-note]]"></textarea>
-
-				<button class="btn btn-sm float-end btn-success" component="account/save-moderation-note">[[user:info.moderation-note.add]]</button>
-				<br/>
-				<div component="account/moderation-note/list">
-					{{{ each moderationNotes }}}
-					<hr/>
-
-					<div>
-						<a href="{{{ if ./user.userslug }}}{config.relative_path}/user/{./user.userslug}{{{ else }}}#{{{ end }}}">{buildAvatar(./user, "24px", true)}</a>
-						<strong>
-							<a href="{{{ if ./user.userslug }}}{config.relative_path}/user/{./user.userslug}{{{ else }}}#{{{ end }}}" itemprop="author" data-username="{./user.username}" data-uid="{./user.uid}">{./user.username}</a>
-						</strong>
-
-						<div class="visible-xs-inline-block visible-sm-inline-block visible-md-inline-block visible-lg-inline-block">
-							<span class="timeago" title="{./timestampISO}"></span>
-						</div>
-						<br />
-
-						<div class="content">
-							{./note}
-						</div>
-					</div>
-					{{{ end }}}
-				</div>
-				<!-- IMPORT partials/paginator.tpl -->
-			</div>
-		</div>
-		{{{ end }}}
-	</div>
-</div>
-
+<!-- IMPORT partials/account/header.tpl -->
+
+{{{ if sessions.length }}}
+<div class="mb-3">
+	<h4>[[global:sessions]]</h4>
+	<ul class="list-group" component="user/sessions">
+		<!-- IMPORT partials/account/session-list.tpl -->
+	</ul>
+</div>
+{{{ end }}}
+
+<div class="row">
+	<div class="col-sm-6 mb-3">
+		<div class="card mb-3">
+			<h5 class="card-header">
+				[[global:recentips]]
+			</h5>
+			<div class="card-body">
+				<ul>
+					{{{each ips}}}
+					<li>{@value}</li>
+					{{{end}}}
+				</ul>
+			</div>
+		</div>
+
+		<div class="card mb-3">
+			<h5 class="card-header">
+				[[user:info.username-history]]
+			</h5>
+			<div class="card-body">
+				<ul class="list-unstyled mb-0">
+					{{{ each usernames }}}
+					<li class="d-flex justify-content-between mb-1">
+						<span class="text-sm">{./value}</span>
+
+						<div>
+							{{{ if ./byUid }}}
+							<a class="lh-1" href="{{{ if ./byUser.userslug }}}{config.relative_path}/user/{./byUser.userslug}{{{ else }}}#{{{ end }}}">
+							{buildAvatar(./byUser, "18px", true)}</a>
+							{{{ end }}}
+							<span class="timeago text-sm lh-1 align-middle" title="{./timestampISO}"></span>
+						</div>
+					</li>
+					{{{ end }}}
+				</ul>
+			</div>
+		</div>
+
+		<div class="card mb-3">
+			<h5 class="card-header">
+				[[user:info.email-history]]
+			</h5>
+			<div class="card-body">
+				<ul class="list-unstyled mb-0">
+					{{{ each emails }}}
+					<li class="d-flex justify-content-between mb-1">
+						<span class="text-sm">{./value}</span>
+						<div>
+							{{{ if ./byUid }}}
+							<a class="lh-1" href="{{{ if ./byUser.userslug }}}{config.relative_path}/user/{./byUser.userslug}{{{ else }}}#{{{ end }}}">
+							{buildAvatar(./byUser, "18px", true)}</a>
+							{{{ end }}}
+							<span class="timeago text-sm lh-1 align-middle" title="{./timestampISO}"></span>
+						</div>
+					</li>
+					{{{ end }}}
+				</ul>
+			</div>
+		</div>
+
+		{{{ if isAdminOrGlobalModerator }}}
+		<div class="card">
+			<h5 class="card-header">
+				[[user:info.moderation-note]]
+			</h5>
+			<div class="card-body">
+				<textarea component="account/moderation-note" class="form-control mb-3" aria-label="[[user:info.moderation-note]]"></textarea>
+
+				<button class="btn btn-sm float-end btn-success" component="account/save-moderation-note">[[user:info.moderation-note.add]]</button>
+				<br/>
+				<div component="account/moderation-note/list">
+					{{{ each moderationNotes }}}
+					<hr/>
+
+					<div data-id="{./id}">
+						<div class="mb-1">
+							<a href="{{{ if ./user.userslug }}}{config.relative_path}/user/{./user.userslug}{{{ else }}}#{{{ end }}}">{buildAvatar(./user, "24px", true)}</a>
+
+							<a href="{{{ if ./user.userslug }}}{config.relative_path}/user/{./user.userslug}{{{ else }}}#{{{ end }}}" class="fw-bold" itemprop="author" data-username="{./user.username}" data-uid="{./user.uid}">{./user.username}</a>
+
+							<span class="timeago" title="{./timestampISO}"></span>
+						</div>
+
+
+						<div component="account/moderation-note/content-area" class="d-flex flex-column">
+							<div class="content">
+								{./note}
+							</div>
+							<button component="account/moderation-note/edit" class="btn btn-sm btn-link align-self-end">[[topic:edit]]</button>
+						</div>
+
+						<div component="account/moderation-note/edit-area" class="d-flex flex-column gap-2">
+							<textarea class="form-control w-100 overflow-hidden">{./rawNote}</textarea>
+							<div class="align-self-end">
+								<button component="account/moderation-note/cancel-edit" class="btn btn-sm btn-link text-danger align-self-end">[[global:cancel]]</button>
+								<button component="account/moderation-note/save-edit" class="btn btn-sm btn-primary align-self-end">[[global:save]]</button>
+							</div>
+						</div>
+					</div>
+					{{{ end }}}
+				</div>
+				<!-- IMPORT partials/paginator.tpl -->
+			</div>
+		</div>
+		{{{ end }}}
+	</div>
+	<div class="col-sm-6 mb-3">
+		<div class="card mb-3">
+			<h5 class="card-header">
+				[[user:info.latest-flags]]
+			</h5>
+			<div class="card-body">
+				{{{ if history.flags.length }}}
+				<ul class="recent-flags list-unstyled">
+					{{{ each history.flags }}}
+					<li class="mb-4 border-bottom">
+						<div class="mb-1 d-flex align-items-center justify-content-between">
+							<div>
+								{{{ if (./type == "user")}}}
+								<span class="badge text-bg-info">[[user:info.profile]]</span>
+								{{{ else }}}
+								<span class="badge text-bg-info">[[user:info.post]]</span>
+								{{{ end }}}
+								<span class="timestamp timeago" title="{./timestampISO}"></span>
+							</div>
+
+							<a href="{config.relative_path}/flags/{./flagId}" class="badge badge border border-gray-300 text-body">[[user:info.view-flag]]</a>
+						</div>
+
+						{{{ if (./type == "post") }}}
+						<p class="mb-1">
+							{{{ if history.flags.targetPurged }}}
+							<div>[[flags:target-purged]]</div>
+							{{{ else }}}
+							<a class="title" href="{config.relative_path}/post/{./pid}">{./title}</a>
+							{{{ end }}}
+						</p>
+						{{{ end }}}
+
+						<div class="d-flex gap-2 align-items-center mb-3">
+							<span class="text-sm">[[user:info.reported-by]]</span>
+							<div class="d-flex text-nowrap">
+								{{{ each ./reports }}}
+								<a style="width: 18px; z-index: 3;" class="text-decoration-none" href="{config.relative_path}/user/{./reporter.userslug}">{buildAvatar(./reporter, "24px", true)}</a>
+								{{{ end }}}
+							</div>
+						</div>
+					</li>
+					{{{ end }}}
+				</ul>
+				{{{ else }}}
+				<div class="alert alert-success">[[user:info.no-flags]]</div>
+				{{{ end }}}
+			</div>
+		</div>
+
+		<div class="card mb-3">
+			<h5 class="card-header">
+				[[user:info.ban-history]]
+
+				{{{ if (!banned && !isSelf) }}}
+				<button class="btn btn-sm float-end btn-danger" component="account/ban">[[user:ban-account]]</button>
+				{{{ end }}}
+				{{{ if (banned && !isSelf) }}}
+				<button class="btn btn-sm float-end btn-success" component="account/unban">[[user:unban-account]]</button>
+				{{{ end }}}
+			</h5>
+			<div class="card-body">
+				{{{ if history.bans.length }}}
+				<ul class="ban-history list-unstyled">
+					{{{ each history.bans }}}
+					<li class="mb-4 border-bottom">
+						<div class="mb-1 d-flex align-items-center justify-content-between">
+							<div>
+								<a href="{config.relative_path}/user/{./user.userslug}">{buildAvatar(./user, "24px", true)}</a>
+								<strong>
+									<a href="{{{ if ./user.userslug }}}{config.relative_path}/user/{./user.userslug}{{{ else }}}#{{{ end }}}" itemprop="author" data-username="{./user.username}" data-uid="{./user.uid}">{./user.username}</a>
+								</strong>
+								<span class="timestamp timeago" title="{./timestampISO}"></span>
+							</div>
+							{{{ if (./type != "unban") }}}
+							<span class="badge text-bg-danger">[[user:banned]]</span>
+							{{{ else }}}
+							<span class="badge text-bg-success">[[user:unbanned]]</span>
+							{{{ end }}}
+						</div>
+						<p class="mb-1">
+							<span class="reason">[[user:info.banned-reason-label]]: <strong>{./reason}</strong></span>
+						</p>
+						<p>
+							{{{ if ./until }}}
+							<span class="expiry">[[user:info.banned-until, {isoTimeToLocaleString(./untilISO, config.userLang)}]]</span>
+							{{{ else }}}
+							{{{ if (./type != "unban") }}}
+							<span class="expiry">[[user:info.banned-permanently]]</span>
+							{{{ end }}}
+							{{{ end }}}
+						</p>
+					</li>
+					{{{ end }}}
+				</ul>
+				{{{ else }}}
+				<div class="alert alert-success">[[user:info.no-ban-history]]</div>
+				{{{ end }}}
+			</div>
+		</div>
+
+		<div class="card mb-3">
+			<h5 class="card-header">
+				[[user:info.mute-history]]
+
+				{{{ if !muted }}}
+				{{{ if !isSelf }}}
+				<button class="btn btn-sm float-end btn-danger" component="account/mute">[[user:mute-account]]</button>
+				{{{ end }}}
+				{{{ else }}}
+				{{{ if !isSelf }}}
+				<button class="btn btn-sm float-end btn-success" component="account/unmute">[[user:unmute-account]]</button>
+				{{{ end }}}
+				{{{ end }}}
+			</h5>
+			<div class="card-body">
+				{{{ if history.mutes.length }}}
+				<ul class="ban-history list-unstyled">
+					{{{ each history.mutes }}}
+					<li class="mb-4 border-bottom">
+						<div class="mb-1 d-flex align-items-center justify-content-between">
+							<div>
+								<a href="{config.relative_path}/user/{./user.userslug}">{buildAvatar(./user, "24px", true)}</a>
+								<strong>
+									<a href="{{{ if ./user.userslug }}}{config.relative_path}/user/{./user.userslug}{{{ else }}}#{{{ end }}}" itemprop="author" data-username="{./user.username}" data-uid="{./user.uid}">{./user.username}</a>
+								</strong>
+								<span class="timestamp timeago" title="{./timestampISO}"></span>
+							</div>
+							{{{ if (./type != "unmute") }}}
+							<span class="badge text-bg-danger">[[user:muted]]</span>
+							{{{ else }}}
+							<span class="badge text-bg-success">[[user:unmuted]]</span>
+							{{{ end }}}
+						</div>
+						<p class="mb-1">
+							<span class="reason">[[user:info.banned-reason-label]]: <strong>{./reason}</strong></span>
+						</p>
+						<p>
+							{{{ if ./until }}}
+							<span class="expiry">[[user:info.muted-until, {isoTimeToLocaleString(./untilISO, config.userLang)}]]</span>
+							{{{ end }}}
+						</p>
+					</li>
+					{{{ end }}}
+				</ul>
+				{{{ else }}}
+				<div class="alert alert-success">[[user:info.no-mute-history]]</div>
+				{{{ end }}}
+			</div>
+		</div>
+	</div>
+</div>
+
 <!-- IMPORT partials/account/footer.tpl -->

package/templates/account/posts.tpl

@@ -1,35 +1,35 @@
-<!-- IMPORT partials/account/header.tpl -->
-
-<div class="d-flex flex-wrap justify-content-between align-items-center gap-2 mb-3">
-	<h3 class="fw-semibold fs-5 mb-0">[[global:posts]]</h3>
-	<div class="d-flex flex-wrap gap-1">
-		<a href="{config.relative_path}/user/{userslug}/posts" class="btn-ghost-sm ff-secondary fw-semibold {{{ if template.account/posts }}}active{{{ end }}}">[[global:header.recent]]</a>
-		{{{ if !reputation:disabled }}}
-		<a href="{config.relative_path}/user/{userslug}/best"class="btn-ghost-sm ff-secondary fw-semibold {{{ if template.account/best }}}active{{{ end }}}">[[global:best]]</a>
-		<a href="{config.relative_path}/user/{userslug}/controversial" class="btn-ghost-sm ff-secondary fw-semibold {{{ if template.account/controversial }}}active{{{ end }}}">[[global:controversial]]</a>
-		{{{ if canEdit }}}
-		<a href="{config.relative_path}/user/{userslug}/upvoted" class="btn-ghost-sm ff-secondary fw-semibold {{{ if template.account/upvoted }}}active{{{ end }}}">[[global:upvoted]]</a>
-		{{{ if !downvote:disabled }}}
-		<a href="{config.relative_path}/user/{userslug}/downvoted" class="btn-ghost-sm ff-secondary fw-semibold {{{ if template.account/downvoted }}}active{{{ end }}}">[[global:downvoted]]</a>
-		{{{ end }}}
-		{{{ end }}}
-		{{{ end }}}
-		{{{ if canEdit }}}
-		<a href="{config.relative_path}/user/{userslug}/bookmarks" class="btn-ghost-sm ff-secondary fw-semibold {{{ if template.account/bookmarks }}}active{{{ end }}}">[[user:bookmarks]]</a>
-		{{{ end }}}
-	</div>
-</div>
-
-{{{ if !posts.length }}}
-<div class="alert alert-warning text-center">{noItemsFoundKey}</div>
-{{{ end }}}
-
-<div class="">
-	<!-- IMPORT partials/posts_list.tpl -->
-
-	{{{ if config.usePagination }}}
-	<!-- IMPORT partials/paginator.tpl -->
-	{{{ end }}}
-</div>
-
-<!-- IMPORT partials/account/footer.tpl -->
+<!-- IMPORT partials/account/header.tpl -->
+
+<div class="d-flex flex-wrap justify-content-between align-items-center gap-2 mb-3">
+	<h3 class="fw-semibold fs-5 mb-0">[[global:posts]]</h3>
+	<div class="d-flex flex-wrap gap-1">
+		<a href="{config.relative_path}/user/{userslug}/posts" class="btn btn-ghost btn-sm ff-secondary fw-semibold {{{ if template.account/posts }}}active{{{ end }}}">[[global:header.recent]]</a>
+		{{{ if !reputation:disabled }}}
+		<a href="{config.relative_path}/user/{userslug}/best"class="btn btn-ghost btn-sm ff-secondary fw-semibold {{{ if template.account/best }}}active{{{ end }}}">[[global:best]]</a>
+		<a href="{config.relative_path}/user/{userslug}/controversial" class="btn btn-ghost btn-sm ff-secondary fw-semibold {{{ if template.account/controversial }}}active{{{ end }}}">[[global:controversial]]</a>
+		{{{ if canEdit }}}
+		<a href="{config.relative_path}/user/{userslug}/upvoted" class="btn btn-ghost btn-sm ff-secondary fw-semibold {{{ if template.account/upvoted }}}active{{{ end }}}">[[global:upvoted]]</a>
+		{{{ if !downvote:disabled }}}
+		<a href="{config.relative_path}/user/{userslug}/downvoted" class="btn btn-ghost btn-sm ff-secondary fw-semibold {{{ if template.account/downvoted }}}active{{{ end }}}">[[global:downvoted]]</a>
+		{{{ end }}}
+		{{{ end }}}
+		{{{ end }}}
+		{{{ if canEdit }}}
+		<a href="{config.relative_path}/user/{userslug}/bookmarks" class="btn btn-ghost btn-sm ff-secondary fw-semibold {{{ if template.account/bookmarks }}}active{{{ end }}}">[[user:bookmarks]]</a>
+		{{{ end }}}
+	</div>
+</div>
+
+{{{ if !posts.length }}}
+<div class="alert alert-warning text-center">{noItemsFoundKey}</div>
+{{{ end }}}
+
+<div>
+	<!-- IMPORT partials/posts_list.tpl -->
+
+	{{{ if config.usePagination }}}
+	<!-- IMPORT partials/paginator.tpl -->
+	{{{ end }}}
+</div>
+
+<!-- IMPORT partials/account/footer.tpl -->