nodebb-theme-persona 12.1.4 → 13.0.0

package/templates/search.tpl

@@ -2,17 +2,17 @@
 
 <div class="search">
 	<div class="row">
-		<div class="col-xs-12">
-			<form id="advanced-search">
-				<div class="form-group">
+		<div class="<!-- IF widgets.sidebar.length -->col-lg-9 col-sm-12<!-- ELSE -->col-lg-12<!-- ENDIF widgets.sidebar.length -->">
+			<form id="advanced-search" class="mb-3">
+				<div class="mb-3">
 					<div class="row">
-						<div class="col-md-6">
-							<label>[[global:search]]</label>
+						<div class="col-md-5">
+							<label class="form-label">[[global:search]]</label>
 							<input type="text" class="form-control" id="search-input" placeholder="[[global:search]]">
 						</div>
-						<div class="col-md-2">
-							<label>[[search:in]]</label>
-							<select id="search-in" class="form-control">
+						<div class="col-md-3">
+							<label class="form-label">[[search:in]]</label>
+							<select id="search-in" class="form-select">
 								<option value="titlesposts">[[search:titles-posts]]</option>
 								<option value="titles">[[search:titles]]</option>
 								<option value="posts">[[global:posts]]</option>
@@ -26,54 +26,62 @@
 							</select>
 						</div>
 						<div class="col-md-2">
-							<label>[[search:match-words]]</label>
-							<select id="match-words-filter" class="form-control">
+							<label class="form-label">[[search:match-words]]</label>
+							<select id="match-words-filter" class="form-select">
 								<option value="all">[[search:all]]</option>
 								<option value="any">[[search:any]]</option>
 							</select>
 						</div>
 						<div class="col-md-2">
-							<label>&nbsp;</label>
+							<label class="form-label">&nbsp;</label>
 							<button type="submit" class="btn btn-primary form-control">[[global:search]]</button>
 						</div>
 					</div>
 				</div>
 
-				<div class="panel panel-default">
-					<div class="panel-heading" data-toggle="collapse" data-target=".search-options">
-						<h3 class="panel-title"><i class="fa fa-sort"></i> [[search:advanced-search]]</h3>
-					</div>
-					<div class="panel-body search-options collapse <!-- IF expandSearch -->in<!-- ENDIF expandSearch -->">
-						<div class="form-group post-search-item">
+				<div class="card">
+					<h5 class="card-header pointer" data-bs-toggle="collapse" data-bs-target=".search-options">
+						<i class="fa fa-sort"></i> [[search:advanced-search]]
+					</h5>
+					<div class="collapse search-options {{{ if expandSearch }}}show{{{ end }}}">
+					<div class="card-body">
+						<div class="mb-2 post-search-item">
 							<div class="row">
 								<div class="col-md-6">
-									<label>[[search:in-categories]]</label>
-									<select multiple class="form-control" id="posted-in-categories" size="{allCategoriesCount}">
+									<label class="form-label">[[search:in-categories]]</label>
+									<select multiple class="form-select" id="posted-in-categories" size="{allCategoriesCount}">
 										{{{each allCategories}}}
 										<option value="{allCategories.value}">{allCategories.text}</option>
 										{{{end}}}
 									</select>
-									<input type="checkbox" id="search-children"> [[search:search-child-categories]]
+									<div class="form-check">
+										<input id="search-children" class="form-check-input" type="checkbox"/>
+										<label class="form-check-label" for="search-children">[[search:search-child-categories]]</label>
+									</div>
 								</div>
 								<div class="col-md-6">
-									<div class="form-group post-search-item">
+									<div class="mb-2 post-search-item">
 										<div class="row">
 											<div class="col-md-6">
-												<label>[[search:posted-by]]</label>
-												<input type="text" class="form-control" id="posted-by-user" placeholder="[[search:posted-by]]">
+												<label class="form-label">[[search:posted-by]]</label>
+												<div>
+													<input type="text" class="form-control" id="posted-by-user">
+												</div>
 											</div>
 											<div class="col-md-6">
-												<label>[[search:has-tags]]</label>
-												<input type="text" class="form-control" id="has-tags">
+												<label class="form-label">[[search:has-tags]]</label>
+												<div>
+													<input type="text" class="form-control" id="has-tags">
+												</div>
 											</div>
 										</div>
 									</div>
 
