nodebb-theme-harmony 2.0.0 → 2.0.1

package/scss/modules/nprogress.scss

@@ -1,80 +1,80 @@
-#nprogress {
-	pointer-events: none;
-}
-
-$nprogress-color: $primary;
-
-#nprogress .bar {
-	background: $nprogress-color;
-	position: fixed;
-	z-index: 1031;
-	top: 0;
-	left: 0;
-	width: 100%;
-	height: 2px;
-}
-
-#nprogress .peg {
-	display: block;
-	position: absolute;
-	right: 0px;
-	width: 100px;
-	height: 100%;
-	box-shadow: 0 0 10px $nprogress-color, 0 0 5px $nprogress-color;
-	opacity: 1.0;
-
-	-webkit-transform: rotate(3deg) translate(0px, -4px);
-		-ms-transform: rotate(3deg) translate(0px, -4px);
-			transform: rotate(3deg) translate(0px, -4px);
-}
-
-#nprogress .spinner {
-	display: none;
-	position: fixed;
-	z-index: 1031;
-	top: 15px;
-	right: 15px;
-}
-
-@include media-breakpoint-down(sm) {
-	#nprogress .spinner {
-	  bottom: 15px;
-	  right: 15px;
-	  top: initial;
-	}
-}
-
-
-#nprogress .spinner-icon {
-	width: 18px;
-	height: 18px;
-	box-sizing: border-box;
-
-	border: solid 2px transparent;
-	border-top-color: $nprogress-color;
-	border-left-color: $nprogress-color;
-	border-radius: 50%;
-
-	-webkit-animation: nprogress-spinner 400ms linear infinite;
-			animation: nprogress-spinner 400ms linear infinite;
-}
-
-.nprogress-custom-parent {
-	overflow: hidden;
-	position: relative;
-}
-
-.nprogress-custom-parent #nprogress .spinner,
-.nprogress-custom-parent #nprogress .bar {
-	position: absolute;
-}
-
-@-webkit-keyframes nprogress-spinner {
-	0%   { -webkit-transform: rotate(0deg); }
-	100% { -webkit-transform: rotate(360deg); }
-}
-@keyframes nprogress-spinner {
-	0%   { transform: rotate(0deg); }
-	100% { transform: rotate(360deg); }
-}
-
+#nprogress {
+	pointer-events: none;
+}
+
+$nprogress-color: $primary;
+
+#nprogress .bar {
+	background: $nprogress-color;
+	position: fixed;
+	z-index: 1031;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 2px;
+}
+
+#nprogress .peg {
+	display: block;
+	position: absolute;
+	right: 0px;
+	width: 100px;
+	height: 100%;
+	box-shadow: 0 0 10px $nprogress-color, 0 0 5px $nprogress-color;
+	opacity: 1.0;
+
+	-webkit-transform: rotate(3deg) translate(0px, -4px);
+		-ms-transform: rotate(3deg) translate(0px, -4px);
+			transform: rotate(3deg) translate(0px, -4px);
+}
+
+#nprogress .spinner {
+	display: none;
+	position: fixed;
+	z-index: 1031;
+	top: 15px;
+	right: 15px;
+}
+
+@include media-breakpoint-down(sm) {
+	#nprogress .spinner {
+	  bottom: 15px;
+	  right: 15px;
+	  top: initial;
+	}
+}
+
+
+#nprogress .spinner-icon {
+	width: 18px;
+	height: 18px;
+	box-sizing: border-box;
+
+	border: solid 2px transparent;
+	border-top-color: $nprogress-color;
+	border-left-color: $nprogress-color;
+	border-radius: 50%;
+
+	-webkit-animation: nprogress-spinner 400ms linear infinite;
+			animation: nprogress-spinner 400ms linear infinite;
+}
+
+.nprogress-custom-parent {
+	overflow: hidden;
+	position: relative;
+}
+
+.nprogress-custom-parent #nprogress .spinner,
+.nprogress-custom-parent #nprogress .bar {
+	position: absolute;
+}
+
+@-webkit-keyframes nprogress-spinner {
+	0%   { -webkit-transform: rotate(0deg); }
+	100% { -webkit-transform: rotate(360deg); }
+}
+@keyframes nprogress-spinner {
+	0%   { transform: rotate(0deg); }
+	100% { transform: rotate(360deg); }
+}
+

