Browse Source

add dashboard and plugin icons to plugin list and dash search

Trent White 8 years ago
parent
commit
d4f2f41088

+ 1 - 1
public/app/core/components/search/search.html

@@ -69,7 +69,7 @@
 		</a>
 		</a>
 
 
 		<a class="pull-right search-button-row-explore-link" target="_blank" href="https://grafana.com/dashboards?utm_source=grafana_search">
 		<a class="pull-right search-button-row-explore-link" target="_blank" href="https://grafana.com/dashboards?utm_source=grafana_search">
-      Find dashboards on
+      		Find <img src="public/img/icn-dashboard-tiny.svg" /> dashboards on <span>Grafana.com</span>
 		</a>
 		</a>
 
 
  		<div class="clearfix"></div>
  		<div class="clearfix"></div>

+ 1 - 1
public/app/features/plugins/partials/plugin_list.html

@@ -27,7 +27,7 @@
 			</ul>
 			</ul>
 
 
       <a class="get-more-plugins-link" href="https://grafana.com/plugins?utm_source=grafana_plugin_list" target="_blank">
       <a class="get-more-plugins-link" href="https://grafana.com/plugins?utm_source=grafana_plugin_list" target="_blank">
-        Find more plugins on
+        Find more <img src="public/img/icn-plugins-tiny.svg" />plugins on <span>Grafana.com</span>
       </a>
       </a>
     </div>
     </div>
   </div>
   </div>

+ 45 - 0
public/img/icn-dashboard-tiny.svg

