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

package/scss/topic.scss

@@ -1,139 +1,131 @@
-body.template-topic {
-	.breadcrumb .breadcrumb-item:last-child {
-		display: none;
-	}
-	.topic {
-		.posts-container {
-			max-width: 960px;
-			width: 960px;
-		}
-
-		.posts {
-			// fixes code blocks pushing content out on mobile
-			@include media-breakpoint-down(md) {
-				max-width: calc(100vw - $grid-gutter-width);
-			}
-
-			&.timeline {
-				@include timeline-style;
-			}
-
-			.post-header {
-				font-size: 0.8125rem;
-				line-height: 1.25rem;
-
-				.bookmarked {
-					transition: $transition-fade;
-				}
-			}
-
-			> [component="post"] > [component="post/footer"] {
-				margin-left: calc($spacer * 2.5);
-			}
-
-			[component="post"] {
-				&.selected .post-container {
-					background-color: mix($body-bg, $body-color, 90%);
-				}
-				&.deleted .post-container .content { opacity: .65; }
-
-				[component="post/content"] {
-					@include fix-lists();
-
-					> blockquote {
-						> blockquote {
-							> *:not(.blockquote) {
-								display: none;
-							}
-						}
-
-						> blockquote.uncollapsed {
-							> *:not(.blockquote) {
-								display: block;
-							}
-						}
-					}
-
-					@include media-breakpoint-up(lg) {
-						table { // text-break breaks table formatting
-						 	word-break:initial!important;
-						}
-					}
-				}
-			}
-
-			[component="post/upvote"], [component="post/downvote"] {
-				&.upvoted, &.downvoted {
-					background-color: var(--btn-ghost-active-color);
-
-					&:hover {
-						background-color: var(--btn-ghost-hover-color);
-					}
-				}
-			}
-		}
-	}
-
-	.quick-reply {
-		@include topic-avatars();
-	}
-
-	[component="post/replies/container"] {
-		.icon {
-			display: none !important;
-		}
-
-		.post-header .icon {
-			display: initial !important;
-
-			.status {
-				display: none;
-			}
-		}
-
-		.timeline-event {
-			display: none !important;
-		}
-
-		[component="post"] {
-			padding-top: 0 !important;
-			padding-bottom: $spacer;
-			&:last-of-type {
-				padding-bottom: 0;
-				.post-footer {
-					border-bottom: none !important;
-				}
-			}
-		}
-	}
-
-
-	[component="topic/thumb/list"] {
-		height: calc($font-size-base * 4);
-	}
-}
-
-@include media-breakpoint-up(sm) {
-	body.template-topic {
-		.topic .posts {
-			[component="post"] {
-				[component="post/actions"] {
-					opacity: 0;
-					transition: $transition-fade;
-
-					&:has([aria-expanded="true"]) {
-						opacity: 1;
-					}
-				}
-				[component="post/actions"]:focus-within {
-					opacity: 1;
-				}
-				&:hover {
-					> .post-footer > [component="post/actions"] {
-						opacity: 1;
-					}
-				}
-			}
-		}
-	}
+body.template-topic {
+	.breadcrumb .breadcrumb-item:last-child {
+		display: none;
+	}
+	.topic {
+		.posts-container {
+			max-width: 960px;
+			width: 960px;
+		}
+
+		.posts {
+			&.timeline {
+				@include timeline-style;
+			}
+
+			.post-header {
+				font-size: 0.8125rem;
+				line-height: 1.25rem;
+
+				.bookmarked {
+					transition: $transition-fade;
+				}
+			}
+
+			[component="post"] {
+				&.selected .post-container {
+					background-color: mix($body-bg, $body-color, 90%);
+				}
+				&.deleted .post-container .content { opacity: .65; }
+
+				[component="post/content"] {
+					@include fix-lists();
+
+					> blockquote {
+						> blockquote {
+							> *:not(.blockquote) {
+								display: none;
+							}
+						}
+
+						> blockquote.uncollapsed {
+							> *:not(.blockquote) {
+								display: block;
+							}
+						}
+					}
+
+					@include media-breakpoint-up(lg) {
+						table { // text-break breaks table formatting
+						 	word-break:initial!important;
+						}
+					}
+				}
+			}
+
+			[component="post/upvote"], [component="post/downvote"] {
+				&.upvoted, &.downvoted {
+					background-color: var(--btn-ghost-active-color);
+
+					&:hover {
+						background-color: var(--btn-ghost-hover-color);
+					}
+				}
+			}
+		}
+	}
+
+	.quick-reply {
+		@include topic-avatars();
+	}
+
+	[component="post/replies/container"] {
+		.icon {
+			display: none !important;
+		}
+
+		.post-header .icon {
+			display: initial !important;
+
+			.status {
+				display: none;
+			}
+		}
+
+		.timeline-event {
+			display: none !important;
+		}
+
+		[component="post"] {
+			padding-top: 0 !important;
+			padding-bottom: $spacer;
+			&:last-of-type {
+				padding-bottom: 0;
+				.post-footer {
+					padding-bottom: 0!important;
+					border-bottom: none !important;
+				}
+			}
+		}
+	}
+
+
+	[component="topic/thumb/list"] > a{
+		height: calc($font-size-base * 4);
+	}
+}
+
+@include media-breakpoint-up(lg) {
+	body.template-topic {
+		.topic .posts {
+			[component="post"] {
+				[component="post/actions"] {
+					opacity: 0;
+					transition: $transition-fade;
+
+					&:has([aria-expanded="true"]) {
+						opacity: 1;
+					}
+				}
+				[component="post/actions"]:focus-within {
+					opacity: 1;
+				}
+				&:hover {
+					> div > .post-container > [component="post/footer"] > div > [component="post/actions"] {
+						opacity: 1;
+					}
+				}
+			}
+		}
+	}
 }

package/templates/account/blocks.tpl

@@ -1,40 +1,51 @@
-<!-- IMPORT partials/account/header.tpl -->
-<div class="d-flex justify-content-between mb-3">
-	<h3 class="fw-semibold fs-5">[[pages:account/blocks, {username}]]</h3>
-	<div class="justify-content-end">
-		<div class="dropdown">
-			<div class="input-group">
-				<input class="form-control form-control-sm" type="text" id="user-search" placeholder="[[users:enter-username]]" data-bs-toggle="dropdown" autocomplete="off" aria-haspopup="true" aria-expanded="false"/>
-
-				<ul component="blocks/search/list" class="dropdown-menu dropdown-menu-end p-1 text-sm block-edit overflow-auto" style="max-height:300px;" role="menu">
-					<li><a href="#" class="dropdown-item" role="menuitem">[[admin/menu:search.start-typing]]</a></li>
-					{{{ each edit }}}
-					<li>
-						<div class="dropdown-item d-flex flex-nowrap gap-2 justify-content-between" role="menuitem">
-							<div class="text-truncate">
-								<a href="{config.relative_path}/uid/{./uid}" class="text-decoration-none">{buildAvatar(edit, "24px", true)} {./username}</a>
-							</div>
-							<button class="btn btn-sm btn-primary text-nowrap" data-uid="{./uid}" data-action="toggle">[[user:block-toggle]]</button>
-						</div>
-					</li>
-					{{{ end }}}
-				</ul>
-
-				<button class="btn btn-primary btn-sm" type="button">
-					<i class="fa fa-search"></i>
-				</button>
-			</div>
-		</div>
-	</div>
-</div>
-<div class="users">
-	<div id="users-container" class="row row-cols-2 row-cols-lg-3 row-cols-xl-4 g-2">
-		{{{ each users }}}
-		<!-- IMPORT partials/users/item.tpl -->
-		{{{ end }}}
-	</div>
-	<div class="alert alert-warning text-center"{{{ if users.length }}} style="display: none;"{{{ end }}}>[[user:has-no-blocks]]</div>
-	<!-- IMPORT partials/paginator.tpl -->
-</div>
-
-<!-- IMPORT partials/account/footer.tpl -->
+<!-- IMPORT partials/account/header.tpl -->
+<div class="d-flex justify-content-between mb-3">
+	<h3 class="fw-semibold fs-5">[[pages:account/blocks, {username}]]</h3>
+	<div class="justify-content-end">
+		<div class="dropdown">
+			<div class="input-group">
+				<input class="form-control form-control-sm" type="text" id="user-search" placeholder="[[users:enter-username]]" data-bs-toggle="dropdown" autocomplete="off" aria-haspopup="true" aria-expanded="false"/>
+
+				<ul component="blocks/search/list" class="dropdown-menu dropdown-menu-end p-1 text-sm block-edit overflow-auto" style="max-height:300px;" role="menu">
+					<li component="blocks/start-typing">
+						<a href="#" class="dropdown-item rounded-1" role="menuitem">[[admin/menu:search.start-typing]]</a>
+					</li>
+					<li component="blocks/no-users" class="hidden">
+						<a href="#" class="dropdown-item rounded-1" role="menuitem">[[users:no-users-found]]</a>
+					</li>
+					{{{ each edit }}}
+					<li component="blocks/search/match">
+						<div class="dropdown-item rounded-1 d-flex flex-nowrap gap-4 justify-content-between align-items-center" role="menuitem">
+							<div class="text-truncate">
+								<a href="{config.relative_path}/uid/{./uid}" class="text-decoration-none">{buildAvatar(edit, "24px", true)} {./username}</a>
+							</div>
+
+							<button class="btn btn-sm btn-outline-danger text-nowrap {{{ if ./isBlocked }}}hidden{{{ end }}}" data-uid="{./uid}" data-action="block">[[user:block-user]]</button>
+							<button class="btn btn-sm btn-outline-primary text-nowrap {{{ if !./isBlocked }}}hidden{{{ end }}}" data-uid="{./uid}" data-action="unblock">[[user:unblock-user]]</button>
+						</div>
+					</li>
+					{{{ end }}}
+				</ul>
+
+				<button class="btn btn-primary btn-sm" type="button">
+					<i class="fa fa-search"></i>
+				</button>
+			</div>
+		</div>
+	</div>
+</div>
+<div class="users">
+	<div class="alert alert-warning text-center m-0"{{{ if users.length }}} style="display: none;"{{{ end }}}>[[user:has-no-blocks]]</div>
+
+	<div id="users-container" class="row row-cols-2 row-cols-lg-3 row-cols-xl-4 g-3">
+		{{{ each users }}}
+		<div class="d-flex flex-column gap-1">
+			<!-- IMPORT partials/users/item.tpl -->
+			<button class="btn btn-sm btn-outline-primary text-nowrap mx-auto" data-uid="{./uid}" data-action="unblock">[[user:unblock-user]]</button>
+		</div>
+		{{{ end }}}
+	</div>
+	<!-- IMPORT partials/paginator.tpl -->
+</div>
+
+<!-- IMPORT partials/account/footer.tpl -->

package/templates/account/categories.tpl

@@ -1,64 +1,64 @@
-<!-- IMPORT partials/account/header.tpl -->
-
-<div class="d-flex justify-content-between align-items-center mb-3">
-	<div class="d-flex gap-1">
-		<h3 class="fw-semibold fs-5 mb-0">{title}</h3>
-	</div>
-
-	<div class="d-flex gap-1">
-		<div class="btn-group bottom-sheet" component="category/watch/all">
-			<button class="btn-ghost-sm ff-secondary fw-semibold dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" type="button">
-				<span>[[user:change-all]]</span>
-			</button>
-			<ul class="dropdown-menu p-1 text-sm dropdown-menu-end" role="menu">
-				<li>
-					<a class="dropdown-item rounded-1 d-flex flex-column p-2" href="#" component="category/watching" data-state="watching" role="menuitem">
-						<div class="d-flex align-items-center gap-2">
-							<i class="flex-shrink-0 fa fa-fw fa-bell-o"></i>
-							<span class="flex-grow-1 fw-semibold">[[category:watching]]</span>
-						</div>
-						<div class="help-text text-muted text-xs">[[category:watching.description]]</div>
-					</a>
-				</li>
-				<li>
-					<a class="dropdown-item rounded-1 d-flex flex-column p-2" href="#" component="category/tracking" data-state="tracking" role="menuitem">
-						<div class="d-flex align-items-center gap-2">
-							<i class="flex-shrink-0 fa fa-fw fa-inbox"></i>
-							<span class="flex-grow-1 fw-semibold">[[category:tracking]]</span>
-						</div>
-						<div class="help-text text-muted text-xs">[[category:tracking.description]]</div>
-					</a>
-				</li>
-				<li>
-					<a class="dropdown-item rounded-1 d-flex flex-column p-2" href="#" component="category/notwatching" data-state="notwatching" role="menuitem">
-						<div class="d-flex align-items-center gap-2">
-							<i class="flex-shrink-0 fa fa-fw fa-clock-o"></i>
-							<span class="flex-grow-1 fw-semibold">[[category:not-watching]]</span>
-						</div>
-						<div class="help-text text-muted text-xs">[[category:not-watching.description]]</div>
-					</a>
-				</li>
-				<li>
-					<a class="dropdown-item rounded-1 d-flex flex-column p-2" href="#" component="category/ignoring" data-state="ignoring" role="menuitem">
-						<div class="d-flex align-items-center gap-2">
-							<i class="flex-shrink-0 fa fa-fw fa-eye-slash"></i>
-							<span class="flex-grow-1 fw-semibold">[[category:ignoring]]</span>
-						</div>
-						<div class="help-text text-muted text-xs">[[category:ignoring.description]]</div>
-					</a>
-				</li>
-			</ul>
-		</div>
-	</div>
-</div>
-
-<div>
-	<ul class="categories list-unstyled" itemscope itemtype="http://www.schema.org/ItemList">
-		{{{each categories}}}
-		<!-- IMPORT partials/account/category-item.tpl -->
-		{{{end}}}
-	</ul>
-	<!-- IMPORT partials/paginator.tpl -->
-</div>
-
+<!-- IMPORT partials/account/header.tpl -->
+
+<div class="d-flex justify-content-between align-items-center mb-3">
+	<div class="d-flex gap-1">
+		<h3 class="fw-semibold fs-5 mb-0">{title}</h3>
+	</div>
+
+	<div class="d-flex gap-1">
+		<div class="btn-group bottom-sheet" component="category/watch/all">
+			<button class="btn btn-ghost btn-sm ff-secondary fw-semibold dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" type="button">
+				<span>[[user:change-all]]</span>
+			</button>
+			<ul class="dropdown-menu p-1 text-sm dropdown-menu-end" role="menu">
+				<li>
+					<a class="dropdown-item rounded-1 d-flex flex-column p-2" href="#" component="category/watching" data-state="watching" role="menuitem">
+						<div class="d-flex align-items-center gap-2">
+							<i class="flex-shrink-0 fa fa-fw fa-bell-o"></i>
+							<span class="flex-grow-1 fw-semibold">[[category:watching]]</span>
+						</div>
+						<div class="help-text text-muted text-xs">[[category:watching.description]]</div>
+					</a>
+				</li>
+				<li>
+					<a class="dropdown-item rounded-1 d-flex flex-column p-2" href="#" component="category/tracking" data-state="tracking" role="menuitem">
+						<div class="d-flex align-items-center gap-2">
+							<i class="flex-shrink-0 fa fa-fw fa-inbox"></i>
+							<span class="flex-grow-1 fw-semibold">[[category:tracking]]</span>
+						</div>
+						<div class="help-text text-muted text-xs">[[category:tracking.description]]</div>
+					</a>
+				</li>
+				<li>
+					<a class="dropdown-item rounded-1 d-flex flex-column p-2" href="#" component="category/notwatching" data-state="notwatching" role="menuitem">
+						<div class="d-flex align-items-center gap-2">
+							<i class="flex-shrink-0 fa fa-fw fa-clock-o"></i>
+							<span class="flex-grow-1 fw-semibold">[[category:not-watching]]</span>
+						</div>
+						<div class="help-text text-muted text-xs">[[category:not-watching.description]]</div>
+					</a>
+				</li>
+				<li>
+					<a class="dropdown-item rounded-1 d-flex flex-column p-2" href="#" component="category/ignoring" data-state="ignoring" role="menuitem">
+						<div class="d-flex align-items-center gap-2">
+							<i class="flex-shrink-0 fa fa-fw fa-eye-slash"></i>
+							<span class="flex-grow-1 fw-semibold">[[category:ignoring]]</span>
+						</div>
+						<div class="help-text text-muted text-xs">[[category:ignoring.description]]</div>
+					</a>
+				</li>
+			</ul>
+		</div>
+	</div>
+</div>
+
+<div>
+	<ul class="categories list-unstyled" itemscope itemtype="http://www.schema.org/ItemList">
+		{{{each categories}}}
+		<!-- IMPORT partials/account/category-item.tpl -->
+		{{{end}}}
+	</ul>
+	<!-- IMPORT partials/paginator.tpl -->
+</div>
+
 <!-- IMPORT partials/account/footer.tpl -->

package/templates/account/consent.tpl

@@ -1,73 +1,73 @@
-<!-- IMPORT partials/account/header.tpl -->
-<h3 class="fw-semibold fs-5">[[user:consent.title]]</h3>
-
-<p class="lead">[[user:consent.lead]]</p>
-<p>[[user:consent.intro]]</p>
-
-<hr />
-
-<div class="row">
-	<div class="col-sm-6">
-		{{{ if gdpr_consent }}}
-		<div class="alert alert-success">
-			<i class="fa fa-check float-end fa-3x"></i>
-			[[user:consent.received]]
-		</div>
-		{{{ else }}}
-		<div class="alert alert-warning">
-			[[user:consent.not-received]]
-			<br /><br />
-			<div class="text-center">
-				<button class="btn btn-warning" data-action="consent">[[user:consent.give]]</button>
-			</div>
-		</div>
-		{{{ end }}}
-		<div class="card">
-			<div class="card-body">
-				<p>[[user:consent.email-intro]]</p>
-				{{{ if digest.enabled }}}
-				<p>[[user:consent.digest-frequency, {digest.frequency}]]</p>
-				{{{ else }}}
-				<p>[[user:consent.digest-off]]</p>
-				{{{ end }}}
-
-				<div class="d-grid">
-					<a class="btn btn-outline-secondary" href="./settings">
-						<i class="fa fa-cog"></i>
-						[[pages:account/settings]]
-					</a>
-				</div>
-			</div>
-		</div>
-	</div>
-	<div class="col-sm-6">
-		<div class="card">
-			<div class="card-body">
-				<p><strong>[[user:consent.right-of-access]]</strong></p>
-				<p>[[user:consent.right-of-access-description]]</p>
-				<p><strong>[[user:consent.right-to-rectification]]</strong></p>
-				<p>[[user:consent.right-to-rectification-description]]</p>
-				<p><strong>[[user:consent.right-to-erasure]]</strong></p>
-				<p>[[user:consent.right-to-erasure-description]]</p>
-				<p><strong>[[user:consent.right-to-data-portability]]</strong></p>
-				<p>[[user:consent.right-to-data-portability-description]]</p>
-
-				<hr />
-
-				<div class="btn-group-vertical d-grid">
-					<a data-action="export-profile" class="btn btn-outline-secondary">
-						<i class="fa fa-download"></i> [[user:consent.export-profile]]
-					</a>
-					<a data-action="export-posts" class="btn btn-outline-secondary">
-						<i class="fa fa-download"></i> [[user:consent.export-posts]]
-					</a>
-					<a data-action="export-uploads" class="btn btn-outline-secondary">
-						<i class="fa fa-download"></i> [[user:consent.export-uploads]]
-					</a>
-				</div>
-			</div>
-		</div>
-	</div>
-</div>
-
-<!-- IMPORT partials/account/footer.tpl -->
+<!-- IMPORT partials/account/header.tpl -->
+<h3 class="fw-semibold fs-5">[[user:consent.title]]</h3>
+
+<p class="lead">[[user:consent.lead]]</p>
+<p>[[user:consent.intro]]</p>
+
+<hr />
+
+<div class="row">
+	<div class="col-sm-6">
+		{{{ if gdpr_consent }}}
+		<div class="alert alert-success d-flex gap-3">
+			[[user:consent.received]]
+			<i class="fa fa-check fa-3x"></i>
+		</div>
+		{{{ else }}}
+		<div class="alert alert-warning">
+			[[user:consent.not-received]]
+			<br /><br />
+			<div class="text-center">
+				<button class="btn btn-warning" data-action="consent">[[user:consent.give]]</button>
+			</div>
+		</div>
+		{{{ end }}}
+		<div class="card">
+			<div class="card-body">
+				<p>[[user:consent.email-intro]]</p>
+				{{{ if digest.enabled }}}
+				<p>[[user:consent.digest-frequency, {digest.frequency}]]</p>
+				{{{ else }}}
+				<p>[[user:consent.digest-off]]</p>
+				{{{ end }}}
+
+				<div class="d-grid">
+					<a class="btn btn-outline-secondary" href="./settings">
+						<i class="fa fa-cog"></i>
+						[[pages:account/settings]]
+					</a>
+				</div>
+			</div>
+		</div>
+	</div>
+	<div class="col-sm-6">
+		<div class="card">
+			<div class="card-body">
+				<p><strong>[[user:consent.right-of-access]]</strong></p>
+				<p>[[user:consent.right-of-access-description]]</p>
+				<p><strong>[[user:consent.right-to-rectification]]</strong></p>
+				<p>[[user:consent.right-to-rectification-description]]</p>
+				<p><strong>[[user:consent.right-to-erasure]]</strong></p>
+				<p>[[user:consent.right-to-erasure-description]]</p>
+				<p><strong>[[user:consent.right-to-data-portability]]</strong></p>
+				<p>[[user:consent.right-to-data-portability-description]]</p>
+
+				<hr />
+
+				<div class="btn-group-vertical d-grid">
+					<a data-action="export-profile" class="btn btn-outline-secondary">
+						<i class="fa fa-download"></i> [[user:consent.export-profile]]
+					</a>
+					<a data-action="export-posts" class="btn btn-outline-secondary">
+						<i class="fa fa-download"></i> [[user:consent.export-posts]]
+					</a>
+					<a data-action="export-uploads" class="btn btn-outline-secondary">
+						<i class="fa fa-download"></i> [[user:consent.export-uploads]]
+					</a>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+
+<!-- IMPORT partials/account/footer.tpl -->