Updated README

3 files changed, 27 insertions, 24 deletions

diff --git a/README.md b/README.md
index fef40dd..f525ef5 100644
--- a/README.md
+++ b/README.md
@@ -9,7 +9,7 @@ Svg.js is licensed under the terms of the MIT License.
 
 ### Create a SVG document
 
-Use the 'svg()' function to create a SVG document within a given html element:
+Use the `svg()` function to create a SVG document within a given html element:
 
 ```javascript
 var draw = svg('paper').size(300, 300);
@@ -25,11 +25,10 @@ This will generate the following output:
 	</svg>
 </div>
 ```
-If the svg canvas should follow the dimensions of its parent, in this case '#paper', you can also use a percentage value:
+By default the svg canvas follows the dimensions of its parent, in this case `#paper`:
 ```javascript
 var draw = svg('paper').size('100%', '100%');
 ```
-By default the width and height are set to 100% so you will not need it very often.
 
 
 ## Elements
@@ -42,11 +41,11 @@ var text = draw.rect(100, 100);
 
 
 ### Ellipse
-Ellipses, like rects, have two arguments, their width and height:
+Ellipses, like rects, have two arguments, their `width` and `height`:
 ```javascript
 var ellipse = draw.ellipse(100, 100);
 ```
-This element type has an extra method to move it by its 'cx' and 'cy' values:
+This element type has an extra method to move it by its `cx` and `cy` values:
 ```javascript
 ellipse.center(150, 150);
 ```
@@ -56,7 +55,7 @@ The only argument necessary for a circle is the diameter:
 ```javascript
 var circle = draw.circle(100);
 ```
-Like ellipse this element type has an extra method to move it by its 'cx' and 'cy' values:
+Like ellipse this element type has an extra method to move it by its `cx` and `cy` values:
 ```javascript
 circle.center(150, 150);
 ```
@@ -67,7 +66,7 @@ The first argument of a text element is the actual text content:
 ```javascript
 var text = draw.text("svg\nto\nthe\npoint.").move(300, 0);
 ```
-Changing text afterwards is also possible with the 'text()' method:
+Changing text afterwards is also possible with the `text()` method:
 ```javascript
 text.text('Brilliant!');
 ```
@@ -106,7 +105,7 @@ http://www.w3.org/TR/SVG/paths.html#PathData
 ## Manipulating elements
 
 ### Attributes
-You can get and set an element's attributes directly using 'attr()':
+You can get and set an element's attributes directly using `attr()`:
 
 ```javascript
 // get a single attribute
@@ -156,7 +155,7 @@ Important: matrix transformations are not yet supported.
 
 
 ### Move 
-Move the element to a given x and y position by its upper left corner:
+Move the element to a given `x` and `y` position by its upper left corner:
 ```javascript
 rect.move(200, 350);
 ```
@@ -164,15 +163,15 @@ Note that you can also use the following code to move elements around:
 ```javascript
 rect.attr({ x: 20, y: 60 });
 ``` 
-Although 'move()' is much more convenient because it will always use the upper left corner as the position reference, whereas with using 'attr()' the x an y reference differ between element types. For example, rect uses the upper left corner with the 'x' and 'y' attributes, circle and ellipse use their centre with the 'cx' and 'cy' attributes and thereby simply ignoring the 'x' and 'y' values you might assign.
+Although `move()` is much more convenient because it will always use the upper left corner as the position reference, whereas with using `attr()` the `x` and `y` reference differ between element types. For example, rect uses the upper left corner with the `x` and `y` attributes, circle and ellipse use their centre with the `cx` and `cy` attributes and thereby simply ignoring the `x` and `y` values you might assign.
 
 
 ### Size
-Set the size of an element by a given width and height:
+Set the size of an element by a given `width` and `height`:
 ```javascript
 rect.size(200, 300);
 ```
-Same as with 'move()' the size of an element could be set by using 'attr()'. But because every type of element is handles its size differently the 'size()' method is much more convenient.
+Same as with `move()` the size of an element could be set by using `attr()`. But because every type of element is handles its size differently the `size()` method is much more convenient.
 
 
 ### Removing elements
@@ -193,31 +192,35 @@ This will return an object with the following values:
 { height: 20, width: 20, y: 20, x: 10, cx: 30, cy: 20 } 
 ```
 