-									<div class="form-group post-search-item">
-										<label>[[search:reply-count]]</label>
+									<div class="mb-2 post-search-item">
+										<label class="form-label">[[search:reply-count]]</label>
 										<div class="row">
 											<div class="col-md-6">
-												<select id="reply-count-filter" class="form-control">
+												<select id="reply-count-filter" class="form-select">
 													<option value="atleast">[[search:at-least]]</option>
 													<option value="atmost">[[search:at-most]]</option>
 												</select>
@@ -84,17 +92,17 @@
 										</div>
 									</div>
 
-									<div class="form-group post-search-item">
-										<label>[[search:post-time]]</label>
+									<div class="mb-2 post-search-item">
+										<label class="form-label">[[search:post-time]]</label>
 										<div class="row">
 											<div class="col-md-6">
-												<select id="post-time-filter" class="form-control">
+												<select id="post-time-filter" class="form-select">
 													<option value="newer">[[search:newer-than]]</option>
 													<option value="older">[[search:older-than]]</option>
 												</select>
 											</div>
 											<div class="col-md-6">
-												<select id="post-time-range" class="form-control">
+												<select id="post-time-range" class="form-select">
 													<option value="">[[search:any-date]]</option>
 													<option value="86400">[[search:yesterday]]</option>
 													<option value="604800">[[search:one-week]]</option>
@@ -108,11 +116,11 @@
 										</div>
 									</div>
 
-									<div class="form-group post-search-item">
-										<label>[[search:sort-by]]</label>
+									<div class="mb-2 post-search-item">
+										<label class="form-label">[[search:sort-by]]</label>
 										<div class="row">
 											<div class="col-md-6">
-												<select id="post-sort-by" class="form-control">
+												<select id="post-sort-by" class="form-select">
 													<option value="relevance">[[search:relevance]]</option>
 													<option value="timestamp">[[search:post-time]]</option>
 													<option value="votes">[[search:votes]]</option>
@@ -127,7 +135,7 @@
 												</select>
 											</div>
 											<div class="col-md-6">
-												<select id="post-sort-direction" class="form-control">
+												<select id="post-sort-direction" class="form-select">
 													<option value="desc">[[search:descending]]</option>
 													<option value="asc">[[search:ascending]]</option>
 												</select>
@@ -135,8 +143,8 @@
 										</div>
 									</div>
 
-									<div class="form-group post-search-item">
-										<label>[[search:show-results-as]]</label>
+									<div class="mb-2 post-search-item">
+										<label class="form-label">[[search:show-results-as]]</label>
 										<div class="radio">
 											<label>
 												<input type="radio" name="options" id="show-as-posts" checked>
@@ -154,69 +162,74 @@
 							</div>
 						</div>
 
-
-
 						<div class="btn-group">
 							<button type="submit" class="btn btn-primary">[[global:search]]</button>
-							<a class="btn btn-default" id="save-preferences" href="#">[[search:save-preferences]]</a>
-							<a class="btn btn-default" id="clear-preferences" href="#">[[search:clear-preferences]]</a>
+							<a class="btn btn-outline-secondary" id="save-preferences" href="#">[[search:save-preferences]]</a>
+							<a class="btn btn-outline-secondary" id="clear-preferences" href="#">[[search:clear-preferences]]</a>
 						</div>
 					</div>
+					</div>
 				</div>
 			</form>
-		</div>
-	</div>
 
-	<div class="row">
-		<div id="results" class="search-results col-md-12" data-search-query="{search_query}">
-			<!-- IF matchCount -->
-			<div class="alert alert-info">[[search:results_matching, {matchCount}, {search_query}, {time}]] </div>
-			<!-- ELSE -->
-			<!-- IF search_query -->
-			<div class="alert alert-warning">[[search:no-matches]]</div>
-			<!-- ENDIF search_query -->
-			<!-- ENDIF matchCount -->
+			<div id="results" class="search-results col-md-12" data-search-query="{search_query}">
+				<!-- IF matchCount -->
+				<div class="alert alert-info">[[search:results_matching, {matchCount}, {search_query}, {time}]] </div>
+				<!-- ELSE -->
+				<!-- IF search_query -->
+				<div class="alert alert-warning">[[search:no-matches]]</div>
+				<!-- ENDIF search_query -->
+				<!-- ENDIF matchCount -->
+
+				{{{each posts}}}
+				<div class="topic-row card clearfix mb-3">
+					<div class="card-body">
+						<a href="{config.relative_path}/user/{posts.user.userslug}">{buildAvatar(posts.user, "24px", true)}</a>
+						<span class="search-result-text search-result-title"><a href="{config.relative_path}/post/{posts.pid}">{posts.topic.title}</a></span>
+						<br/>
+						<!-- IF showAsPosts -->
+						<div class="search-result-text">
+							{posts.content}
+							<p class="fade-out"></p>
+						</div>
+						<!-- ENDIF showAsPosts -->
 
