Index: trunk/src/bp-templates/bp-legacy/css/twentyseventeen.scss
===================================================================
--- trunk/src/bp-templates/bp-legacy/css/twentyseventeen.scss	(revision 11586)
+++ trunk/src/bp-templates/bp-legacy/css/twentyseventeen.scss	(revision 11587)
@@ -22,6 +22,6 @@
 // In addition BP will use the em breakpoints as  referenced below to provide
 // a series of finer breakpoints for max widths, to allow fine adjustments;
-// For main structural elements we use the themes values, only using bp breakpoints
-// to manage granular elements in loops etc.
+// For main structural elements we use the themes values, only using bp
+// breakpoints to manage granular elements in loops etc.
 
 $x-small-only-bp: "max-width: 22em"; // for xtra small mobile only
@@ -40,5 +40,7 @@
 
 @mixin x-small-only {
-	@media screen and ($x-small-only-bp){
+
+	@media screen and ($x-small-only-bp) {
+
 		@content;
 	}
@@ -46,5 +48,7 @@
 
 @mixin small-only {
-	@media screen and ($small-only-bp){
+
+	@media screen and ($small-only-bp) {
+
 		@content;
 	}
@@ -52,5 +56,7 @@
 
 @mixin medium-only-bp {
-	@media screen and ($med-only-bp){
+
+	@media screen and ($med-only-bp) {
+
 		@content;
 	}
@@ -58,5 +64,7 @@
 
 @mixin small-up-bp {
-	@media screen and ($small-up-bp){
+
+	@media screen and ($small-up-bp) {
+
 		@content;
 	}
@@ -64,5 +72,7 @@
 
 @mixin small-up {
-	@media screen and ($small-up-2017){
+
+	@media screen and ($small-up-2017) {
+
 		@content;
 	}
@@ -70,5 +80,7 @@
 
 @mixin med-small-up {
+
 	@media screen and ($med-small-up-2017) {
+
 		@content;
 	}
@@ -76,5 +88,7 @@
 
 @mixin medium-up {
+
 	@media screen and ($medium-up-2017) {
+
 		@content;
 	}
@@ -82,5 +96,7 @@
 
 @mixin large-up {
+
 	@media screen and ($large-up-2017) {
+
 		@content;
 	}
@@ -88,5 +104,7 @@
 
 @mixin x-large-up {
+
 	@media screen and ($x-large-up-2017) {
+
 		@content;
 	}
@@ -229,4 +247,5 @@
 $unread:             $x-light-grey;
 $link-action:        #c82b2b;
+
 /*--------------------------------------------------------------
 
@@ -241,5 +260,6 @@
 in your child themes root & either start over or modify the rulesets.
 
-If you do not require the styles you can dequeue them from the themes functions file.
+If you do not require the styles you can dequeue them from the themes
+functions file.
 
 Please see this codex article for more information:
@@ -292,5 +312,7 @@
 .buddypress {
 	// Remove any empty clearing elements, CSS provides clearing.
-	div.clear {display: none;}
+	div.clear {
+		display: none;
+	}
 
 	// deal with global clearing property set on heading elements
@@ -298,4 +320,5 @@
 
 	ul.item-list {
+
 		h1,
 		h2,
@@ -395,5 +418,5 @@
 
 // Some element colors are inherited from BP original sheet so need to
-// to be reset under the dark scheme, where set in this sheet we simply state them
+// be reset under the dark scheme, where set in this sheet we simply state them
 // only for the light scheme, additionally elements such as BP form styles
 // need styles removing & are handled later in 'Forms' section
@@ -441,6 +464,6 @@
 		}
 
-		// With the dark scheme the subnav links lose definition as
-		// nav menu links, add a border top to clarify the li.last element seperated from links.
+		// With the dark scheme the subnav links lose definition as nav menu links,
+		// add a border top to clarify the li.last element seperated from links.
 		#subnav.item-list-tabs {
 
@@ -480,4 +503,5 @@
 			.activity-meta,
 			.action {
+
 				a {
 					background: $off-white;
@@ -500,4 +524,5 @@
 
 		#item-header {
+
 			.user-nicename {
 				color: $bp-xlight-text;
@@ -560,5 +585,7 @@
 		#subnav {
 
-			li {background: none;}
+			li {
+				background: none;
+			}
 
 			.groups-members-search {
@@ -713,5 +740,7 @@
 				a {
 
-					span {border-radius: 25%;}
+					span {
+						border-radius: 25%;
+					}
 				}
 			}
@@ -753,4 +782,5 @@
 
 			@include small-up-bp {
+
 				li {
 					float: left;
@@ -787,4 +817,5 @@
 				label,
 				option {
+
 					@include font-size(14);
 				}
@@ -797,4 +828,5 @@
 
 			@include small-up-bp {
+
 				li.last {
 					text-align: right;
@@ -854,5 +886,7 @@
 					margin: 0 0 0 (-$spacing-val-md);
 
-					ul {margin-top: 0;}
+					ul {
+						margin-top: 0;
+					}
 				}
 			}
@@ -898,4 +932,5 @@
 					border: 1px solid $border-med;
 					border-bottom-color: $content-background;
+
 					@include border-top-radius(4px);
 					margin-bottom: -1px;
@@ -912,4 +947,5 @@
 
 		#subnav {
+
 			ul {
 				border-bottom: 0;
@@ -940,5 +976,8 @@
 		}
 
-		.pag-count {margin-left: 0;}
+		.pag-count {
+			margin-left: 0;
+		}
+
 		.pagination-links {
 			margin-right: 0;
@@ -957,5 +996,8 @@
 				overflow: visible;
 				width: auto;
-				&:before {display: none;}
+
+				&:before {
+					display: none;
+				}
 			}
 
@@ -986,4 +1028,5 @@
 		.activity-header,
 		.activity-meta {
+
 			@include default-font-sans();
 		}
@@ -1046,5 +1089,7 @@
 				text-align: center;
 
-				a {border-bottom: 0;}
+				a {
+					border-bottom: 0;
+				}
 
 				img.avatar {
@@ -1078,4 +1123,5 @@
 
 				.item-title {
+
 					@include font-size(18);
 					line-height: 1.2;
@@ -1090,7 +1136,9 @@
 					.update {
 						display: block;
+
 						@include font-size(13);
 
 						@include medium-up {
+
 							@include font-size(14);
 						}
@@ -1118,5 +1166,6 @@
 
 					.item-title {
-						@include font-size(22)
+
+						@include font-size(22);
 					}
 				}
@@ -1194,4 +1243,5 @@
 
 #buddypress {
+
 	form#whats-new-form {
 
@@ -1219,5 +1269,5 @@
 					border: 1px solid rgba($border-color, 0.5);
 					float: left;
-					line-height: 1.5em;
+					line-height: 1.5;
 					margin-top: 12px;
 					padding-left: 0.2em;
@@ -1235,4 +1285,5 @@
 
 				@include small-up {
+
 					#whats-new-post-in-box {
 						width: auto;
@@ -1251,4 +1302,5 @@
 	// User account form requires matching bp default specificity
 	#item-body {
+
 		form#whats-new-form {
 			margin: $spacing-val-lg 0;
@@ -1294,4 +1346,5 @@
 
 				.activity-header {
+
 					@include font-size(14);
 
@@ -1308,5 +1361,8 @@
 					margin-right: $spacing-val-sm;
 					text-align: left;
-					a {border-bottom: 0;}
+
+					a {
+						border-bottom: 0;
+					}
 				}
 
@@ -1316,4 +1372,5 @@
 
 					.activity-header {
+
 						@include font-size(16);
 					}
@@ -1341,4 +1398,5 @@
 
 				.activity-header {
+
 					@include font-size(14);
 				}
@@ -1391,5 +1449,8 @@
 				background: darken($light-background, 1%);
 				border: 1px solid rgba(#9fd1e2, 0.3);
-				a { font-style: italic; }
+
+				a {
+					font-style: italic;
+				}
 			}
 
@@ -1405,4 +1466,5 @@
 
 .activity-permalink {
+
 	#buddypress {
 
@@ -1414,12 +1476,19 @@
 
 			li.mini {
+
 				.activity-header {
+
 					@include font-size(16);
+
 					@include med-small-up {
+
 						@include font-size(20);
 					}
 
 					margin-bottom: $spacing-val-lg;
-					p {padding: $spacing-val-md;}
+
+					p {
+						padding: $spacing-val-md;
+					}
 				}
 			}
@@ -1468,6 +1537,7 @@
 					display: inline-block;
 					font-family: inherit;
+
 					@include font-size(12);
-					font-weight: normal;
+					font-weight: 400;
 					line-height: 1.2;
 					padding: 4px 10px;
@@ -1506,4 +1576,5 @@
 
 			li {
+
 				.item-avatar,
 				.item {
@@ -1558,6 +1629,12 @@
 
 		@include small-up {
-			#profile-details-section {float: right;}
-			#basic-details-section {float: left;}
+
+			#profile-details-section {
+				float: right;
+			}
+
+			#basic-details-section {
+				float: left;
+			}
 		}
 
@@ -1623,4 +1700,5 @@
 		// & reset them for med up  only.
 		#item-header-cover-image {
+
 			.user-nicename {
 				color: $body-text;
@@ -1643,8 +1721,11 @@
 
 			#item-meta {
+
 				@include font-size(14);
 				text-align: left;
 
-				p {margin-bottom: 0.5em;}
+				p {
+					margin-bottom: 0.5em;
+				}
 			}
 		}
@@ -1654,4 +1735,5 @@
 
 		main {
+
 			header.entry-header {
 				padding-bottom: 1rem;
@@ -1676,5 +1758,5 @@
 				.generic-button {
 					float: none;
-					margin: 1.5em 0 0 0;
+					margin: 1.5em 0 0;
 				}
 			}
@@ -1688,4 +1770,5 @@
 
 			#item-header-avatar {
+
 				img.avatar {
 					margin-right: 0;
@@ -1713,5 +1796,7 @@
 
 		@include medium-only-bp {
+
 			#item-header {
+
 				#item-meta {
 					margin-bottom: $spacing-val-md;
@@ -1781,7 +1866,9 @@
 
 				h2 {
+
 					@include font-size(14);
 
 					@include med-small-up {
+
 						@include font-size(16);
 					}
@@ -1827,4 +1914,5 @@
 
 .bp-user {
+
 	#buddypress {
 
@@ -1837,5 +1925,4 @@
 
 				img.avatar,
-
 				a {
 					display: inline-block;
@@ -1931,4 +2018,5 @@
 			background: none;
 			color: inherit;
+
 			@include font-size(14);
 			width: auto;
@@ -1953,4 +2041,5 @@
 			ul {
 				color: rgba($body-text, 0.6);
+
 				@include font-size(14);
 			}
@@ -1981,5 +2070,7 @@
 					float: left;
 
-					> a {border-bottom: 0;}
+					> a {
+						border-bottom: 0;
+					}
 				}
 
@@ -2020,5 +2111,7 @@
 
 	#subnav {
+
 		li {
+
 			@include small-only {
 				background: $content-background;
@@ -2036,5 +2129,8 @@
 
 					label {
-						input[type="text"] {width: 100%;}
+
+						input[type="text"] {
+							width: 100%;
+						}
 					}
 				}
@@ -2073,9 +2169,11 @@
 
 			th {
-				@include font-size(14)
+
+				@include font-size(14);
 			}
 
 			td {
-				@include font-size(12)
+
+				@include font-size(12);
 			}
 
@@ -2087,9 +2185,11 @@
 
 				th {
-					@include font-size(16)
+
+					@include font-size(16);
 				}
 
 				td {
-					@include font-size(14)
+
+					@include font-size(14);
 				}
 			}
@@ -2098,14 +2198,18 @@
 
 				th {
-					@include font-size(18)
+
+					@include font-size(18);
 				}
 
 				td {
-					@include font-size(16)
-				}
-			}
-		}
-
-		.pag-count {font-style: italic;}
+
+					@include font-size(16);
+				}
+			}
+		}
+
+		.pag-count {
+			font-style: italic;
+		}
 
 		.notifications-options-nav,
@@ -2172,5 +2276,7 @@
 			}
 
-			table {margin-top: 0;}
+			table {
+				margin-top: 0;
+			}
 
 			.profile-fields {
@@ -2220,5 +2326,6 @@
 						background: none;
 						border: 0;
-						@include font-size(18)
+
+						@include font-size(18);
 					}
 				} //.button-nav
@@ -2227,4 +2334,5 @@
 				.field-visibility-settings-notoggle,
 				.field-visibility-settings {
+
 					@include font-size(14);
 					margin-top: $spacing-val-sm;
@@ -2234,4 +2342,5 @@
 				.visibility-toggle-link {
 					background: $dark-background;
+
 					@include border-radius(3px);
 					color: #fff;
@@ -2241,6 +2350,10 @@
 
 			.bp-avatar {
+
 				#bp-delete-avatar {
-					a {font-size: inherit; }
+
+					a {
+						font-size: inherit;
+					}
 				}
 			}
@@ -2261,6 +2374,9 @@
 
 		#groups-list {
+
 			li {
+
 				.item {
+
 					@media screen and (min-width: 77.5em) {
 						left: 5%;
@@ -2308,5 +2424,5 @@
 			.message-metadata {
 
-				&::after {
+				&:after {
 					clear: both;
 					content: "";
@@ -2319,4 +2435,5 @@
 
 				@include med-small-up {
+
 					img.avatar {
 						float: left;
@@ -2350,7 +2467,7 @@
 			}
 
-			.bp-tooltip:hover::after,
-			.bp-tooltip:active::after,
-			.bp-tooltip:focus::after {
+			.bp-tooltip:hover:after,
+			.bp-tooltip:active:after,
+			.bp-tooltip:focus:after {
 				right: 40px;
 				text-align: right;
@@ -2422,4 +2539,5 @@
 				td.thread-options {
 					border-left: 0 !important;
+
 					@include calc(width, "100% - 30px");
 					margin-left: 0;
@@ -2435,4 +2553,5 @@
 
 					a {
+
 						@include font-size(12);
 						line-height: 2.2;
@@ -2451,4 +2570,5 @@
 					@include small-only {
 						clear: both;
+
 						@include font-size(11);
 						width: 100%;
@@ -2486,5 +2606,7 @@
 			list-style: none;
 
-			li {margin-left: 0;}
+			li {
+				margin-left: 0;
+			}
 
 			li.friend-tab {
@@ -2543,4 +2665,5 @@
 
 			td:nth-child(2) {
+
 				strong {
 					margin: -8px -8px 8px;
@@ -2570,5 +2693,5 @@
 				}
 
-				a:last-child::after {
+				a:last-child:after {
 					content: attr(title);
 					display: block;
@@ -2586,5 +2709,7 @@
 		padding-left: $spacing-val-sm;
 
-		ul {	margin: 0; }
+		ul {
+			margin: 0;
+		}
 
 		li {
@@ -2613,4 +2738,5 @@
 			// 'p' = email notification screen sub heading
 			> p {
+
 				@include font-size(20);
 				margin: $spacing-val-md 0 $spacing-val-sm;
@@ -2677,7 +2803,7 @@
 			}
 
-			input[type='text'],
-			input[type='email'],
-			input[type='password'],
+			input[type="text"],
+			input[type="email"],
+			input[type="password"],
 			textarea {
 				width: 100%;
@@ -2694,4 +2820,5 @@
 
 		form {
+
 			.ac-textarea {
 				background: $light-background;
@@ -2731,8 +2858,11 @@
 
 	#signup_form.standard-form {
+
 		div.submit {
 			float: none;
 
-			input {margin-right: 0;}
+			input {
+				margin-right: 0;
+			}
 		}
 	}
@@ -2753,4 +2883,5 @@
 		form { // *sigh* only to bludgeon over specified rules
 			border: 1px solid rgba($border-color, 0.6);
+
 			@include border-radius(2px);
 			overflow: hidden;
@@ -2771,4 +2902,5 @@
 			input[type="submit"] {
 				border: 0;
+
 				@include font-size(14);
 				line-height: inherit;
@@ -2782,7 +2914,8 @@
 
 			input[type="submit"] {
+
 				@include border-radius-none();
 				float: right;
-				font-weight: normal;
+				font-weight: 400;
 				padding: 0.2em 1em;
 				text-align: center;
@@ -2794,6 +2927,6 @@
 	} // close .dir-search, .message-search
 
-	// Dirs & certain components hide search hides labels so can't width the label element
-	// adjust so that the input takes reduced width.
+	// Dirs & certain components hide search hides labels so can't width the
+	// label element adjust so that the input takes reduced width.
 
 	div.dir-search {
@@ -2805,5 +2938,5 @@
 	#search-message-form {
 
-		input[type='text'] {
+		input[type="text"] {
 			float: left;
 			margin: 0;
@@ -2815,4 +2948,5 @@
 
 	@include small-up {
+
 		div.dir-search,
 		div.message-search,
@@ -2833,9 +2967,11 @@
 			form {
 
-				input[type='text'] {
+				input[type="text"] {
+
 					@include font-size(16) ;
 				}
 
-				input[type='submit'] {
+				input[type="submit"] {
+
 					@include font-size(16) ;
 				}
@@ -2846,5 +2982,6 @@
 } // close #buddypress
 
-// Adjustments for form elements colors, backgrounds, borders under the dark scheme.
+// Adjustments for form elements colors, backgrounds, borders under
+// the dark scheme.
 body.colors-dark {
 
@@ -2860,4 +2997,5 @@
 					background: #333;
 					border-color: #555;
+
 					@include border-radius(2px);
 					padding: 1px;
@@ -2869,4 +3007,5 @@
 
 				input[type="submit"] {
+
 					@include border-radius(2px);
 				}
@@ -2879,4 +3018,5 @@
 	}
 }
+
 /**
 *-------------------------------------------------------------------------------
@@ -2893,4 +3033,5 @@
 
 	table {
+
 		@include font-size(14);
 		margin: $spacing-val-md 0;
@@ -2909,5 +3050,7 @@
 
 	@include medium-up {
+
 		table {
+
 			@include font-size(16);
 		}
@@ -2971,7 +3114,7 @@
 	.messages-notices {
 
-		.bp-tooltip:hover::after,
-		.bp-tooltip:active::after,
-		.bp-tooltip:focus::after {
+		.bp-tooltip:hover:after,
+		.bp-tooltip:active:after,
+		.bp-tooltip:focus:after {
 			left: 0;
 			margin-top: 20px;
@@ -2999,6 +3142,7 @@
 
 		p {
+
 			@include font-size(18);
-			font-weight: bold;
+			font-weight: 700;
 		}
 
@@ -3006,4 +3150,5 @@
 
 			p {
+
 				@include message-box($notice-info);
 			}
@@ -3013,4 +3158,5 @@
 
 			p {
+
 				@include message-box($notice-update);
 			}
@@ -3026,4 +3172,5 @@
 			border: 1px solid #000;
 			color: $body-text;
+
 			@include font-size(16);
 		}
@@ -3034,5 +3181,5 @@
 // Without direct classes on our mesages ( 'warning')
 // we need to use the body classes
-// todo: If this is class .warning is included in main BP styles remove from here
+// @todo If this class .warning is included in main BP styles remove from here
 
 .delete-group {
@@ -3043,4 +3190,5 @@
 
 			p {
+
 				@include message-box($notice-warning);
 			}
