marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-11-06 13:54:09 +01:00
Code Issues Packages Projects Releases Wiki Activity

#1252 Adding background on commit labels

Browse Source
This commit is contained in:
Knut Sveidqvist
2022-03-25 08:56:22 +01:00
parent 3ee141ff9b
commit 22aca7b3ee
21 changed files with 6189 additions and 3619 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
cypress/platform/gitgraph2.html
View File

@@ -9,7 +9,7 @@
<style> <style>
body { body {
/* background: rgb(221, 208, 208); */ /* background: rgb(221, 208, 208); */
/* background:#111; */ background:#111;
/* background:#333; */ /* background:#333; */
font-family: 'Arial'; font-family: 'Arial';
} }
@@ -26,7 +26,7 @@
</head> </head>
<body> <body>
<h1>info below</h1> <h1>info below</h1>
<div class="mermaid" style="width: 100%; height: 20%;"> <div class="mermaid2" style="width: 100%; height: 20%;">
gitGraph: gitGraph:
commit "Ashish" commit "Ashish"
branch newbranch branch newbranch
@@ -43,14 +43,14 @@
</div> </div>
<div class="mermaid" style="width: 100%; height: 20%;"> <div class="mermaid" style="width: 100%; height: 20%;">
gitGraph: gitGraph
commit commit
branch hotfix branch hotfix
checkout hotfix checkout hotfix
commit commit
branch develop branch develop
checkout develop checkout develop
commit id:"ash" tag:"abc" commit id:"An id" tag:"A tag"
branch featureB branch featureB
checkout featureB checkout featureB
commit type:HIGHLIGHT commit type:HIGHLIGHT
@@ -101,14 +101,13 @@
// console.error('Mermaid error: ', err); // console.error('Mermaid error: ', err);
}; };
mermaid.initialize({ mermaid.initialize({
theme: 'base', theme: 'dark',
themeVariables: { themeVariables: {
// primaryColor: '#9400D3', // primaryColor: '#9400D3',
darkMode: false, // darkMode: false,
// background: '#222', // background: '#222',
// textColor: 'white', // textColor: 'white',
// primaryTextColor: '#f4f4f4', // primaryTextColor: '#f4f4f4',
// nodeBkg: '#ff0000', // nodeBkg: '#ff0000',
// mainBkg: '#0000ff', // mainBkg: '#0000ff',
// tertiaryColor: '#ffffcc', // tertiaryColor: '#ffffcc',

13
cypress/platform/showcase_base.html
View File

@@ -264,7 +264,7 @@ requirementDiagram
test_req - contains -> test_req3 test_req - contains -> test_req3
test_req <- copies - test_entity2 test_req <- copies - test_entity2
</div> </div>
<div class="mermaid" class="width height"> <div class="mermaid" style="width: 100%; height: 20%;">
gitGraph: gitGraph:
commit commit
branch hotfix branch hotfix
@@ -272,19 +272,18 @@ requirementDiagram
commit commit
branch develop branch develop
checkout develop checkout develop
commit id:"ash" tag:"abc" commit id:"An id" tag:"A tag"
branch featureB branch featureB
checkout featureB checkout featureB
commit type:HIGHLIGHT commit type:HIGHLIGHT
checkout master checkout main
branch hotfix
checkout hotfix checkout hotfix
commit type:NORMAL commit type:NORMAL
checkout develop checkout develop
commit type:REVERSE commit type:REVERSE
checkout featureB checkout featureB
commit commit
checkout master checkout main
merge hotfix merge hotfix
checkout featureB checkout featureB
commit commit
@@ -302,10 +301,10 @@ requirementDiagram
branch release branch release
checkout release checkout release
commit commit
checkout master checkout main
commit commit
checkout release checkout release
merge master merge main
checkout develop checkout develop
merge release merge release
</div> </div>

14
cypress/platform/showcase_base_dark.html
View File

@@ -259,27 +259,25 @@ requirementDiagram
test_req <- copies - test_entity2 test_req <- copies - test_entity2
</div> </div>
<div class="mermaid" class="width height"> <div class="mermaid" class="width height">
%%{init:{"theme":"base", "themeVariables": {"primaryColor":"#411d4e", "darkMode":true}}}%% gitGraph
gitGraph:
commit commit
branch hotfix branch hotfix
checkout hotfix checkout hotfix
commit commit
branch develop branch develop
checkout develop checkout develop
commit id:"ash" tag:"abc" commit id:"An id" tag:"A tag"
branch featureB branch featureB
checkout featureB checkout featureB
commit type:HIGHLIGHT commit type:HIGHLIGHT
checkout master checkout main
branch hotfix
checkout hotfix checkout hotfix
commit type:NORMAL commit type:NORMAL
checkout develop checkout develop
commit type:REVERSE commit type:REVERSE
checkout featureB checkout featureB
commit commit
checkout master checkout main
merge hotfix merge hotfix
checkout featureB checkout featureB
commit commit
@@ -297,10 +295,10 @@ requirementDiagram
branch release branch release
checkout release checkout release
commit commit
checkout master checkout main
commit commit
checkout release checkout release
merge master merge main
checkout develop checkout develop
merge release merge release
</div> </div>

13
cypress/platform/showcase_dark.html
View File

@@ -257,26 +257,25 @@ requirementDiagram
test_req <- copies - test_entity2 test_req <- copies - test_entity2
</div> </div>
<div class="mermaid" class="width height"> <div class="mermaid" class="width height">
gitGraph: gitGraph
commit commit
branch hotfix branch hotfix
checkout hotfix checkout hotfix
commit commit
branch develop branch develop
checkout develop checkout develop
commit id:"ash" tag:"abc" commit id:"An id" tag:"A tag"
branch featureB branch featureB
checkout featureB checkout featureB
commit type:HIGHLIGHT commit type:HIGHLIGHT
checkout master checkout main
branch hotfix
checkout hotfix checkout hotfix
commit type:NORMAL commit type:NORMAL
checkout develop checkout develop
commit type:REVERSE commit type:REVERSE
checkout featureB checkout featureB
commit commit
checkout master checkout main
merge hotfix merge hotfix
checkout featureB checkout featureB
commit commit
@@ -294,10 +293,10 @@ requirementDiagram
branch release branch release
checkout release checkout release
commit commit
checkout master checkout main
commit commit
checkout release checkout release
merge master merge main
checkout develop checkout develop
merge release merge release
</div> </div>

15
cypress/platform/showcase_default.html
View File

@@ -251,27 +251,26 @@ requirementDiagram
test_req - contains -> test_req3 test_req - contains -> test_req3
test_req <- copies - test_entity2 test_req <- copies - test_entity2
</div> </div>
<div class="mermaid" class="width height"> <div class="mermaid" style="width: 100%; height: 20%;">
gitGraph: gitGraph
commit commit
branch hotfix branch hotfix
checkout hotfix checkout hotfix
commit commit
branch develop branch develop
checkout develop checkout develop
commit id:"ash" tag:"abc" commit id:"An id" tag:"A tag"
branch featureB branch featureB
checkout featureB checkout featureB
commit type:HIGHLIGHT commit type:HIGHLIGHT
checkout master checkout main
branch hotfix
checkout hotfix checkout hotfix
commit type:NORMAL commit type:NORMAL
checkout develop checkout develop
commit type:REVERSE commit type:REVERSE
checkout featureB checkout featureB
commit commit
checkout master checkout main
merge hotfix merge hotfix
checkout featureB checkout featureB
commit commit
@@ -289,10 +288,10 @@ requirementDiagram
branch release branch release
checkout release checkout release
commit commit
checkout master checkout main
commit commit
checkout release checkout release
merge master merge main
checkout develop checkout develop
merge release merge release
</div> </div>

11
cypress/platform/showcase_forest.html
View File

@@ -263,19 +263,18 @@ requirementDiagram
commit commit
branch develop branch develop
checkout develop checkout develop
commit id:"ash" tag:"abc" commit id:"An id" tag:"A tag"
branch featureB branch featureB
checkout featureB checkout featureB
commit type:HIGHLIGHT commit type:HIGHLIGHT
checkout master checkout main
branch hotfix
checkout hotfix checkout hotfix
commit type:NORMAL commit type:NORMAL
checkout develop checkout develop
commit type:REVERSE commit type:REVERSE
checkout featureB checkout featureB
commit commit
checkout master checkout main
merge hotfix merge hotfix
checkout featureB checkout featureB
commit commit
@@ -293,10 +292,10 @@ requirementDiagram
branch release branch release
checkout release checkout release
commit commit
checkout master checkout main
commit commit
checkout release checkout release
merge master merge main
checkout develop checkout develop
merge release merge release
</div> </div>

11
cypress/platform/showcase_neutral.html
View File

@@ -263,19 +263,18 @@ requirementDiagram
commit commit
branch develop branch develop
checkout develop checkout develop
commit id:"ash" tag:"abc" commit id:"An id" tag:"A tag"
branch featureB branch featureB
checkout featureB checkout featureB
commit type:HIGHLIGHT commit type:HIGHLIGHT
checkout master checkout main
branch hotfix
checkout hotfix checkout hotfix
commit type:NORMAL commit type:NORMAL
checkout develop checkout develop
commit type:REVERSE commit type:REVERSE
checkout featureB checkout featureB
commit commit
checkout master checkout main
merge hotfix merge hotfix
checkout featureB checkout featureB
commit commit
@@ -293,10 +292,10 @@ requirementDiagram
branch release branch release
checkout release checkout release
commit commit
checkout master checkout main
commit commit
checkout release checkout release
merge master merge main
checkout develop checkout develop
merge release merge release
</div> </div>

2932
dist/mermaid.core.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/mermaid.core.js.map vendored
View File

File diff suppressed because one or more lines are too long

6618
dist/mermaid.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/mermaid.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
docs/Setup.md
View File

@@ -926,7 +926,7 @@ Default value: true
**Notes:** Sets the siteConfig. The siteConfig is a protected configuration for repeat use. Calls **Notes:** Sets the siteConfig. The siteConfig is a protected configuration for repeat use. Calls
to reset() will reset the currentConfig to siteConfig. Calls to reset(configApi.defaultConfig) to reset() will reset the currentConfig to siteConfig. Calls to reset(configApi.defaultConfig)
will reset siteConfig and currentConfig to the defaultConfig Note: currentConfig is set in this will reset siteConfig and currentConfig to the defaultConfig Note: currentConfig is set in this
function \*Default value: At default, will mirror Global Config\*\* function _Default value: At default, will mirror Global Config_
### Parameters ### Parameters

21
docs/examples.md
View File

@@ -115,7 +115,7 @@ sequenceDiagram
participant account as Account Service participant account as Account Service
participant mail as Mail Service participant mail as Mail Service
participant db as Storage participant db as Storage
Note over web,db: The user must be logged in to submit blog posts Note over web,db: The user must be logged in to submit blog posts
web->>+account: Logs in using credentials web->>+account: Logs in using credentials
account->>db: Query stored accounts account->>db: Query stored accounts
@@ -129,7 +129,7 @@ sequenceDiagram
Note over web,db: When the user is authenticated, they can now submit new posts Note over web,db: When the user is authenticated, they can now submit new posts
web->>+blog: Submit new post web->>+blog: Submit new post
blog->>db: Store post data blog->>db: Store post data
par Notifications par Notifications
blog--)mail: Send mail to blog subscribers blog--)mail: Send mail to blog subscribers
blog--)db: Store in-site notifications blog--)db: Store in-site notifications
@@ -139,3 +139,20 @@ sequenceDiagram
end end
``` ```
A commit flow diagram.
```mermaid
gitGraph:
commit "Ashish"
branch newbranch
checkout newbranch
commit id:"1111"
commit tag:"test"
checkout main
commit type: HIGHLIGHT
commit
merge newbranch
commit
branch b2
commit
```

4
docs/index.html
View File

@@ -17,8 +17,8 @@
/> />
<!-- <link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css"> --> <!-- <link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css"> -->
<link rel="stylesheet" href="theme.css" /> <link rel="stylesheet" href="theme.css" />
<script src="//cdn.jsdelivr.net/npm/mermaid@8.14.0/dist/mermaid.min.js"></script> <!-- <script src="//cdn.jsdelivr.net/npm/mermaid@8.14.0/dist/mermaid.min.js"></script> -->
<!-- <script src="http://localhost:9000/mermaid.js"></script> --> <script src="http://localhost:9000/mermaid.js"></script>
<script> <script>
// prettier-ignore // prettier-ignore
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){

99
src/diagrams/git/gitGraphRenderer.js
View File

@@ -173,51 +173,57 @@ const drawCommits = (svg, commits, modifyGraph) => {
} }
commitPos[commit.id] = {x: pos + 10, y: y}; commitPos[commit.id] = {x: pos + 10, y: y};
// The first iteration over the commits are for positioning purposes, this
// is required for drawing the lines. The circles and labels is drawn after the labels
// placing them on top of the lines.
if (modifyGraph) { if (modifyGraph) {
const px=4;
const py=2;
const labelBkg = gLabels.insert('rect')
.attr('class', 'commit-label-bkg');
const text = gLabels.append('text') const text = gLabels.append('text')
.attr('x', pos) .attr('x', pos)
.attr('y', y + 25) .attr('y', y + 25)
.attr('class', 'commit-label') .attr('class', 'commit-label')
.text(commit.id); .text(commit.id);
let bbox = text.node().getBBox(); let bbox = text.node().getBBox();
text.attr('x', pos + 10 - bbox.width / 2); console.log(bbox);
console.log('commit', commit.id, 'tag', commit.tag); // Now we have the label, lets position the background
if(commit.tag) { labelBkg
const rect = gLabels.insert('polygon'); .attr('x', pos + 10 - bbox.width / 2 - py)
const hole = gLabels.append('circle'); .attr('y', y + 13.5)
const tag = gLabels.append('text') .attr('width', bbox.width + 2 * py)
// .attr('x', pos ) .attr('height', bbox.height + 2 * py);
.attr('y', y - 16) text.attr('x', pos + 10 - bbox.width / 2);
.attr('class', 'tag-label') if(commit.tag) {
.text(commit.tag); const rect = gLabels.insert('polygon');
let tagBbox = tag.node().getBBox(); const hole = gLabels.append('circle');
tag.attr('x', pos + 10 - tagBbox.width / 2); const tag = gLabels.append('text')
// Note that we are delaying setting the x position until we know the width of the text
.attr('y', y - 16)
.attr('class', 'tag-label')
.text(commit.tag);
let tagBbox = tag.node().getBBox();
tag.attr('x', pos + 10 - tagBbox.width / 2);
const px=4; const h2 = tagBbox.height/2
const py=2; const ly = y - 19.2 ;
const h2 = tagBbox.height/2 rect
const ly = y - 19.2 ; .attr('class', 'tag-label-bkg')
rect .attr('points', `
.attr('class', 'tag-label-bkg') ${pos - tagBbox.width / 2 - px/2},${ly + py}
// .attr('rx', 2) ${pos - tagBbox.width / 2 - px/2},${ly - py}
// .attr('ry', 2) ${pos + 10 - tagBbox.width / 2 - px},${ly - h2 - py}
// .attr('x', pos + 10 - tagBbox.width / 2 - 4) ${pos + 10 + tagBbox.width / 2 + px},${ly - h2 - py}
// .attr('y', y - 15 - tagBbox.height/2 - 7) ${pos + 10 + tagBbox.width / 2 + px},${ly + h2 + py }
// .attr('width', tagBbox.width + 8) ${pos + 10 - tagBbox.width / 2 - px},${ly + h2 + py}`);
// .attr('height', tagBbox.height + 4);
.attr('points', `
${pos - tagBbox.width / 2 - px},${ly +py}
${pos - tagBbox.width / 2 - px},${ly -py}
${pos + 10 - tagBbox.width / 2 - px},${ly - h2 - py}
${pos + 10 + tagBbox.width / 2 + px},${ly - h2 - py}
${pos + 10 + tagBbox.width / 2 + px},${ly + h2 + py }
${pos + 10 - tagBbox.width / 2 - px},${ly + h2 + py}`);
hole hole
.attr('cx', pos - tagBbox.width / 2) .attr('cx', pos - tagBbox.width / 2 + px/2)
.attr('cy', ly) .attr('cy', ly)
.attr('r', 1.5) .attr('r', 1.5)
.attr('class', 'tag-hole'); .attr('class', 'tag-hole');
} }
} }
@@ -237,24 +243,13 @@ const drawCommits = (svg, commits, modifyGraph) => {
const hasOverlappingCommits = (commit1, commit2, allCommits) => { const hasOverlappingCommits = (commit1, commit2, allCommits) => {
const commit1Pos = commitPos[commit2.id]; const commit1Pos = commitPos[commit2.id];
const commit2Pos = commitPos[commit1.id]; const commit2Pos = commitPos[commit1.id];
// if(commit1.id.match('4-')) {
// log.info('Ugge 1', commit1, commit2);
// }
// Find commits on the same branch as commit2 // Find commits on the same branch as commit2
const keys = Object.keys(allCommits); const keys = Object.keys(allCommits);
const overlappingComits = keys.filter((key) => { const overlappingComits = keys.filter((key) => {
// if(commit1.id.match('4-') && allCommits[key].branch === commit2.branch) {
// log.info('Ugge seq of the commit', allCommits[key].seq, ' commit 1 seq', commit1.seq ,' commit2 seq' ,commit2.seq);
// }
return allCommits[key].branch === commit2.branch && allCommits[key].seq > commit1.seq && allCommits[key].seq < commit2.seq return allCommits[key].branch === commit2.branch && allCommits[key].seq > commit1.seq && allCommits[key].seq < commit2.seq
}); });
// if (commit1Pos.x === commit2Pos.x) {
// return commit1Pos.y === commit2Pos.y;
// }
return overlappingComits.length > 0; return overlappingComits.length > 0;
} }
/** /**
@@ -330,7 +325,8 @@ const drawArrow = (svg, commit1, commit2, allCommits) => {
arc = 'A 20 20, 0, 0, 0,'; arc = 'A 20 20, 0, 0, 0,';
radius = 20; radius = 20;
offset = 20; offset = 20;
// Figure out the color of the arrow,arrows going down take the color from the destination branch
// Figure out the color of the arrow,arrows going down take the color from the destination branch
colorClassNum = branchPos[commit2.branch].index; colorClassNum = branchPos[commit2.branch].index;
lineDef = `M ${p1.x} ${p1.y} L ${p1.x} ${p2.y-radius} ${arc} ${p1.x + offset} ${p2.y} L ${p2.x} ${p2.y}`; lineDef = `M ${p1.x} ${p1.y} L ${p1.x} ${p2.y-radius} ${arc} ${p1.x + offset} ${p2.y} L ${p2.x} ${p2.y}`;
@@ -339,7 +335,8 @@ const drawArrow = (svg, commit1, commit2, allCommits) => {
arc = 'A 20 20, 0, 0, 0,'; arc = 'A 20 20, 0, 0, 0,';
radius = 20; radius = 20;
offset = 20; offset = 20;
// Arrows going up take the color from the source branch
// Arrows going up take the color from the source branch
colorClassNum = branchPos[commit1.branch].index; colorClassNum = branchPos[commit1.branch].index;
lineDef = `M ${p1.x} ${p1.y} L ${p2.x-radius} ${p1.y} ${arc} ${p2.x} ${p1.y-offset} L ${p2.x} ${p2.y}`; lineDef = `M ${p1.x} ${p1.y} L ${p2.x-radius} ${p1.y} ${arc} ${p2.x} ${p1.y-offset} L ${p2.x} ${p2.y}`;
} }
@@ -351,7 +348,6 @@ const drawArrow = (svg, commit1, commit2, allCommits) => {
} }
const arrow = svg.append('path').attr('d', lineDef) const arrow = svg.append('path').attr('d', lineDef)
.attr('class', 'arrow arrow' + colorClassNum) .attr('class', 'arrow arrow' + colorClassNum)
// .attr('marker-end', 'url(' + url + '#arrowhead)');
} }
const drawArrows = (svg, commits) => { const drawArrows = (svg, commits) => {
@@ -359,7 +355,6 @@ const drawArrows = (svg, commits) => {
let pos = 0; let pos = 0;
const k = Object.keys(commits); const k = Object.keys(commits);
console.log('drawArrows', k);
k.forEach((key, index) => { k.forEach((key, index) => {
const commit = commits[key]; const commit = commits[key];
if(commit.parents && commit.parents.length>0) { if(commit.parents && commit.parents.length>0) {

7
src/diagrams/git/styles.js
View File

@@ -26,10 +26,11 @@ const getStyles = (options) =>
stroke: black; stroke: black;
stroke-dasharray: 2; stroke-dasharray: 2;
} }
.commit-labels { font-size: 10px; fill: ${options.textColor};} .commit-label { font-size: 10px; fill: ${options.commitLabelColor};}
.commit-label-bkg { font-size: 10px; fill: ${options.commitLabelBackground}; opacity: 0.5; }
.tag-label { font-size: 10px; fill: ${options.tagLabelColor};} .tag-label { font-size: 10px; fill: ${options.tagLabelColor};}
.tag-label-bkg { fill: ${options.tagLabelBkg}; } .tag-label-bkg { fill: ${options.tagLabelBackground}; stroke: ${options.tagLabelBorder}; }
.tag-hole { fill: ${options.tagLabelColor}; opacity: 0.5; stroke-linejoin: round;} .tag-hole { fill: ${options.textColor}; }
.commit-merge { .commit-merge {
stroke: ${options.primaryColor}; stroke: ${options.primaryColor};

5
src/themes/theme-base.js
View File

@@ -225,8 +225,11 @@ class Theme {
this.gitBranchLabel6 = this.gitBranchLabel6 || this.branchLabelColor; this.gitBranchLabel6 = this.gitBranchLabel6 || this.branchLabelColor;
this.gitBranchLabel7 = this.gitBranchLabel7 || this.branchLabelColor; this.gitBranchLabel7 = this.gitBranchLabel7 || this.branchLabelColor;
this.tagLabelColor = this.tagLabelColor || this.darkMode ? this.branchLabelColor : 'white'; this.tagLabelColor = this.tagLabelColor || this.primaryTextColor;
this.tagLabelBackground = this.tagLabelBackground || this.primaryColor; this.tagLabelBackground = this.tagLabelBackground || this.primaryColor;
this.tagLabelBorder = this.tagBorder || this.primaryBorderColor;
this.commitLabelColor = this.commitLabelColor || this.secondaryTextColor;
this.commitLabelBackground = this.commitLabelBackground || this.secondaryColor;
} }
calculate(overrides) { calculate(overrides) {
if (typeof overrides !== 'object') { if (typeof overrides !== 'object') {

8
src/themes/theme-dark.js
View File

@@ -7,7 +7,7 @@ class Theme {
this.secondaryColor = lighten(this.primaryColor, 16); this.secondaryColor = lighten(this.primaryColor, 16);
this.tertiaryColor = adjust(this.primaryColor, { h: -160 }); this.tertiaryColor = adjust(this.primaryColor, { h: -160 });
this.primaryBorderColor = mkBorder(this.primaryColor, this.darkMode); this.primaryBorderColor = invert(this.background);
this.secondaryBorderColor = mkBorder(this.secondaryColor, this.darkMode); this.secondaryBorderColor = mkBorder(this.secondaryColor, this.darkMode);
this.tertiaryBorderColor = mkBorder(this.tertiaryColor, this.darkMode); this.tertiaryBorderColor = mkBorder(this.tertiaryColor, this.darkMode);
this.primaryTextColor = invert(this.primaryColor); this.primaryTextColor = invert(this.primaryColor);
@@ -205,6 +205,12 @@ class Theme {
this.gitInv5 = invert(this.git5); this.gitInv5 = invert(this.git5);
this.gitInv6 = invert(this.git6); this.gitInv6 = invert(this.git6);
this.gitInv7 = invert(this.git7); this.gitInv7 = invert(this.git7);
this.tagLabelColor = this.tagLabelColor || this.primaryTextColor;
this.tagLabelBackground = this.tagLabelBackground || this.primaryColor;
this.tagLabelBorder = this.tagBorder || this.primaryBorderColor;
this.commitLabelColor = this.commitLabelColor || this.secondaryTextColor;
this.commitLabelBackground = this.commitLabelBackground || this.secondaryColor;
} }
calculate(overrides) { calculate(overrides) {
if (typeof overrides !== 'object') { if (typeof overrides !== 'object') {

6
src/themes/theme-default.js
View File

@@ -244,6 +244,12 @@ class Theme {
this.gitBranchLabel5 = this.labelTextColor; this.gitBranchLabel5 = this.labelTextColor;
this.gitBranchLabel6 = this.labelTextColor; this.gitBranchLabel6 = this.labelTextColor;
this.gitBranchLabel7 = this.labelTextColor; this.gitBranchLabel7 = this.labelTextColor;
this.tagLabelColor = this.tagLabelColor || this.primaryTextColor;
this.tagLabelBackground = this.tagLabelBackground || this.primaryColor;
this.tagLabelBorder = this.tagBorder || this.primaryBorderColor;
this.commitLabelColor = this.commitLabelColor || this.secondaryTextColor;
this.commitLabelBackground = this.commitLabelBackground || this.secondaryColor;
} }
calculate(overrides) { calculate(overrides) {
if (typeof overrides !== 'object') { if (typeof overrides !== 'object') {

6
src/themes/theme-forest.js
View File

@@ -206,6 +206,12 @@ class Theme {
this.gitInv5 = invert(this.git5); this.gitInv5 = invert(this.git5);
this.gitInv6 = invert(this.git6); this.gitInv6 = invert(this.git6);
this.gitInv7 = invert(this.git7); this.gitInv7 = invert(this.git7);
this.tagLabelColor = this.tagLabelColor || this.primaryTextColor;
this.tagLabelBackground = this.tagLabelBackground || this.primaryColor;
this.tagLabelBorder = this.tagBorder || this.primaryBorderColor;
this.commitLabelColor = this.commitLabelColor || this.secondaryTextColor;
this.commitLabelBackground = this.commitLabelBackground || this.secondaryColor;
} }
calculate(overrides) { calculate(overrides) {
if (typeof overrides !== 'object') { if (typeof overrides !== 'object') {

6
src/themes/theme-neutral.js
View File

@@ -248,6 +248,12 @@ class Theme {
this.gitBranchLabel5 = this.branchLabelColor; this.gitBranchLabel5 = this.branchLabelColor;
this.gitBranchLabel6 = this.branchLabelColor; this.gitBranchLabel6 = this.branchLabelColor;
this.gitBranchLabel7 = this.branchLabelColor; this.gitBranchLabel7 = this.branchLabelColor;
this.tagLabelColor = this.tagLabelColor || this.primaryTextColor;
this.tagLabelBackground = this.tagLabelBackground || this.primaryColor;
this.tagLabelBorder = this.tagBorder || this.primaryBorderColor;
this.commitLabelColor = this.commitLabelColor || this.secondaryTextColor;
this.commitLabelBackground = this.commitLabelBackground || this.secondaryColor;
} }
calculate(overrides) { calculate(overrides) {
if (typeof overrides !== 'object') { if (typeof overrides !== 'object') {