Better scoped the widget styles. Made more use of existing CSS within…

… Matomo instead of using custom styles.

CHANGELOG.md

@@ -1,5 +1,10 @@
 # Changelog
 
+## 0.2.1
+
+- Better scoped the widget styles.
+- Made more use of existing CSS within Matomo instead of using custom styles.
+
 ## 0.2.0
 
 - Formatted the lead output.

Widgets/GetSharpSpringInfo.php

@@ -149,7 +149,7 @@ public function render(){
 				$leadCount = 0;
 				foreach($leads->result as $lead){
 					foreach($lead as $lead_details){
-						$output.= '<a href="https://marketingautomation.services/lead/'.$lead_details->id.'" target="_blank" class="sharpspring-lead">';
+						$output.= '<a href="https://marketingautomation.services/lead/'.$lead_details->id.'" target="_blank" class="sharpspring-lead alert alert-info">';
 						$output.= '<strong>Name</strong>';
 						$output.= '<span>'.$lead_details->firstName.' '.$lead_details->lastName.'</span>';
 						$output.= '<strong>Company Name</strong>';

plugin.json

@@ -1,6 +1,6 @@
 {
     "name": "SharpSpringWidgetByAmperage",
-    "version": "0.2.0",
+    "version": "0.2.1",
     "description": "Show SharpSpring info as a widget.",
     "theme": false,
     "keywords": [

stylesheets/sharpspring.less

@@ -1,7 +1,10 @@
-.widget-body { padding:10px 15px; font-size:1.1em; overflow:auto; }
-.sharpspring-lead { margin:0 -15px; padding:1em 15px; display:block;
-	strong,span { display:block; }
-}
-.sharpspring-lead:after { content:''; display:block; clear:both; }
-.sharpspring-lead:hover,.sharpspring-lead:focus { text-decoration:none!important; background:#eee; }
-.sharpspring-lead:active { text-decoration:none!important; background:#ddd; }
+#widgetSharpSpringWidgetByAmperagegetSharpSpringInfo {
+	.widget-body { padding:10px 15px; font-size:1.1em; overflow:auto; }
+	.sharpspring-lead { margin:0 -15px; padding:1em 15px; display:block;
+		strong,span { display:block; }
+	}
+	.sharpspring-lead:before { display:none; }
+	.sharpspring-lead:after { content:''; display:block; clear:both; }
+	.sharpspring-lead:hover,.sharpspring-lead:focus { text-decoration:none!important; filter:brightness(1.1); }
+	.sharpspring-lead:active { text-decoration:none!important; filter:invert(20%); }
+}