-As opposed to the built-in `getBBox()` method any translations used with the `transform()` method will be taken into account. 
+As opposed to the native `getBBox()` method any translations used with the `transform()` method will be taken into account. 
 
 
 ## Syntax sugar
 Fill and stroke are used quite often. Therefore two convenience methods are provided:
 
 ### Fill
-The 'fill()' method is a pretty alternative to the 'attr()' method:
+The `fill()` method is a pretty alternative to the `attr()` method:
 ```javascript
 rect.fill({ color: '#f06', opacity: 0.6 });
 ```
 
 ### Stroke
-The 'stroke()' method is similar to 'fill()':
+The `stroke()` method is similar to `fill()`:
+
 ```javascript
 rect.stroke({ color: '#f06', opacity: 0.6, width: 5 });
 ```
 
 ### Rotate
-The 'rotate()' method will automatically rotate elements according to the centre of the element:
+The `rotate()` method will automatically rotate elements according to the centre of the element:
+
 ```javascript
 // rotate(degrees)
 rect.rotate(45);
 ```
+
 Unless you also define a rotation point:
+
 ```javascript
 // rotate(degrees, cx, cy)
 rect.rotate(45, 100, 100);
@@ -227,9 +230,9 @@ _This functionality requires the sugar.js module which is included in the defaul
 
 
 ## Clipping elements
-Clipping elements can be done with either 'clip()' or 'clipTo()'.
+Clipping elements can be done with either `clip()` or `clipTo()`.
 
-Using 'clip()' creates a clip path in the parents 'defs' node, and passes it to a block:
+Using `clip()` creates a clip path in the parents 'defs' node, and passes it to a block:
 
 ```javascript
 rect.clip(function(clipPath) {
@@ -237,7 +240,7 @@ rect.clip(function(clipPath) {
 });
 ```
 
-You can also reuse clip paths for multiple elements using 'clipTo()'.
+You can also reuse clip paths for multiple elements using `clipTo()`.
 ```javascript
 var clipPath = doc.defs().clip();
 clipRect = clipPath.rect(80, 80).move(10, 10);
@@ -289,7 +292,7 @@ var gradient = draw.gradient('linear', function(stop) {
   stop.at({ offset: 100, color: '#fff', opacity: 1 });
 });
 ```
-The 'offset' and 'color' parameters are required for stops, 'opacity' is optional. Offset is an integer expressed in percentage. To define the direction you can set from x, y and to x, y:
+The `offset` and `color` parameters are required for stops, `opacity` is optional. Offset is an integer expressed in percentage. To define the direction you can set from `x`, `y` and to `x`, `y`:
 ```javascript
 gradient.from(0, 0).to(0, 100);
 ```
@@ -298,7 +301,7 @@ Finally, to use the gradient on an element:
 ```javascript
 rect.attr({ fill: gradient.fill() });
 ```
-Radial gradients have a 'radius()' method to define the outermost radius to where the inner color should develop:
+Radial gradients have a `radius()` method to define the outermost radius to where the inner color should develop:
 ```javascript
 var gradient = draw.gradient('radial', function(stop) {
   stop.at({ offset: 0, color: '#333', opacity: 1 });
@@ -355,7 +358,7 @@ SVG.extend(SVG.Circle, {
   
 });
 ```
-The complete inheritance stack for 'SVG.Circle' is:
+The complete inheritance stack for `SVG.Circle` is:
 
 _SVG.Circle < SVG.Shape < SVG.Element_
 
diff --git a/dist/svg.js b/dist/svg.js
index 0af08a8..39d2b66 100644
--- a/dist/svg.js
+++ b/dist/svg.js
@@ -1,4 +1,4 @@
-/* svg.js v0.1-27-g819c6e5 - svg container element group arrange defs clip gradient doc shape rect circle ellipse path image text sugar - svgjs.com/license */
+/* svg.js v0.1-28-gb0360d1 - svg container element group arrange defs clip gradient doc shape rect circle ellipse path image text sugar - svgjs.com/license */
 (function() {
 
   this.SVG = {
diff --git a/dist/svg.min.js b/dist/svg.min.js
index 83c9354..4762a1b 100644
--- a/dist/svg.min.js
+++ b/dist/svg.min.js
@@ -1,2 +1,2 @@
-/* svg.js v0.1-27-g819c6e5 - svg container element group arrange defs clip gradient doc shape rect circle ellipse path image text sugar - svgjs.com/license */
+/* svg.js v0.1-28-gb0360d1 - svg container element group arrange defs clip gradient doc shape rect circle ellipse path image text sugar - svgjs.com/license */
 function svg(e){return new SVG.Doc(e)}(function(){function n(){this.constructor.call(this,SVG.create("tspan"))}this.SVG={ns:"http://www.w3.org/2000/svg",xlink:"http://www.w3.org/1999/xlink",create:function(e){return document.createElementNS(this.ns,e)},extend:function(e,t){for(var n in t)e.prototype[n]=t[n]}},SVG.Container={add:function(e,t){return this.has(e)||(t=t==null?this.children().length:t,this.children().splice(t,0,e),this.node.insertBefore(e.node,this.node.childNodes[t]||null),e.parent=this),this},has:function(e){return this.children().indexOf(e)>=0},children:function(){return this._children||(this._children=[])},remove:function(e){return this.removeAt(this.children().indexOf(e))},removeAt:function(e){if(0<=e&&e<this.children().length){var t=this.children()[e];this.children().splice(e,1),this.node.removeChild(t.node),t.parent=null}return this},defs:function(){return this._defs==null&&(this._defs=new SVG.Defs,this.add(this._defs,0)),this._defs},level:function(){var e=this.defs();return this.remove(e).add(e,0),this},group:function(){var e=new SVG.G;return this.add(e),e},rect:function(e,t){var n=(new SVG.Rect).size(e,t);return this.add(n),n},circle:function(e){var t=(new SVG.Circle).size(e);return this.add(t),t},ellipse:function(e,t){var n=(new SVG.Ellipse).size(e,t);return this.add(n),n},path:function(e){var t=(new SVG.Path).plot(e);return this.add(t),t},image:function(e){var t=(new SVG.Image).load(e);return this.add(t),t},text:function(e){var t=(new SVG.Text).text(e);return this.add(t),t},gradient:function(e,t){return this.defs().gradient(e,t)},stage:function(){var e,t=this;return e=function(){document.readyState==="complete"?(t.attr("style","position:absolute;left:0;top:0;"),setTimeout(function(){t.attr("style","position:relative;")},5)):setTimeout(e,10)},e(),this}},SVG.Element=function(t){this.node=t,this.attrs={},this.trans={x:0,y:0,scaleX:1,scaleY:1,rotation:0,skewX:0,skewY:0},this._s="size family weight stretch variant style".split(" ")},SVG.extend(SVG.Element,{move:function(e,t){return this.attr({x:e,y:t})},size:function(e,t){return this.attr({width:e,height:t})},remove:function(){return this.parent!=null?this.parent.remove(this):void 0},parentDoc:function(){return this._parent(SVG.Doc)},attr:function(e,t,n){if(arguments.length<2){if(typeof e!="object")return this._isStyle(e)?e=="text"?this.content:e=="leading"?this[e]:this.style[e]:this.attrs[e];for(t in e)this.attr(t,e[t])}else{this.attrs[e]=t;if(e=="x"&&this._isText())for(var r=this.lines.length-1;r>=0;r--)this.lines[r].attr(e,t);else n!=null?this.node.setAttributeNS(n,e,t):this.node.setAttribute(e,t);this._isStyle(e)&&(e=="text"?this.text(t):e=="leading"?this[e]=t:this.style[e]=t,this.text(this.content))}return this},transform:function(e){if(typeof e=="string")return this.trans[e];var t,n=[],r=this.bbox(),i=this.attr("transform")||"",s=i.match(/[a-z]+\([^\)]+\)/g)||[];for(t in e)e[t]!=null&&(this.trans[t]=e[t]);return e=this.trans,e.rotation!=0&&n.push("rotate("+e.rotation+","+(e.cx!=null?e.cx:r.cx)+","+(e.cy!=null?e.cy:r.cy)+")"),e.scaleX!=1&&e.scaleY!=1&&n.push("scale("+e.sx+","+e.sy+")"),e.skewX!=0&&n.push("skewX("+x.skewX+")"),e.skewY!=0&&n.push("skewY("+x.skewY+")"),e.x!=0&&e.y!=0&&n.push("translate("+e.x+","+e.y+")"),this.attr("transform",n.join(" "))},bbox:function(){var e=this.node.getBBox();return e.x+=this.trans.x,e.y+=this.trans.y,e.cx=e.x+e.width/2,e.cy=e.y+e.height/2,e},_parent:function(e){var t=this;while(t!=null&&!(t instanceof e))t=t.parent;return t},_isStyle:function(e){return typeof e=="string"&&this._isText()?/^font|text|leading/.test(e):!1},_isText:function(){return this instanceof SVG.Text}}),SVG.G=function(){this.constructor.call(this,SVG.create("g"))},SVG.G.prototype=new SVG.Element,SVG.extend(SVG.G,SVG.Container),SVG.extend(SVG.Element,{siblings:function(){return this.parent.children()},forward:function(){var e=this.siblings().indexOf(this);return this.parent.remove(this).add(this,e+1),this},backward:function(){var e,t=this.parent.level();return e=this.siblings().indexOf(this),e>1&&t.remove(this).add(this,e-1),this},front:function(){return this.parent.remove(this).add(this),this},back:function(){var e,t=this.parent.level();return e=this.siblings().indexOf(this),e>1&&t.remove(this).add(this,0),this}}),SVG.Defs=function(){this.constructor.call(this,SVG.create("defs"))},SVG.Defs.prototype=new SVG.Element,SVG.extend(SVG.Defs,SVG.Container);var e=0;SVG.Clip=function(){this.constructor.call(this,SVG.create("clipPath")),this.id="svgjs_clip_"+e++,this.attr("id",this.id)},SVG.Clip.prototype=new SVG.Element,SVG.extend(SVG.Clip,SVG.Container),SVG.extend(SVG.Element,{clip:function(e){var t=this.parent.defs().clip();return e(t),this.clipTo(t)},clipTo:function(e){return this.attr("clip-path","url(#"+e.id+")")}}),SVG.extend(SVG.Defs,{clip:function(){var e=new SVG.Clip;return this.add(e),e}});var t=0;SVG.Gradient=function(n){this.constructor.call(this,SVG.create(n+"Gradient")),this.id="svgjs_grad_"+t++,this.type=n,this.attr("id",this.id)},SVG.Gradient.prototype=new SVG.Element,SVG.extend(SVG.Gradient,SVG.Container),SVG.extend(SVG.Gradient,{from:function(e,t){return this.type=="radial"?this.attr({fx:e+"%",fy:t+"%"}):this.attr({x1:e+"%",y1:t+"%"})},to:function(e,t){return this.type=="radial"?this.attr({cx:e+"%",cy:t+"%"}):this.attr({x2:e+"%",y2:t+"%"})},radius:function(e){return this.type=="radial"?this.attr({r:e+"%"}):this},at:function(e){var t=new SVG.Stop(e);return this.add(t),t},update:function(e){while(this.node.hasChildNodes())this.node.removeChild(this.node.lastChild);return e(this),this},fill:function(){return"url(#"+this.id+")"}}),SVG.extend(SVG.Defs,{gradient:function(e,t){var n=new SVG.Gradient(e);return this.add(n),t(n),n}}),SVG.Stop=function(t){this.constructor.call(this,SVG.create("stop")),this.update(t)},SVG.Stop.prototype=new SVG.Element,SVG.extend(SVG.Stop,{update:function(e){var t="",n=["opacity","color"];for(var r=n.length-1;r>=0;r--)e[n[r]]!=null&&(t+="stop-"+n[r]+":"+e[n[r]]+";");return this.attr({offset:(e.offset!=null?e.offset:this.attr("offset")||0)+"%",style:t})}}),SVG.Doc=function(t){this.constructor.call(this,SVG.create("svg"));var n=document.createElement("div");n.style.cssText="position:relative;width:100%;height:100%;",typeof t=="string"&&(t=document.getElementById(t)),this.attr({xmlns:SVG.ns,version:"1.1",width:"100%",height:"100%"}).attr("xlink",SVG.xlink,SVG.ns).defs(),t.appendChild(n),n.appendChild(this.node),this.stage()},SVG.Doc.prototype=new SVG.Element,SVG.extend(SVG.Doc,SVG.Container),SVG.Shape=function(t){this.constructor.call(this,t)},SVG.Shape.prototype=new SVG.Element,SVG.Rect=function(){this.constructor.call(this,SVG.create("rect"))},SVG.Rect.prototype=new SVG.Shape,SVG.Circle=function(){this.constructor.call(this,SVG.create("circle"))},SVG.Circle.prototype=new SVG.Shape,SVG.extend(SVG.Circle,{move:function(e,t){return this.attrs.x=e,this.attrs.y=t,this.center()},size:function(e){return this.attr("r",e/2).center()},center:function(e,t){var n=this.attrs.r||0;return this.attr({cx:e||(this.attrs.x||0)+n,cy:t||(this.attrs.y||0)+n})}}),SVG.Ellipse=function(){this.constructor.call(this,SVG.create("ellipse"))},SVG.Ellipse.prototype=new SVG.Shape,SVG.extend(SVG.Ellipse,{move:function(e,t){return this.attrs.x=e,this.attrs.y=t,this.center()},size:function(e,t){return this.attr({rx:e/2,ry:t/2}).center()},center:function(e,t){return this.attr({cx:e||(this.attrs.x||0)+(this.attrs.rx||0),cy:t||(this.attrs.y||0)+(this.attrs.ry||0)})}}),SVG.Path=function(){this.constructor.call(this,SVG.create("path"))},SVG.Path.prototype=new SVG.Shape,SVG.extend(SVG.Path,{plot:function(e){return this.attr("d",e||"M0,0L0,0")},move:function(e,t){return this.transform({x:e,y:t})}}),SVG.Image=function(){this.constructor.call(this,SVG.create("image"))},SVG.Image.prototype=new SVG.Shape,SVG.extend(SVG.Image,{load:function(e){return this.attr("xlink:href",e,SVG.xlink)}}),SVG.Text=function(){this.constructor.call(this,SVG.create("text")),this.style={"font-size":16,"font-family":"Helvetica","text-anchor":"start"},this.leading=1.2,this.lines=[]},SVG.Text.prototype=new SVG.Shape,SVG.extend(SVG.Text,{text:function(e){this.content=e=e||"text",this.lines=[];var t,r,i=this._style(),s=this.parentDoc(),o=e.split("\n");while(this.node.hasChildNodes())this.node.removeChild(this.node.lastChild);for(t=0,l=o.length;t<l;t++)r=(new n).text(o[t]).attr({dy:this.style["font-size"]*this.leading,x:this.attr("x")||0,style:i}),this.node.appendChild(r.node),this.lines.push(r);return this.attr("style",i)},_style:function(){var e,t="",n=this._s;for(e=n.length-1;e>=0;e--)this.style["font-"+n[e]]!=null&&(t+="font-"+n[e]+":"+this.style["font-"+n[e]]+";");return t+="text-anchor:"+this.style["text-anchor"]+";",t}}),n.prototype=new SVG.Shape,SVG.extend(n,{text:function(e){return this.node.appendChild(document.createTextNode(e)),this}}),SVG.extend(SVG.Shape,{fill:function(e){return e.color!=null&&this.attr("fill",e.color),e.opacity!=null&&this.attr("fill-opacity",e.opacity),this},stroke:function(e){e.color&&this.attr("stroke",e.color);var t="width opacity linecap linejoin miterlimit dasharray dashoffset".split(" ");for(var n=t.length-1;n>=0;n--)e[t[n]]!=null&&this.attr("stroke-"+t[n],e[t[n]]);return this}}),SVG.extend(SVG.Element,{rotate:function(e,t,n){var r=this.bbox();return this.transform({rotation:e||0,cx:t==null?r.cx:t,cy:n==null?r.cx:n})}}),SVG.extend(SVG.G,{move:function(e,t){return this.transform({x:e,y:t})}}),SVG.extend(SVG.Text,{font:function(e){var t,n={};for(t in e)t=="leading"?n[t]=e[t]:t=="anchor"?n["text-anchor"]=e[t]:this._s.indexOf(t)>-1?n["font-"+t]=e[t]:void 0;return this.attr(n).text(this.content)}})}).call(this);
\ No newline at end of file