diff --git a/src/index.html b/src/index.html
index fa61e57..846318e 100644
--- a/src/index.html
+++ b/src/index.html
@@ -34,12 +34,20 @@
stroke: #000;
}
- circle.anchor {
+ circle.pin {
fill: #6b6659;
stroke-width: 2px;
stroke: #000;
}
+ .anchor text {
+ fill: #fff;
+ }
+
+ .anchor rect {
+ fill: #6b6659;
+ }
+
.placeholder text {
fill: #fff;
font-weight: bold;
diff --git a/src/js/parser/javascript/base.js b/src/js/parser/javascript/base.js
index 13b1545..c51fd8b 100644
--- a/src/js/parser/javascript/base.js
+++ b/src/js/parser/javascript/base.js
@@ -2,10 +2,7 @@ export default {
render_label(container, text) {
var group = container.group();
- group.rect().attr({
- rx: 10,
- ry: 10
- });
+ group.rect();
group.text().attr({
text: text
@@ -40,6 +37,11 @@ export default {
this.container.attr({ 'class': 'placeholder' });
this.label = this.render_label(this.container, this.textValue);
+
+ this.label.select('rect').attr({
+ rx: 10,
+ ry: 10
+ });
},
position() {
diff --git a/src/js/parser/javascript/match.js b/src/js/parser/javascript/match.js
index 895f6d9..a43eb18 100644
--- a/src/js/parser/javascript/match.js
+++ b/src/js/parser/javascript/match.js
@@ -10,7 +10,8 @@ export default _.extend({}, Base, {
this.contents = {};
if (this.anchor_start()) {
- this.contents.anchor_start = this.render_label(this.container, 'Start of line');
+ this.contents.anchor_start = this.render_label(this.container, 'Start of line')
+ .attr({ 'class': 'anchor' });
}
this.contents.parts = _.map(this.parts(), function(part) {
@@ -20,7 +21,8 @@ export default _.extend({}, Base, {
});
if (this.anchor_end()) {
- this.contents.anchor_end = this.render_label(this.container, 'End of line');
+ this.contents.anchor_end = this.render_label(this.container, 'End of line')
+ .attr({ 'class': 'anchor' });
}
},
diff --git a/src/js/parser/javascript/root.js b/src/js/parser/javascript/root.js
index c2ac73b..b7d77c2 100644
--- a/src/js/parser/javascript/root.js
+++ b/src/js/parser/javascript/root.js
@@ -10,11 +10,11 @@ export default _.extend({}, Base, {
this.start = this.container.circle().attr({
r: 5,
- 'class': 'anchor'
+ 'class': 'pin'
});
this.end = this.container.circle().attr({
r: 5,
- 'class': 'anchor'
+ 'class': 'pin'
});
},