Merge pull request #15199 from grafana/fix/label-margin-datasource-list

setting margin on label in datasourcelist

public/app/features/datasources/DataSourcesListItem.tsx

@@ -16,12 +16,12 @@ export class DataSourcesListItem extends PureComponent<Props> {
           </div>
           </div>
           <div className="card-item-body">
           <div className="card-item-body">
             <figure className="card-item-figure">
             <figure className="card-item-figure">
-              <img src={dataSource.typeLogoUrl} />
+              <img src={dataSource.typeLogoUrl} alt={dataSource.name} />
             </figure>
             </figure>
             <div className="card-item-details">
             <div className="card-item-details">
               <div className="card-item-name">
               <div className="card-item-name">
                 {dataSource.name}
                 {dataSource.name}
-                {dataSource.isDefault && <span className="btn btn-secondary btn-mini">default</span>}
+                {dataSource.isDefault && <span className="btn btn-secondary btn-mini card-item-label">default</span>}
               </div>
               </div>
               <div className="card-item-sub-name">{dataSource.url}</div>
               <div className="card-item-sub-name">{dataSource.url}</div>
             </div>
             </div>

public/app/features/datasources/__snapshots__/DataSourcesListItem.test.tsx.snap

@@ -24,6 +24,7 @@ exports[`Render should render component 1`] = `
         className="card-item-figure"
         className="card-item-figure"
       >
       >
         <img
         <img
+          alt="gdev-cloudwatch"
           src="public/app/plugins/datasource/cloudwatch/img/amazon-web-services.png"
           src="public/app/plugins/datasource/cloudwatch/img/amazon-web-services.png"
         />
         />
       </figure>
       </figure>

public/sass/components/_cards.scss

@@ -109,6 +109,10 @@
   width: 100%;
   width: 100%;
 }
 }
 
 
+.card-item-label {
+    margin-left: 8px;
+}
+
 .card-item-sub-name {
 .card-item-sub-name {
   color: $text-color-weak;
   color: $text-color-weak;
   overflow: hidden;
   overflow: hidden;