-			{{{each posts}}}
-			<div class="topic-row panel panel-default clearfix">
-				<div class="panel-body">
-					<a href="{config.relative_path}/user/{posts.user.userslug}">{buildAvatar(posts.user, "sm", true)}</a>
-					<span class="search-result-text search-result-title"><a href="{config.relative_path}/post/{posts.pid}">{posts.topic.title}</a></span>
-					<br/>
-					<!-- IF showAsPosts -->
-					<div class="search-result-text">
-						{posts.content}
-						<p class="fade-out"></p>
+						<small class="post-info float-end">
+							<a href="{config.relative_path}/category/{posts.category.slug}">
+								<div class="category-item d-inline-block">
+									{buildCategoryIcon(./category, "24px", "rounded-circle")}
+									{posts.category.name}
+								</div>
+							</a> &bull;
+							<span class="timeago" title="{posts.timestampISO}"></span>
+						</small>
 					</div>
-					<!-- ENDIF showAsPosts -->
-
-					<small class="post-info pull-right">
-						<a href="{config.relative_path}/category/{posts.category.slug}"><span class="fa-stack" style="{function.generateCategoryBackground, posts.category}"><i style="color:{posts.category.color};" class="fa {posts.category.icon} fa-stack-1x"></i></span> {posts.category.name}</a> &bull;
-						<span class="timeago" title="{posts.timestampISO}"></span>
-					</small>
 				</div>
-			</div>
-			{{{end}}}
+				{{{end}}}
 
-			<!-- IF users.length -->
-			<ul id="users-container" class="users-container">
-			<!-- IMPORT partials/users_list.tpl -->
-			</ul>
-			<!-- ENDIF users.length -->
+				<!-- IF users.length -->
+				<!-- IMPORT partials/users_list.tpl -->
+				<!-- ENDIF users.length -->
 
-			<!-- IF tags.length -->
-			<!-- IMPORT partials/tags_list.tpl -->
-			<!-- ENDIF tags.length -->
+				<!-- IF tags.length -->
+				<!-- IMPORT partials/tags_list.tpl -->
+				<!-- ENDIF tags.length -->
 
-			{{{ if categories.length }}}
-			<ul class="categories">
-				{{{each categories}}}
-				<!-- IMPORT partials/categories/item.tpl -->
-				{{{end}}}
-			</ul>
-			{{{ end }}}
+				{{{ if categories.length }}}
+				<ul class="categories">
+					{{{each categories}}}
+					<!-- IMPORT partials/categories/item.tpl -->
+					{{{end}}}
+				</ul>
+				{{{ end }}}
 
-			<!-- IMPORT partials/paginator.tpl -->
+				<!-- IMPORT partials/paginator.tpl -->
+			</div>
+		</div>
+		<div data-widget-area="sidebar" class="col-lg-3 col-sm-12 <!-- IF !widgets.sidebar.length -->hidden<!-- ENDIF !widgets.sidebar.length -->">
+			{{{each widgets.sidebar}}}
+			{{widgets.sidebar.html}}
+			{{{end}}}
 		</div>
 	</div>
 </div>

package/templates/tag.tpl

@@ -5,27 +5,25 @@
 	{{{end}}}
 </div>
 <div class="tag">
-	<div class="topic-list-header btn-toolbar">
-		<div class="pull-left">
+	<div class="topic-list-header sticky-top btn-toolbar justify-content-between py-2 mb-2 gap-1 flex-nowrap overflow-auto">
+		<div class="d-flex gap-1 align-items-stretch">
 			<!-- IF loggedIn -->
 			<!-- IMPORT partials/buttons/newTopic.tpl -->
 			<!-- ELSE -->
 			<a component="category/post/guest" href="{config.relative_path}/login" class="btn btn-primary">[[category:guest-login-post]]</a>
 			<!-- ENDIF loggedIn -->
 		</div>
