feat(template): update dg-copy default color to $dg-gray-500, hover c…

…hange to primary
docgeni · Sep 10, 2021 · f33117d · f33117d
1 parent a6c5b95
commit f33117d
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 12 deletions.
diff --git a/packages/template/src/shared/example-viewer/example-viewer.component.html b/packages/template/src/shared/example-viewer/example-viewer.component.html
@@ -7,20 +7,15 @@
     dgExampleRenderer
     [exampleModuleType]="exampleModuleType"
     [exampleComponentType]="exampleComponentType"
-  >
-    <!-- <ng-template
-      *ngIf="enableIvy && exampleComponentType && exampleModuleFactory"
-      [ngComponentOutlet]="exampleComponentType"
-      [ngComponentOutletNgModuleFactory]="exampleModuleFactory"
-    ></ng-template>
-    <ng-template *ngIf="!enableIvy && exampleComponentType" [ngComponentOutlet]="exampleComponentType"></ng-template> -->
-  </div>
+  ></div>
   <!-- <div class="dg-example-viewer-intro" title="{{example.title}}">
   </div> -->
   <div class="dg-example-viewer-actions" title="{{ example.title }}">
-    <a class="action-item" href="javascript:;" [dgCopy]="sourceCode?.textContent"></a>
-    <a class="action-item" href="javascript:;" (click)="toggleSource()"><dg-icon iconName="code"></dg-icon></a>
-    <a class="action-item" target="_blank" [href]="'~examples/' + name"><dg-icon iconName="external"></dg-icon></a>
+    <a class="action-item" title="Copy source code" href="javascript:;" [dgCopy]="sourceCode?.textContent"></a>
+    <a class="action-item" title="Toggle source code" href="javascript:;" (click)="toggleSource()"><dg-icon iconName="code"></dg-icon></a>
+    <a class="action-item" title="Open example in new tab" target="_blank" [href]="'~examples/' + name"
+      ><dg-icon iconName="external"></dg-icon
+    ></a>
   </div>
   <div class="dg-example-viewer-sources" [ngClass]="{ 'dg-sources-show': showSource }">
     <div class="dg-tab-links">

diff --git a/packages/template/src/shared/source-code/source-code.component.html b/packages/template/src/shared/source-code/source-code.component.html
@@ -1,2 +1,2 @@
 <div class="dg-source-code-content" #codeContent></div>
-<a class="action-item" href="javascript:;" [dgCopy]="textContent"></a>
+<a href="javascript:;" title="Copy" [dgCopy]="textContent"></a>
diff --git a/packages/template/src/shared/source-code/source-code.component.scss b/packages/template/src/shared/source-code/source-code.component.scss
@@ -17,5 +17,9 @@
         position: absolute;
         top: 1em;
         right: 1.1em;
+        color: $dg-gray-500;
+        &:hover {
+            color: $dg-primary;
+        }
     }
 }