Merge branch 'master' of https://github.com/NodeBB/nodebb-theme-persona

less/groups.less

@@ -1,3 +1,15 @@
+.group-label {
+	display: inline-block;
+	text-transform: uppercase;
+	vertical-align: middle;
+	padding: 4px;
+	border-radius: 2px;
+	max-width: 150px;
+	overflow-x: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
 .groups.details {
 	margin-top: 200px;
 
@@ -104,6 +116,11 @@
 		}
 	}
 
+	h1 {
+		overflow-wrap: break-word;
+		margin-top: 0;
+	}
+
 	.owner-controls {
 		margin-top: -6px;
 	}
@@ -133,6 +150,12 @@
 			padding: .2em .3em .1em;
 		}
 	}
+
+	.options {
+		.user-title-option span.label {
+			.group-label;
+		}
+	}
 }
 
 .groups.list {
@@ -155,6 +178,10 @@
 				color: white;
 				font-weight: bold;
 				text-transform: capitalize;
+				white-space: nowrap;
+				text-overflow: ellipsis;
+				overflow-x: hidden;
+				max-width: 100%;
 			}
 		}
 

less/header.less

@@ -269,7 +269,6 @@
 
 	font-size: 16px;
 	padding: 0;
-	padding-left: 0.5em;
 	background: none;
 
 	@media (max-width: @screen-xs-max) {

less/style.less

@@ -46,7 +46,7 @@ a:hover, .btn-link:hover, .btn-link:active, .btn-link:focus {
 	list-style-type: none;
 
 	li {
-		vertical-align: top;
+		vertical-align: middle;
 		background: transparent;
 		margin: 0.25em;
 		.pointer;

less/topic.less

@@ -11,7 +11,7 @@
 			word-wrap: break-word;
 			font-size: 28px;
 			color:inherit;
-			line-height: 32px;
+			line-height: 36px;
 			overflow: hidden;
 		}
 
@@ -96,13 +96,6 @@
 		.status {
 			vertical-align: 0%;
 		}
-
-		.group-label {
-			text-transform: uppercase;
-			vertical-align: 5%;
-			padding: 4px;
-			border-radius: 2px;
-		}
 	}
 
 	.bookmarked {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-theme-persona",
-  "version": "9.1.19",
+  "version": "9.1.27",
   "nbbpm": {
     "compatibility": "^1.12.0"
   },

templates/account/profile.tpl

@@ -128,7 +128,7 @@
 			</div>
 			<div class="panel-body">
 			<!-- BEGIN ips -->
-				<div>{ips.ip}</div>
+				<div>{ips}</div>
 			<!-- END ips -->
 			</div>
 		</div>

templates/groups/details.tpl

@@ -175,12 +175,18 @@
 
 					<div class="form-group user-title-option">
 						<label>[[groups:details.badge_preview]]</label><br />
-						<span class="label<!-- IF !group.userTitleEnabled --> hide<!-- ENDIF !group.userTitleEnabled -->" style="background-color: {group.labelColor}"><i class="fa<!-- IF group.icon --> {group.icon}<!-- ENDIF group.icon -->"></i> <!-- IF group.userTitle -->{group.userTitle}<!-- ELSE -->{group.displayName}<!-- ENDIF group.userTitle --></span>
+						<span class="label<!-- IF !group.userTitleEnabled --> hide<!-- ENDIF !group.userTitleEnabled -->" style="color: {group.textColor}; background-color: {group.labelColor}"><i class="fa<!-- IF group.icon --> {group.icon}<!-- ENDIF group.icon -->"></i> <!-- IF group.userTitle -->{group.userTitle}<!-- ELSE -->{group.displayName}<!-- ENDIF group.userTitle --></span>
-
+						<hr/>
 						<button component="groups/userTitleOption" type="button" class="btn btn-default btn-sm" data-action="icon-select"<!-- IF !group.userTitleEnabled --> disabled<!-- ENDIF !group.userTitleEnabled -->>[[groups:details.change_icon]]</button>
-						<button component="groups/userTitleOption" type="button" class="btn btn-default btn-sm" data-action="color-select"<!-- IF !group.userTitleEnabled --> disabled<!-- ENDIF !group.userTitleEnabled -->>[[groups:details.change_colour]]</button>
+
+						<button component="groups/userTitleOption" type="button" class="btn btn-default btn-sm" data-action="label-color-select"<!-- IF !group.userTitleEnabled --> disabled<!-- ENDIF !group.userTitleEnabled -->>[[groups:details.change_label_colour]]</button>
+
+						<button component="groups/userTitleOption" type="button" class="btn btn-default btn-sm" data-action="text-color-select"<!-- IF !group.userTitleEnabled --> disabled<!-- ENDIF !group.userTitleEnabled -->>[[groups:details.change_text_colour]]</button>
+
 						<input type="hidden" name="labelColor" value="<!-- IF group.labelColor -->{group.labelColor}<!-- ENDIF group.labelColor -->" />
+						<input type="hidden" name="textColor" value="<!-- IF group.textColor -->{group.textColor}<!-- ENDIF group.textColor -->" />
 						<input type="hidden" name="icon" value="<!-- IF group.icon -->{group.icon}<!-- ENDIF group.icon -->" />
+
 						<div id="icons" class="hidden">
 							<div class="icon-container">
 								<div class="row fa-icons">

templates/partials/menu.tpl

@@ -191,7 +191,7 @@
 
 				<ul class="nav navbar-nav navbar-right hidden-xs">
 					<li>
-						<a href="#" id="reconnect" class="hide" title="Connection to {config.siteTitle} has been lost, attempting to reconnect...">
+						<a href="#" id="reconnect" class="hide" title="[[global:reconnecting-message, {config.siteTitle}]]">
 							<i class="fa fa-check"></i>
 						</a>
 					</li>

templates/partials/quick-search-results.tpl

@@ -1,6 +1,6 @@
 <!-- BEGIN posts -->
 <li>
-    <a href="/post/{posts.pid}">
+    <a href="{config.relative_path}/post/{posts.pid}">
         <!-- IF posts.user.picture -->
         <img title="{posts.user.username}" class="avatar avatar-sm avatar-rounded" src="{posts.user.picture}" />
         <!-- ELSE -->
@@ -17,7 +17,9 @@
         </small>
      </a>
 </li>
+<!-- IF !@last -->
 <li role="separator" class="divider"></li>
+<!-- ENDIF -->
 <!-- END posts -->
 <!-- IF multiplePages -->
 <li class="text-center">

templates/partials/topic/badge.tpl

@@ -1,5 +1,5 @@
 <!-- BEGIN posts.user.selectedGroups -->
 <!-- IF posts.user.selectedGroups.slug -->
-<a href="{config.relative_path}/groups/{posts.user.selectedGroups.slug}"><small class="label group-label inline-block" style="background-color: {posts.user.selectedGroups.labelColor};"><!-- IF posts.user.selectedGroups.icon --><i class="fa {posts.user.selectedGroups.icon}"></i> <!-- ENDIF posts.user.selectedGroups.icon -->{posts.user.selectedGroups.userTitle}</small></a>
+<a href="{config.relative_path}/groups/{posts.user.selectedGroups.slug}"><small class="label group-label inline-block" style="color:{posts.user.selectedGroups.textColor};background-color: {posts.user.selectedGroups.labelColor};"><!-- IF posts.user.selectedGroups.icon --><i class="fa {posts.user.selectedGroups.icon}"></i> <!-- ENDIF posts.user.selectedGroups.icon -->{posts.user.selectedGroups.userTitle}</small></a>
 <!-- ENDIF posts.user.selectedGroups.slug -->
 <!-- END posts.user.selectedGroups -->