fix(ui): fix SVG gradients in Firefox and Safari

bleenco · Jun 9, 2018 · cdccaa1 · cdccaa1
1 parent efbc7bb
commit cdccaa1
Show file tree

Hide file tree

Showing 5 changed files with 8 additions and 6 deletions.
diff --git a/src/app/components/app-line-chart/app-line-chart.component.ts b/src/app/components/app-line-chart/app-line-chart.component.ts
@@ -197,9 +197,11 @@ export class AppLineChartComponent implements OnDestroy, OnChanges {
 
     const totalLengthSuccess = (<any>successPath.node()).getTotalLength();
 
+    console.log(document.location.href);
+
     g.append('path')
       .attr('d', a(successData as any))
-      .attr('fill', 'url(#successGradient)');
+      .attr('fill', `url(${document.location.href}#successGradient)`);
 
     g.selectAll('dot')
       .data(successData)
@@ -226,7 +228,7 @@ export class AppLineChartComponent implements OnDestroy, OnChanges {
 
     g.append('path')
       .attr('d', a(failedData as any))
-      .attr('fill', 'url(#failedGradient)');
+      .attr('fill', `url(${document.location.href}#failedGradient)`);
 
     g.selectAll('dot')
       .data(failedData)

diff --git a/src/app/components/app-progress-chart/app-progress-chart.component.ts b/src/app/components/app-progress-chart/app-progress-chart.component.ts
@@ -72,7 +72,7 @@ export class AppProgressChartComponent implements OnChanges, OnDestroy {
     this.pathChart = g.append('path')
       .datum({ endAngle: 0 })
       .attr('d', this.arcLine)
-      .style('fill', 'url(#progressGradient)');
+      .style('fill', `url(${document.location.href}#progressGradient)`);
 
     this.middleCount = g.append('text')
       .text((d: any) => d)

diff --git a/src/app/components/app-repositories/app-repositories.component.ts b/src/app/components/app-repositories/app-repositories.component.ts
@@ -57,7 +57,7 @@ export class AppRepositoriesComponent implements OnInit {
       this.repositories.forEach((repo: any, i) => {
         this.apiService.getBadge(repo.id).subscribe(badge => {
           if (badge.ok) {
-            this.repositories[i].status_badge = badge._body;
+            this.repositories[i].status_badge = badge._body.replace(/url\(/g, 'url(' + document.location.href);
           }
         });
       });

diff --git a/src/app/components/app-repository/app-repository.component.ts b/src/app/components/app-repository/app-repository.component.ts
@@ -246,7 +246,7 @@ export class AppRepositoryComponent implements OnInit, OnDestroy {
   fetchBadge(): void {
     this.api.getBadge(parseInt(this.id, 10)).subscribe(event => {
       if (event.ok) {
-        this.statusBadge = event._body.replace(/ \r/g, '').trim();
+        this.statusBadge = event._body.replace(/ \r/g, '').replace(/url\(/g, 'url(' + document.location.href).trim();
       }
     });
   }

diff --git a/src/styles/fonts.sass b/src/styles/fonts.sass
@@ -7,7 +7,7 @@
 
 +font-face('Ubuntu-Light', '/assets/fonts/Ubuntu-Light', 300, 'normal')
 +font-face('Ubuntu-Regular', '/assets/fonts/Ubuntu-Regular', 400, 'normal')
-+font-face('Ubuntu-Medium', '/assets/fonts/Ubuntu-SemiBold', 500, 'normal')
++font-face('Ubuntu-Medium', '/assets/fonts/Ubuntu-Medium', 500, 'normal')
 +font-face('Ubuntu-Bold', '/assets/fonts/Ubuntu-Bold', 700, 'normal')
 
 $font-family-light: 'Ubuntu-Light', sans-serif