-
-		<div class="btn-group pull-right">
+		<div class="d-flex gap-1 align-items-stretch">
+		<!-- IMPORT partials/category-filter-right.tpl -->
 		<!-- IMPORT partials/category/tools.tpl -->
 		</div>
-
-		<!-- IMPORT partials/category-filter-right.tpl -->
 	</div>
 
-	<!-- IF !topics.length -->
-	<div class="alert alert-warning">[[tags:no_tag_topics]]</div>
-	<!-- ENDIF !topics.length -->
-
 	<div class="category">
+		<!-- IF !topics.length -->
+		<div class="alert alert-warning">[[tags:no_tag_topics]]</div>
+		<!-- ENDIF !topics.length -->
+
 		<!-- IMPORT partials/topics_list.tpl -->
 		<button id="load-more-btn" class="btn btn-primary hide">[[unread:load_more]]</button>
 		<!-- IF config.usePagination -->

package/templates/tags.tpl

@@ -7,11 +7,13 @@
 <div class="tags">
 	<!-- IF displayTagSearch -->
 	<!-- IF tags.length -->
-	<div class="row">
-		<div class="col-lg-12">
+	<div class="row justify-content-end mb-3">
+		<div class="col-lg-3">
 			<div class="input-group">
 				<input type="text" class="form-control" placeholder="[[global:search]]" id="tag-search">
-				<span class="input-group-addon search-button"><i class="fa fa-search"></i></span>
+				<button class="btn btn-primary" type="button">
+					<i class="fa fa-search"></i>
+				</button>
 			</div>
 		</div>
 	</div>

package/templates/top.tpl

@@ -5,45 +5,19 @@
 	{{{end}}}
 </div>
 <div class="top">
-	<div class="topic-list-header btn-toolbar">
-		<div class="pull-left">
-			<!-- IF loggedIn -->
+	<div class="topic-list-header sticky-top btn-toolbar justify-content-between py-2 mb-2 gap-1 flex-nowrap overflow-auto">
+		<div class="d-flex gap-1 align-items-stretch">
+			{{{ if canPost }}}
 			<!-- IMPORT partials/buttons/newTopic.tpl -->
-			<!-- ELSE -->
+			{{{ else }}}
 			<a component="category/post/guest" href="{config.relative_path}/login" class="btn btn-primary">[[category:guest-login-post]]</a>
-			<!-- ENDIF loggedIn -->
+			{{{ end }}}
 		</div>
-
-		<div class="btn-group pull-right">
-		<!-- IMPORT partials/category/tools.tpl -->
-		</div>
-
+		<div class="d-flex gap-1 align-items-stretch">
+		<!-- IMPORT partials/topic-terms.tpl -->
+		<!-- IMPORT partials/topic-filters.tpl -->
 		<!-- IMPORT partials/category-filter-right.tpl -->
-
-		<div class="btn-group pull-right bottom-sheet <!-- IF !filters.length -->hidden<!-- ENDIF !filters.length -->">
-			<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
-				<span class="visible-sm-inline visible-md-inline visible-lg-inline">{selectedFilter.name}</span><span class="visible-xs-inline"><i class="fa fa-fw {selectedFilter.icon}"></i></span> <span class="caret"></span>
-			</button>
-			<ul class="dropdown-menu" role="menu">
-				{{{each filters}}}
-				<li role="presentation" class="category {{{if filters.selected}}}selected{{{end}}}">
-					<a role="menu-item" href="{config.relative_path}/{filters.url}"><i class="fa fa-fw <!-- IF filters.selected -->fa-check<!-- ENDIF filters.selected -->"></i>{filters.name}</a>
-				</li>
-				{{{end}}}
-			</ul>
-		</div>
-
-		<div class="btn-group pull-right <!-- IF !terms.length -->hidden<!-- ENDIF !terms.length -->">
-			<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
-			{selectedTerm.name} <span class="caret"></span>
-			</button>
-			<ul class="dropdown-menu" role="menu">
-				{{{each terms}}}
-				<li role="presentation" class="category">
-					<a role="menu-item" href="{config.relative_path}/{terms.url}"><i class="fa fa-fw <!-- IF terms.selected -->fa-check<!-- ENDIF terms.selected -->"></i>{terms.name}</a>
-				</li>
-				{{{end}}}
-			</ul>
+		<!-- IMPORT partials/category/tools.tpl -->
 		</div>
 	</div>
 