@@ -0,0 +1,45 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:url(#SVGID_1_);}
+	.st1{fill:url(#SVGID_2_);}
+	.st2{fill:url(#SVGID_3_);}
+	.st3{fill:url(#SVGID_4_);}
+</style>
+<g>
+	<g>
+		<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="3.8684" y1="23.9248" x2="3.8684" y2="-0.5685">
+			<stop  offset="0" style="stop-color:#FFF200"/>
+			<stop  offset="1" style="stop-color:#F15A29"/>
+		</linearGradient>
+		<path class="st0" d="M5.9,7.4H1.8C1,7.4,0.4,6.8,0.4,6V1.9c0-0.8,0.6-1.4,1.4-1.4h4.2c0.8,0,1.4,0.6,1.4,1.4V6
+			C7.3,6.8,6.7,7.4,5.9,7.4z"/>
+	</g>
+	<g>
+		<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="12.1316" y1="23.9248" x2="12.1316" y2="-0.5685">
+			<stop  offset="0" style="stop-color:#FFF200"/>
+			<stop  offset="1" style="stop-color:#F15A29"/>
+		</linearGradient>
+		<path class="st1" d="M14.2,7.4h-4.2C9.3,7.4,8.7,6.8,8.7,6V1.9c0-0.8,0.6-1.4,1.4-1.4h4.2c0.8,0,1.4,0.6,1.4,1.4V6
+			C15.6,6.8,15,7.4,14.2,7.4z"/>
+	</g>
+	<g>
+		<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="3.8684" y1="23.9248" x2="3.8684" y2="-0.5685">
+			<stop  offset="0" style="stop-color:#FFF200"/>
+			<stop  offset="1" style="stop-color:#F15A29"/>
+		</linearGradient>
+		<path class="st2" d="M5.9,15.5H1.8c-0.8,0-1.4-0.6-1.4-1.4V10c0-0.8,0.6-1.4,1.4-1.4h4.2c0.8,0,1.4,0.6,1.4,1.4v4.2
+			C7.3,14.9,6.7,15.5,5.9,15.5z"/>
+	</g>
+	<g>
+		<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="12.1316" y1="23.9248" x2="12.1316" y2="-0.5685">
+			<stop  offset="0" style="stop-color:#FFF200"/>
+			<stop  offset="1" style="stop-color:#F15A29"/>
+		</linearGradient>
+		<path class="st3" d="M14.2,15.5h-4.2c-0.8,0-1.4-0.6-1.4-1.4V10c0-0.8,0.6-1.4,1.4-1.4h4.2c0.8,0,1.4,0.6,1.4,1.4v4.2
+			C15.6,14.9,15,15.5,14.2,15.5z"/>
+	</g>
+</g>
+</svg>

+ 38 - 0
public/img/icn-plugins-tiny.svg

@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:url(#SVGID_1_);}
+</style>
+<g>
+	<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="8" y1="22.9255" x2="8" y2="-0.8717">
+		<stop  offset="0" style="stop-color:#FFF200"/>
+		<stop  offset="1" style="stop-color:#F15A29"/>
+	</linearGradient>
+	<path class="st0" d="M14.2,7.1c-0.5,0-0.9,0.3-1.1,0.8h-3c0-0.3-0.1-0.5-0.2-0.7l2-1.1c0.2,0.2,0.6,0.4,0.9,0.4
+		c0.7,0,1.3-0.6,1.3-1.3c0-0.7-0.6-1.3-1.3-1.3s-1.3,0.6-1.3,1.3c0,0.1,0,0.2,0.1,0.4l-2,1.1C9.5,6.5,9.3,6.3,9.1,6.1l0.4-0.6
+		c0.1,0,0.2,0.1,0.4,0.1c0.7,0,1.3-0.6,1.3-1.3s-0.6-1.3-1.3-1.3S8.5,3.5,8.5,4.2c0,0.4,0.2,0.7,0.4,1L8.6,5.8
+		C8.3,5.7,8.1,5.7,7.8,5.6V1.9C8.2,1.8,8.5,1.4,8.5,1c0-0.5-0.4-1-1-1s-1,0.4-1,1c0,0.4,0.3,0.8,0.7,0.9v3.7C7,5.7,6.7,5.7,6.5,5.8
+		L5.2,3.5c0.2-0.2,0.3-0.5,0.3-0.7c0-0.6-0.5-1.1-1.1-1.1S3.3,2.2,3.3,2.8s0.5,1.1,1.1,1.1c0.1,0,0.2,0,0.2,0l1.3,2.3
+		C5.7,6.3,5.6,6.5,5.4,6.7L3.1,5.4c0-0.1,0-0.2,0-0.2C3.2,4.5,2.7,4,2.1,4S1,4.5,1,5.1c0,0.6,0.5,1.1,1.1,1.1c0.3,0,0.5-0.1,0.7-0.3
+		l2.3,1.3C5,7.5,4.9,7.7,4.9,7.9H4C3.9,7.3,3.3,6.8,2.6,6.8c-0.8,0-1.5,0.7-1.5,1.5s0.7,1.5,1.5,1.5c0.7,0,1.3-0.5,1.4-1.1h0.9
+		c0,0.3,0.1,0.5,0.2,0.7l-2.4,1.4c-0.2-0.2-0.5-0.3-0.8-0.3c-0.6,0-1.2,0.5-1.2,1.2c0,0.6,0.5,1.2,1.2,1.2S3,12.2,3,11.5
+		c0-0.1,0-0.2,0-0.3l2.4-1.4c0.2,0.2,0.3,0.4,0.5,0.5L4,13.7c-0.1,0-0.2,0-0.3,0c-0.6,0-1.1,0.5-1.1,1.1c0,0.6,0.5,1.1,1.1,1.1
+		s1.1-0.5,1.1-1.1c0-0.3-0.1-0.6-0.3-0.8l1.9-3.3c0.2,0.1,0.5,0.2,0.7,0.2v0.9c-0.6,0.1-1,0.7-1,1.3c0,0.7,0.6,1.3,1.3,1.3
+		s1.3-0.6,1.3-1.3c0-0.6-0.4-1.1-1-1.3v-0.9c0.3,0,0.5-0.1,0.7-0.2l1.6,2.7c-0.2,0.2-0.3,0.5-0.3,0.8c0,0.6,0.5,1.2,1.2,1.2
+		s1.2-0.5,1.2-1.2c0-0.6-0.5-1.2-1.2-1.2c-0.1,0-0.2,0-0.3,0l-1.6-2.7c0.2-0.2,0.4-0.3,0.5-0.5L9.9,10c0,0.1-0.1,0.3-0.1,0.5
+		c0,0.8,0.7,1.5,1.5,1.5s1.5-0.7,1.5-1.5c0-0.8-0.7-1.5-1.5-1.5c-0.4,0-0.9,0.2-1.1,0.5L10,9.3c0.1-0.2,0.2-0.5,0.2-0.7h3
+		c0.1,0.5,0.6,0.8,1.1,0.8c0.6,0,1.1-0.5,1.1-1.1C15.3,7.6,14.8,7.1,14.2,7.1z M14.2,8.9c-0.3,0-0.6-0.3-0.6-0.6
+		c0-0.3,0.3-0.6,0.6-0.6c0.3,0,0.6,0.3,0.6,0.6C14.8,8.6,14.5,8.9,14.2,8.9z M7.5,10.3c-1.1,0-2-0.9-2-2s0.9-2,2-2s2,0.9,2,2
+		S8.6,10.3,7.5,10.3z M12.1,5.2c0-0.4,0.4-0.8,0.8-0.8c0.4,0,0.8,0.4,0.8,0.8c0,0.4-0.4,0.8-0.8,0.8C12.5,6,12.1,5.6,12.1,5.2z
+		 M10.7,4.2c0,0.5-0.4,0.8-0.8,0.8C9.4,5,9,4.7,9,4.2s0.4-0.8,0.8-0.8C10.3,3.4,10.7,3.7,10.7,4.2z M7,1c0-0.3,0.2-0.5,0.5-0.5
+		S8,0.7,8,1S7.8,1.5,7.5,1.5S7,1.3,7,1z M3.8,2.8c0-0.3,0.3-0.6,0.6-0.6C4.7,2.2,5,2.5,5,2.8S4.7,3.4,4.4,3.4
+		C4.1,3.4,3.8,3.1,3.8,2.8z M2.1,5.7c-0.3,0-0.6-0.3-0.6-0.6s0.3-0.6,0.6-0.6s0.6,0.3,0.6,0.6S2.4,5.7,2.1,5.7z M2.6,9.2
+		c-0.5,0-1-0.4-1-1s0.4-1,1-1s1,0.4,1,1S3.1,9.2,2.6,9.2z M2.5,11.5c0,0.4-0.3,0.7-0.7,0.7s-0.7-0.3-0.7-0.7c0-0.4,0.3-0.7,0.7-0.7
+		S2.5,11.2,2.5,11.5z M4.4,14.8c0,0.3-0.3,0.6-0.6,0.6s-0.6-0.3-0.6-0.6c0-0.3,0.3-0.6,0.6-0.6S4.4,14.5,4.4,14.8z M7.5,13.9
+		c-0.4,0-0.8-0.4-0.8-0.8c0-0.4,0.4-0.8,0.8-0.8s0.8,0.4,0.8,0.8C8.3,13.5,8,13.9,7.5,13.9z M11.6,14.2c0,0.4-0.3,0.7-0.7,0.7
+		c-0.4,0-0.7-0.3-0.7-0.7c0-0.4,0.3-0.7,0.7-0.7C11.3,13.6,11.6,13.9,11.6,14.2z M11.4,9.5c0.6,0,1,0.5,1,1s-0.5,1-1,1s-1-0.5-1-1
+		S10.8,9.5,11.4,9.5z"/>
+</g>
+</svg>

+ 3 - 6
public/sass/components/_search.scss

@@ -109,16 +109,13 @@
   .search-button-row-explore-link {
   .search-button-row-explore-link {
     color: $text-muted;
     color: $text-muted;
     font-size: $font-size-sm;
     font-size: $font-size-sm;
-    padding-right: 7rem;
-    background: url(../img/grafana_net_logo.svg);
-    background-size: 6.5rem;
-    background-repeat: no-repeat;
-    background-position: right;
     position: relative;
     position: relative;
-    top: 0.8rem;
+    top: 0;
     &:hover {
     &:hover {
       color: $link-hover-color;
       color: $link-hover-color;
     }
     }
+    span {color: $brand-primary;}
+    img {vertical-align: top;}
   }
   }
 }
 }
 
 

+ 2 - 5
public/sass/pages/_plugins.scss

@@ -40,16 +40,13 @@
 .get-more-plugins-link {
 .get-more-plugins-link {
   color: $text-muted;
   color: $text-muted;
   font-size: $font-size-sm;
   font-size: $font-size-sm;
-  padding-right: 7rem;
-  background: url(../img/grafana_net_logo.svg);
-  background-size: 6.5rem 3rem;
-  background-repeat: no-repeat;
-  background-position: right;
   position: relative;
   position: relative;
   top: 1.2rem;
   top: 1.2rem;
   &:hover {
   &:hover {
     color: $link-hover-color;
     color: $link-hover-color;
   }
   }
+  span {color: $brand-primary;}
+  img {vertical-align: top;}
 }
 }
 
 
 @include media-breakpoint-down(sm) {
 @include media-breakpoint-down(sm) {