Move SVGs to JS objects for easy reuse
This commit is contained in:
parent
618d4d6db5
commit
9e35bda868
7 changed files with 26 additions and 19 deletions
|
@ -23,11 +23,7 @@
|
|||
</h5>
|
||||
<span>
|
||||
First
|
||||
<span class="commit-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 40 40">
|
||||
<path fill="#8F8F8F" fill-rule="evenodd" d="M28.7769836,18 C27.8675252,13.9920226 24.2831748,11 20,11 C15.7168252,11 12.1324748,13.9920226 11.2230164,18 L4.0085302,18 C2.90195036,18 2,18.8954305 2,20 C2,21.1122704 2.8992496,22 4.0085302,22 L11.2230164,22 C12.1324748,26.0079774 15.7168252,29 20,29 C24.2831748,29 27.8675252,26.0079774 28.7769836,22 L35.9914698,22 C37.0980496,22 38,21.1045695 38,20 C38,18.8877296 37.1007504,18 35.9914698,18 L28.7769836,18 L28.7769836,18 Z M20,25 C22.7614237,25 25,22.7614237 25,20 C25,17.2385763 22.7614237,15 20,15 C17.2385763,15 15,17.2385763 15,20 C15,22.7614237 17.2385763,25 20,25 L20,25 Z"/>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="commit-icon">${global.cycleAnalytics.svgs.iconCommit}</span>
|
||||
<a :href="commit.commitUrl" class="commit-hash-link monospace">{{ commit.shortSha }}</a>
|
||||
pushed by
|
||||
<a :href="commit.author.webUrl" class="commit-author-link">
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
/* eslint-disable no-param-reassign */
|
||||
((global) => {
|
||||
global.cycleAnalytics = global.cycleAnalytics || {};
|
||||
|
||||
debugger;
|
||||
global.cycleAnalytics.StageStagingComponent = Vue.extend({
|
||||
props: {
|
||||
items: Array,
|
||||
|
@ -20,11 +20,7 @@
|
|||
<a :href="build.url" class="pipeline-id">#{{ build.id }}</a>
|
||||
<i class="fa fa-code-fork"></i>
|
||||
<a :href="build.branch.url" class="branch-name monospace">{{ build.branch.name }}</a>
|
||||
<span class="icon-branch">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14">
|
||||
<path fill="#8C8C8C" fill-rule="evenodd" d="M9.678 6.722C9.353 5.167 8.053 4 6.5 4S3.647 5.167 3.322 6.722h-2.6c-.397 0-.722.35-.722.778 0 .428.325.778.722.778h2.6C3.647 9.833 4.947 11 6.5 11s2.853-1.167 3.178-2.722h2.6c.397 0 .722-.35.722-.778 0-.428-.325-.778-.722-.778h-2.6zM4.694 7.5c0-1.09.795-1.944 1.806-1.944 1.01 0 1.806.855 1.806 1.944 0 1.09-.795 1.944-1.806 1.944-1.01 0-1.806-.855-1.806-1.944z"/>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="icon-branch">${global.cycleAnalytics.svgs.iconBranch}</span>
|
||||
<a :href="build.commitUrl" class="short-sha monospace">{{ build.shortSha }}</a>
|
||||
</h5>
|
||||
<span>
|
||||
|
|
|
@ -16,14 +16,7 @@
|
|||
<li v-for="build in items" class="stage-event-item item-build-component">
|
||||
<div class="item-details">
|
||||
<h5 class="item-title">
|
||||
<span class="icon-build-status">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14">
|
||||
<g fill="#31AF64" fill-rule="evenodd">
|
||||
<path d="M12.5 7c0-3.038-2.462-5.5-5.5-5.5S1.5 3.962 1.5 7s2.462 5.5 5.5 5.5 5.5-2.462 5.5-5.5zM0 7c0-3.866 3.134-7 7-7s7 3.134 7 7-3.134 7-7 7-7-3.134-7-7z"/>
|
||||
<path d="M6.28 7.697L5.045 6.464c-.117-.117-.305-.117-.42-.002l-.614.614c-.112.113-.113.303.004.42l1.91 1.91c.19.19.51.197.703.004l.265-.265L9.997 6.04c.108-.107.107-.293-.01-.408l-.612-.614c-.114-.113-.298-.12-.41-.01L6.28 7.7z"/>
|
||||
</g>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="icon-build-status">${global.cycleAnalytics.svgs.iconBuildStatus}</span>
|
||||
<a :href="build.url" class="item-build-name">{{ build.name }}</a>
|
||||
·
|
||||
<a :href="build.url" class="pipeline-id">#{{ build.id }}</a>
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
//= require vue
|
||||
//= require_tree ./svg
|
||||
//= require_tree .
|
||||
|
||||
$(() => {
|
||||
|
|
|
@ -0,0 +1,7 @@
|
|||
/* eslint-disable no-param-reassign */
|
||||
((global) => {
|
||||
global.cycleAnalytics = global.cycleAnalytics || {};
|
||||
global.cycleAnalytics.svgs = global.cycleAnalytics.svgs || {};
|
||||
|
||||
global.cycleAnalytics.svgs.iconBranch = `<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14"><path fill="#8C8C8C" fill-rule="evenodd" d="M9.678 6.722C9.353 5.167 8.053 4 6.5 4S3.647 5.167 3.322 6.722h-2.6c-.397 0-.722.35-.722.778 0 .428.325.778.722.778h2.6C3.647 9.833 4.947 11 6.5 11s2.853-1.167 3.178-2.722h2.6c.397 0 .722-.35.722-.778 0-.428-.325-.778-.722-.778h-2.6zM4.694 7.5c0-1.09.795-1.944 1.806-1.944 1.01 0 1.806.855 1.806 1.944 0 1.09-.795 1.944-1.806 1.944-1.01 0-1.806-.855-1.806-1.944z"/></svg>`;
|
||||
})(window.gl || (window.gl = {}));
|
|
@ -0,0 +1,7 @@
|
|||
/* eslint-disable no-param-reassign */
|
||||
((global) => {
|
||||
global.cycleAnalytics = global.cycleAnalytics || {};
|
||||
global.cycleAnalytics.svgs = global.cycleAnalytics.svgs || {};
|
||||
|
||||
global.cycleAnalytics.svgs.iconBuildStatus = `<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14"><g fill="#31AF64" fill-rule="evenodd"><path d="M12.5 7c0-3.038-2.462-5.5-5.5-5.5S1.5 3.962 1.5 7s2.462 5.5 5.5 5.5 5.5-2.462 5.5-5.5zM0 7c0-3.866 3.134-7 7-7s7 3.134 7 7-3.134 7-7 7-7-3.134-7-7z"/><path d="M6.28 7.697L5.045 6.464c-.117-.117-.305-.117-.42-.002l-.614.614c-.11.113-.11.303.007.42l1.91 1.91c.19.19.51.197.703.004l.264-.265L9.997 6.04c.108-.107.107-.293-.01-.408l-.612-.614c-.114-.113-.298-.12-.41-.01L6.28 7.7z"/></g></svg>`;
|
||||
})(window.gl || (window.gl = {}));
|
|
@ -0,0 +1,7 @@
|
|||
/* eslint-disable no-param-reassign */
|
||||
((global) => {
|
||||
global.cycleAnalytics = global.cycleAnalytics || {};
|
||||
global.cycleAnalytics.svgs = global.cycleAnalytics.svgs || {};
|
||||
|
||||
global.cycleAnalytics.svgs.iconCommit = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><path fill="#8F8F8F" fill-rule="evenodd" d="M28.777 18c-.91-4.008-4.494-7-8.777-7-4.283 0-7.868 2.992-8.777 7H4.01C2.9 18 2 18.895 2 20c0 1.112.9 2 2.01 2h7.213c.91 4.008 4.494 7 8.777 7 4.283 0 7.868-2.992 8.777-7h7.214C37.1 22 38 21.105 38 20c0-1.112-.9-2-2.01-2h-7.213zM20 25c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5z"/></svg>`;
|
||||
})(window.gl || (window.gl = {}));
|
Loading…
Reference in a new issue