package/templates/topic.tpl

@@ -5,7 +5,7 @@
 </div>
 <div class="row">
 	<div class="topic <!-- IF widgets.sidebar.length -->col-lg-9 col-sm-12<!-- ELSE -->col-lg-12<!-- ENDIF widgets.sidebar.length -->">
-		<div class="topic-header">
+		<div class="topic-header sticky-top">
 			<h1 component="post/header" class="" itemprop="name">
 				<span class="topic-title">
 					<span component="topic/labels">
@@ -20,24 +20,22 @@
 			</h1>
 
 			<div class="topic-info clearfix">
-				<div class="category-item inline-block">
-					<div role="presentation" class="icon pull-left" style="{function.generateCategoryBackground, category}">
-						<i class="fa fa-fw {category.icon}"></i>
-					</div>
+				<div class="category-item d-inline-block">
+					{buildCategoryIcon(category, "24px", "rounded-circle")}
 					<a href="{config.relative_path}/category/{category.slug}">{category.name}</a>
 				</div>
 
-				<div class="tags tag-list inline-block hidden-xs">
+				<div class="tags tag-list d-inline-block hidden-xs">
 					<!-- IMPORT partials/topic/tags.tpl -->
 				</div>
-				<div class="inline-block hidden-xs">
+				<div class="d-inline-block hidden-xs">
 					<!-- IMPORT partials/topic/stats.tpl -->
 				</div>
 				{{{ if !feeds:disableRSS }}}
 				{{{ if rssFeedUrl }}}<a class="hidden-xs" target="_blank" href="{rssFeedUrl}"><i class="fa fa-rss-square"></i></a>{{{ end }}}
 				{{{ end }}}
 				{{{ if browsingUsers }}}
-				<div class="inline-block hidden-xs">
+				<div class="d-inline-block hidden-xs">
 				<!-- IMPORT partials/topic/browsing-users.tpl -->
 				</div>
 				{{{ end }}}
@@ -47,8 +45,8 @@
 		</div>
 		<!-- IF merger -->
 		<div component="topic/merged/message" class="alert alert-warning clearfix">
-			<span class="pull-left">[[topic:merged_message, {config.relative_path}/topic/{mergeIntoTid}, {merger.mergedIntoTitle}]]</span>
-			<span class="pull-right">
+			<span class="float-start">[[topic:merged_message, {config.relative_path}/topic/{mergeIntoTid}, {merger.mergedIntoTitle}]]</span>
+			<span class="float-end">
 				<a href="{config.relative_path}/user/{merger.userslug}">
 					<strong>{merger.username}</strong>
 				</a>
@@ -71,7 +69,11 @@
 
 					<!-- IMPORT partials/topic/post.tpl -->
 				</li>
-				{renderTopicEvents(@index, config.topicPostSort)}
+				{{{ if (config.topicPostSort != "most_votes") }}}
+				{{{ each ./events}}}
+				<!-- IMPORT partials/topic/event.tpl -->
+				{{{ end }}}
+				{{{ end }}}
 			{{{end}}}
 		</ul>
 

package/templates/tos.tpl

@@ -1,4 +1,4 @@
-<h3>[[register:terms_of_use]]</h3>
-<hr/>
-
-{termsOfUse}
+<h3>[[register:terms_of_use]]</h3>
+<hr/>
+
+{termsOfUse}

package/templates/unread.tpl

@@ -5,35 +5,23 @@
 	{{{end}}}
 </div>
 <div class="unread">
-	<div class="topic-list-header btn-toolbar">
-		<div class="pull-left">
+	<div class="topic-list-header sticky-top btn-toolbar justify-content-between py-2 mb-2 gap-1 flex-nowrap overflow-auto">
+		<div class="d-flex gap-1 align-items-stretch">
 			<!-- IMPORT partials/buttons/newTopic.tpl -->
-			<a href="{config.relative_path}/{selectedFilter.url}{querystring}" class="inline-block">
-				<div class="alert alert-warning hide" id="new-topics-alert"></div>
+			<a href="{config.relative_path}/{selectedFilter.url}{querystring}" class="d-inline-block">
+				<div class="alert alert-warning h-100 m-0 px-2 py-1 d-flex align-items-center hide" id="new-topics-alert"></div>
 			</a>
 		</div>
 
