make description clickable in plugin list row

7 files changed, 23 insertions, 68 deletions

diff --git a/js/PrefHelpers.js b/js/PrefHelpers.js
index 8a5c5857e..cd831d4d0 100644
--- a/js/PrefHelpers.js
+++ b/js/PrefHelpers.js
@@ -368,15 +368,16 @@ const	Helpers = {
 
 						// only user-enabled actually counts in the checkbox when saving because system plugin checkboxes are disabled (see below)
 						container.innerHTML += `
-							<li data-row-value="${App.escapeHtml(plugin.name)}" data-plugin-local="${plugin.is_local}" data-plugin-name="${App.escapeHtml(plugin.name)}" title="${plugin.is_system ? __("System plugins are enabled using global configuration.") : ""}">
+							<li data-row-value="${App.escapeHtml(plugin.name)}" data-plugin-local="${plugin.is_local}"
+								data-plugin-name="${App.escapeHtml(plugin.name)}" title="${plugin.is_system ? __("System plugins are enabled using global configuration.") : ""}">
 								<label class="checkbox ${plugin.is_system ? "system text-info" : ""}">
 									${App.FormFields.checkbox_tag("plugins[]", plugin.user_enabled || plugin.system_enabled, plugin.name,
 										{disabled: plugin.is_system})}</div>
 									<span class='name'>${plugin.name}:</span>
+									<span class="description ${plugin.is_system ? "text-info" : ""}">
+										${plugin.description}
+									</span>
 								</label>
-								<div class="description ${plugin.is_system ? "text-info" : ""}">
-									${plugin.description}
-								</div>
 								<div class='actions'>
 									${plugin.is_system ?
 										App.FormFields.button_tag(App.FormFields.icon("security"), "",
diff --git a/themes/compact.css b/themes/compact.css
index 4d40d2c0d..6ede3a78e 100644
--- a/themes/compact.css
+++ b/themes/compact.css
@@ -1526,14 +1526,6 @@ body.ttrss_prefs fieldset.prefs .help-text {
 body.ttrss_prefs fieldset.prefs .help-text-bottom {
   margin-top: 10px;
 }
-body.ttrss_prefs fieldset.plugin label.description {
-  width: 550px;
-  margin-right: 150px;
-  display: inline-block;
-}
-body.ttrss_prefs fieldset.plugin label.description .dijitCheckBox {
-  margin-right: 10px;
-}
 body.ttrss_prefs table th {
   text-align: left;
 }
@@ -1561,20 +1553,21 @@ body.ttrss_prefs ul.prefs-plugin-list li > * {
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox {
   display: flex;
   align-items: center;
-  min-width: 300px;
   cursor: pointer;
 }
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox.system {
   cursor: auto;
 }
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
+  min-width: 300px;
   flex-grow: 2;
   display: inline-block;
   text-align: right;
   font-weight: bold;
+  margin-right: 20px;
 }
 @media (max-width: 992px) {
-  body.ttrss_prefs ul.prefs-plugin-list li label.checkbox {
+  body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
     min-width: 200px ! important;
   }
   body.ttrss_prefs ul.prefs-plugin-list li .version {
diff --git a/themes/compact_night.css b/themes/compact_night.css
index 652717380..4e75a4935 100644
--- a/themes/compact_night.css
+++ b/themes/compact_night.css
@@ -1526,14 +1526,6 @@ body.ttrss_prefs fieldset.prefs .help-text {
 body.ttrss_prefs fieldset.prefs .help-text-bottom {
   margin-top: 10px;
 }
-body.ttrss_prefs fieldset.plugin label.description {
-  width: 550px;
-  margin-right: 150px;
-  display: inline-block;
-}
-body.ttrss_prefs fieldset.plugin label.description .dijitCheckBox {
-  margin-right: 10px;
-}
 body.ttrss_prefs table th {
   text-align: left;
 }
@@ -1561,20 +1553,21 @@ body.ttrss_prefs ul.prefs-plugin-list li > * {
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox {
   display: flex;
   align-items: center;
-  min-width: 300px;
   cursor: pointer;
 }
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox.system {
   cursor: auto;
 }
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
+  min-width: 300px;
   flex-grow: 2;
   display: inline-block;
   text-align: right;
   font-weight: bold;
+  margin-right: 20px;
 }
 @media (max-width: 992px) {
-  body.ttrss_prefs ul.prefs-plugin-list li label.checkbox {
+  body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
     min-width: 200px ! important;
   }
   body.ttrss_prefs ul.prefs-plugin-list li .version {
diff --git a/themes/light.css b/themes/light.css
index d16faeee1..2efe1b9ef 100644
--- a/themes/light.css
+++ b/themes/light.css
@@ -1526,14 +1526,6 @@ body.ttrss_prefs fieldset.prefs .help-text {
 body.ttrss_prefs fieldset.prefs .help-text-bottom {
   margin-top: 10px;
 }
-body.ttrss_prefs fieldset.plugin label.description {
-  width: 550px;
-  margin-right: 150px;
-  display: inline-block;
-}
-body.ttrss_prefs fieldset.plugin label.description .dijitCheckBox {
-  margin-right: 10px;
-}
 body.ttrss_prefs table th {
   text-align: left;
 }
@@ -1561,20 +1553,21 @@ body.ttrss_prefs ul.prefs-plugin-list li > * {
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox {
   display: flex;
   align-items: center;
-  min-width: 300px;
   cursor: pointer;
 }
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox.system {
   cursor: auto;
 }
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
+  min-width: 300px;
   flex-grow: 2;
   display: inline-block;
   text-align: right;
   font-weight: bold;
+  margin-right: 20px;
 }
 @media (max-width: 992px) {
-  body.ttrss_prefs ul.prefs-plugin-list li label.checkbox {
+  body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
     min-width: 200px ! important;
   }
   body.ttrss_prefs ul.prefs-plugin-list li .version {
diff --git a/themes/light/prefs.less b/themes/light/prefs.less
index a7b964fc0..587adfcf6 100644
--- a/themes/light/prefs.less
+++ b/themes/light/prefs.less
@@ -94,18 +94,6 @@ body.ttrss_prefs {
 		}
 	}
 
-	fieldset.plugin {
-		label.description {
-			width : 550px;
-			margin-right : 150px;
-			display : inline-block;
-
-			.dijitCheckBox {
-				margin-right : 10px;
-			}
-		}
-	}
-
 	table {
 		th {
 			text-align : left;
@@ -140,7 +128,6 @@ body.ttrss_prefs {
 			label.checkbox {
 				display : flex;
 				align-items : center;
-				min-width : 300px;
 				cursor : pointer;
 
 				&.system {
@@ -148,15 +135,17 @@ body.ttrss_prefs {
 				}
 
 				.name {
+					min-width : 300px;
 					flex-grow: 2;
 					display: inline-block;
 					text-align: right;
 					font-weight : bold;
+					margin-right : 20px;
 				}
 			}
 
 			@media (max-width: @breakpoint-lg) {
-				label.checkbox {
+				label.checkbox .name {
 					min-width : 200px ! important;
 				}
 
diff --git a/themes/night.css b/themes/night.css
index d0a2a01d7..dd429eaca 100644
--- a/themes/night.css
+++ b/themes/night.css
@@ -1527,14 +1527,6 @@ body.ttrss_prefs fieldset.prefs .help-text {
 body.ttrss_prefs fieldset.prefs .help-text-bottom {
   margin-top: 10px;
 }
-body.ttrss_prefs fieldset.plugin label.description {
-  width: 550px;
-  margin-right: 150px;
-  display: inline-block;
-}
-body.ttrss_prefs fieldset.plugin label.description .dijitCheckBox {
-  margin-right: 10px;
-}
 body.ttrss_prefs table th {
   text-align: left;
 }
@@ -1562,20 +1554,21 @@ body.ttrss_prefs ul.prefs-plugin-list li > * {
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox {
   display: flex;
   align-items: center;
-  min-width: 300px;
   cursor: pointer;
 }
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox.system {
   cursor: auto;
 }
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
+  min-width: 300px;
   flex-grow: 2;
   display: inline-block;
   text-align: right;
   font-weight: bold;
+  margin-right: 20px;
 }
 @media (max-width: 992px) {
-  body.ttrss_prefs ul.prefs-plugin-list li label.checkbox {
+  body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
     min-width: 200px ! important;
   }
   body.ttrss_prefs ul.prefs-plugin-list li .version {
diff --git a/themes/night_blue.css b/themes/night_blue.css
index ae9a21b12..4d523f982 100644
--- a/themes/night_blue.css
+++ b/themes/night_blue.css
@@ -1527,14 +1527,6 @@ body.ttrss_prefs fieldset.prefs .help-text {
 body.ttrss_prefs fieldset.prefs .help-text-bottom {
   margin-top: 10px;
 }
-body.ttrss_prefs fieldset.plugin label.description {
-  width: 550px;
-  margin-right: 150px;
-  display: inline-block;
-}
-body.ttrss_prefs fieldset.plugin label.description .dijitCheckBox {
-  margin-right: 10px;
-}
 body.ttrss_prefs table th {
   text-align: left;
 }
@@ -1562,20 +1554,21 @@ body.ttrss_prefs ul.prefs-plugin-list li > * {
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox {
   display: flex;
   align-items: center;
-  min-width: 300px;
   cursor: pointer;
 }
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox.system {
   cursor: auto;
 }
 body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
+  min-width: 300px;
   flex-grow: 2;
   display: inline-block;
   text-align: right;
   font-weight: bold;
+  margin-right: 20px;
 }
 @media (max-width: 992px) {
-  body.ttrss_prefs ul.prefs-plugin-list li label.checkbox {
+  body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
     min-width: 200px ! important;
   }
   body.ttrss_prefs ul.prefs-plugin-list li .version {