package/scss/modules/paginator.scss

@@ -1,24 +1,24 @@
-.skin-noskin [component="pagination"] {
-	.page-item.active:not(.disabled) .page-link {
-		color: $body-color;
-		background-color: $gray-300;
-		border-color: $gray-300;
-	}
-
-	.page-item:not(.disabled):hover .page-link {
-		color: $body-color;
-	}
-}
-
-[component="pagination"] {
-	.page-item.active:not(.disabled) .page-link {
-		color: $pagination-active-color;
-	}
-	.page-item:not(.disabled):hover .page-link {
-		color: $pagination-hover-color;
-		background-color: $pagination-hover-bg;
-	}
-	.page-item:not(.disabled) .page-link {
-		color: $body-color;
-	}
+.skin-noskin [component="pagination"] {
+	.page-item.active:not(.disabled) .page-link {
+		color: $body-color;
+		background-color: $gray-300;
+		border-color: $gray-300;
+	}
+
+	.page-item:not(.disabled):hover .page-link {
+		color: $body-color;
+	}
+}
+
+[component="pagination"] {
+	.page-item.active:not(.disabled) .page-link {
+		color: $pagination-active-color;
+	}
+	.page-item:not(.disabled):hover .page-link {
+		color: $pagination-hover-color;
+		background-color: $pagination-hover-bg;
+	}
+	.page-item:not(.disabled) .page-link {
+		color: $body-color;
+	}
 }

package/scss/modules/tags.scss

@@ -1,6 +1,6 @@
-.tag-list {
-	.tag {
-		background-color: $gray-200!important;
-		color: $gray-700!important;
-	}
+.tag-list {
+	.tag {
+		background-color: $gray-200!important;
+		color: $gray-700!important;
+	}
 }

package/scss/modules/topic-navigator.scss

@@ -1,53 +1,53 @@
-.pagination-block { display: none; }
-
-body.template-topic {
-	// used for both sidebar and bottom bar pagination-block
-	.pagination-block {
-		display: block;
-		transition: opacity 250ms ease-in;
-		opacity: 0;
-		&.ready {
-			opacity: 1;
-		}
-		&.noreplies {
-			pointer-events: none;
-			cursor: none;
-		}
-	}
-}
-
-.topic .pagination-block {
-	.scroller-content {
-		min-width: 170px;
-	}
-	.scroller-container {
-		left: 10px;
-		height: 300px;
-		border-left: 2px solid $border-color;
-
-		.scroller-thumb {
-			left: -5px;
-			&:not(.active) {
-				transition: top 100ms linear;
-			}
-			cursor: grab;
-			&.active {
-				cursor: grabbing;
-			}
-		}
-
-		.unread {
-			width: 1px;
-			height: 0; // initial
-			bottom: 0;
-			background: $primary;
-			transition: $transition-base;
-			left: -1px;
-
-			.meta {
-				left: 5px;
-				font-size: 13px;
-			}
-		}
-	}
+.pagination-block { display: none; }
+
+body.template-topic {
+	// used for both sidebar and bottom bar pagination-block
+	.pagination-block {
+		display: block;
+		transition: opacity 250ms ease-in;
+		opacity: 0;
+		&.ready {
+			opacity: 1;
+		}
+		&.noreplies {
+			pointer-events: none;
+			cursor: none;
+		}
+	}
+}
+
+.topic .pagination-block {
+	.scroller-content {
+		min-width: 170px;
+	}
+	.scroller-container {
+		left: 10px;
+		height: 300px;
+		border-left: 2px solid $border-color;
+
+		.scroller-thumb {
+			left: -5px;
+			&:not(.active) {
+				transition: top 100ms linear;
+			}
+			cursor: grab;
+			&.active {
+				cursor: grabbing;
+			}
+		}
+
+		.unread {
+			width: 1px;
+			height: 0; // initial
+			bottom: 0;
+			background: $primary;
+			transition: $transition-base;
+			left: -1px;
+
+			.meta {
+				left: 5px;
+				font-size: 13px;
+			}
+		}
+	}
 }

package/scss/modules/topics-list.scss

@@ -1,40 +1,40 @@
-ul.topics-list, ul.categories-list {
-	li {
-		&.deleted {
-			.meta, .topic-thumbs { visibility: hidden!important; }
-			opacity: 0.65;
-		}
-
-		&.selected {
-			background-color: mix($body-bg, $body-color, 90%);
-			[component="topic/select"] {
-				color: $success!important;
-				visibility: visible;
-			}
-		}
-		p {
-			margin: 0 !important;
-		}
-
-		// all other skins use link-color for unread titles
-		&.unread .title {
-			color: $link-color;
-		}
-
-		.ui-sortable-handle {
-			cursor: move;
-		}
-
-		// if only one thumb don't display
-		[data-numthumbs="1"] { display: none; }
-	}
-}
-
-// on default skin use primary color for unread titles
-.skin-noskin {
-	ul.topics-list, ul.categories-list {
-		li.unread .title {
-			color: $primary;
-		}
-	}
-}
+ul.topics-list, ul.categories-list {
+	li {
+		&.deleted {
+			.meta, .topic-thumbs { visibility: hidden!important; }
+			opacity: 0.65;
+		}
+
+		&.selected {
+			background-color: mix($body-bg, $body-color, 90%);
+			[component="topic/select"] {
+				color: $success!important;
+				visibility: visible;
+			}
+		}
+		p {
+			margin: 0 !important;
+		}
+
+		// all other skins use link-color for unread titles
+		&.unread .title {
+			color: $link-color;
+		}
+
+		.ui-sortable-handle {
+			cursor: move;
+		}
+
+		// if only one thumb don't display
+		[data-numthumbs="1"] { display: none; }
+	}
+}
+
+// on default skin use primary color for unread titles
+.skin-noskin {
+	ul.topics-list, ul.categories-list {
+		li.unread .title {
+			color: $primary;
+		}
+	}
+}

package/scss/modules/user-menu.scss

@@ -1,11 +1,11 @@
-[component="header/usercontrol"] {
-	[component="header/profilelink"] > div, .user-status > div {
-		min-width: 1.25em; // match fontawesome fixed width
-	}
-	.user-status i.fa-check {
-		display: none;
-	}
-	.user-status.selected i.fa-check {
-		display: block;
-	}
+[component="header/usercontrol"] {
+	[component="header/profilelink"] > div, .user-status > div {
+		min-width: 1.25em; // match fontawesome fixed width
+	}
+	.user-status i.fa-check {
+		display: none;
+	}
+	.user-status.selected i.fa-check {
+		display: block;
+	}
 }

package/scss/overrides.scss

@@ -1,66 +1,66 @@
-// only overrides to bs5 variables here
-
-// Harmony colours
-$white:    #fff !default;
-$gray-100: #f8f9fa !default;
-$gray-200: #e9ecef !default;
-$gray-300: #dee2e6 !default;
-$gray-400: #ced4da !default;
-$gray-500: #adb5bd !default;
-$gray-600: #6c757d !default;
-$gray-700: #495057 !default;
-$gray-800: #343a40 !default;
-$gray-900: #212529 !default;
-$black:    #000 !default;
-
-$blue:    #0d6efd !default;
-$red:     #dc3545 !default;
-$yellow:  #ffc107 !default;
-$green:   #198754 !default;
-$cyan:    #0dcaf0 !default;
-
-$primary:       $blue !default;
-$secondary:     $gray-600 !default;
-$success:       $green !default;
-$info:          $cyan !default;
-$warning:       $yellow !default;
-$danger:        $red !default;
-$light:         $gray-100 !default;
-$dark:          $gray-900 !default;
-
-$body-color: 		$gray-800 !default;
-$body-bg: 			$white !default;
-$body-tertiary-bg: 	$gray-200 !default;
-$text-muted: 		$gray-600 !default;
-$border-color: 		$gray-200 !default;
-$link-color: 		#0951be !default;
-
-$form-check-input-border: var(--bs-border-width) solid $gray-500 !default;
-
-$input-placeholder-color: $gray-600!important;
-
-// no caret on dropdown-toggle
-$enable-caret: false;
-
-// disable smooth scroll, this makes window.scrollTo(0,0) in ajaxify.js take x milliseconds
-$enable-smooth-scroll: false;
-
-$enable-shadows: true;
-
-$link-decoration: none;
-$link-hover-decoration: underline;
-
-// Custom fonts
-$font-family-sans-serif: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-$font-family-secondary: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
-$font-weight-semibold: 500 !default;
-$small-font-size: 0.875rem !default;
-
-$breadcrumb-divider: quote("→");
-$breadcrumb-divider-color: $gray-500 !default;
-$breadcrumb-active-color: $body-color !default;
-$breadcrumb-item-padding-x: 12px !default;
-
-.form-control::placeholder, .bootstrap-tagsinput::placeholder {
-	color: $gray-500 !important;
+// only overrides to bs5 variables here
+
+// Harmony colours
+$white:    #fff !default;
+$gray-100: #f8f9fa !default;
+$gray-200: #e9ecef !default;
+$gray-300: #dee2e6 !default;
+$gray-400: #ced4da !default;
+$gray-500: #adb5bd !default;
+$gray-600: #6c757d !default;
+$gray-700: #495057 !default;
+$gray-800: #343a40 !default;
+$gray-900: #212529 !default;
+$black:    #000 !default;
+
+$blue:    #0d6efd !default;
+$red:     #dc3545 !default;
+$yellow:  #ffc107 !default;
+$green:   #198754 !default;
+$cyan:    #0dcaf0 !default;
+
+$primary:       $blue !default;
+$secondary:     $gray-600 !default;
+$success:       $green !default;
+$info:          $cyan !default;
+$warning:       $yellow !default;
+$danger:        $red !default;
+$light:         $gray-100 !default;
+$dark:          $gray-900 !default;
+
+$body-color: 		$gray-800 !default;
+$body-bg: 			$white !default;
+$body-tertiary-bg: 	$gray-200 !default;
+$text-muted: 		$gray-600 !default;
+$border-color: 		$gray-200 !default;
+$link-color: 		#0951be !default;
+
+$form-check-input-border: var(--bs-border-width) solid $gray-500 !default;
+
+$input-placeholder-color: $gray-600!important;
+
+// no caret on dropdown-toggle
+$enable-caret: false;
+
+// disable smooth scroll, this makes window.scrollTo(0,0) in ajaxify.js take x milliseconds
+$enable-smooth-scroll: false;
+
+$enable-shadows: true;
+
+$link-decoration: none;
+$link-hover-decoration: underline;
+
+// Custom fonts
+$font-family-sans-serif: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+$font-family-secondary: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
+$font-weight-semibold: 500 !default;
+$small-font-size: 0.875rem !default;
+
+$breadcrumb-divider: quote("→");
+$breadcrumb-divider-color: $gray-500 !default;
+$breadcrumb-active-color: $body-color !default;
+$breadcrumb-item-padding-x: 12px !default;
+
+.form-control::placeholder, .bootstrap-tagsinput::placeholder {
+	color: $gray-500 !important;
 }