-		<div class="btn-group pull-right">
-		<!-- IMPORT partials/category/tools.tpl -->
-		</div>
+		<div class="d-flex gap-1 align-items-stretch">
+		<!-- IMPORT partials/topic-filters.tpl -->
+		<!-- IMPORT partials/category-filter-right.tpl -->
 
-		<div class="markread btn-group pull-right {{{ if !topics.length }}}hidden{{{ end }}}">
-		<!-- IMPORT partials/category-selector-right.tpl -->
+		<div class="markread btn-group {{{ if !topics.length }}}hidden{{{ end }}}">
+			<!-- IMPORT partials/category-selector-right.tpl -->
 		</div>
 
-		<!-- IMPORT partials/category-filter-right.tpl -->
-
-		<div class="btn-group pull-right bottom-sheet">
-			<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
-				<span class="visible-sm-inline visible-md-inline visible-lg-inline">{selectedFilter.name}</span><span class="visible-xs-inline"><i class="fa fa-fw {selectedFilter.icon}"></i></span> <span class="caret"></span>
-			</button>
-			<ul class="dropdown-menu" role="menu">
-				{{{each filters}}}
-				<li role="presentation" class="category {{{if filters.selected}}}selected{{{end}}}">
-					<a role="menu-item" href="{config.relative_path}/{filters.url}"><i class="fa fa-fw <!-- IF filters.selected -->fa-check<!-- ENDIF filters.selected -->"></i>{filters.name}</a>
-				</li>
-				{{{end}}}
-			</ul>
+		<!-- IMPORT partials/category/tools.tpl -->
 		</div>
 	</div>
 

package/templates/users.tpl

@@ -1,47 +1,34 @@
 <!-- IMPORT partials/breadcrumbs.tpl -->
-
 <div data-widget-area="header">
 	{{{each widgets.header}}}
 	{{widgets.header.html}}
 	{{{end}}}
 </div>
 <div class="users">
-	<div class="row">
+	<div class="row mb-3">
 		<div class="col-lg-6">
 		<!-- IMPORT partials/users_list_menu.tpl -->
 		</div>
-		<div class="col-xs-3 text-right">
+		<div class="col-3 text-end">
 			<!-- IF showInviteButton -->
 			<button component="user/invite" class="btn btn-success"><i class="fa fa-users"></i> [[users:invite]]</button>
 			<!-- ENDIF showInviteButton -->
 		</div>
 		<!-- IF displayUserSearch -->
-		<div class="col-lg-3 col-xs-9">
+		<div class="col-lg-3 col-9">
 			<div class="search">
 				<div class="input-group">
-					<input class="form-control" id="search-user" type="text" placeholder="[[users:enter_username]]"/>
-					<span class="input-group-addon">
+					<input class="form-control" id="search-user" type="text" placeholder="[[global:search]]"/>
+					<button class="btn btn-primary" type="button">
 						<i component="user/search/icon" class="fa fa-search"></i>
-					</span>
+					</button>
 				</div>
 			</div>
 		</div>
 		<!-- ENDIF displayUserSearch -->
 	</div>
 
-	<ul id="users-container" class="users-container">
-		<!-- IMPORT partials/users_list.tpl -->
-		<!-- IF anonymousUserCount -->
-		<li class="users-box anon-user">
-			<div class="avatar avatar-lg avatar-rounded">G</div>
-			<br/>
-			<div class="user-info">
-				<span id="online_anon_count">{anonymousUserCount}</span>
-				<span>[[global:guests]]</span>
-			</div>
-		</li>
-		<!-- ENDIF anonymousUserCount -->
-	</ul>
+	<!-- IMPORT partials/users_list.tpl -->
 
 	<!-- IMPORT partials/paginator.tpl -->
 </div>

package/theme.json

@@ -1,7 +1,7 @@
-{
-    "id": "nodebb-theme-persona",
-    "name": "Persona",
-    "description": "The default theme for NodeBB. Uses a standard approach to forum design.",
-    "url": "https://github.com/psychobunny/nodebb-theme-persona",
-    "screenshot": "screenshot.png"
+{
+    "id": "nodebb-theme-persona",
+    "name": "Persona",
+    "description": "The default theme for NodeBB. Uses a standard approach to forum design.",
+    "url": "https://github.com/psychobunny/nodebb-theme-persona",
+    "screenshot": "screenshot.png"
 }

package/theme.scss

@@ -0,0 +1 @@
+@import "./scss/persona";