W3C home > Mailing lists > Public > public-svg-wg@w3.org > July to September 2014

[svgwg] Update text section and use proper CSS basic shape defintions.

From: SVG Working Group repository <cam+svgwgrepo@mcc.id.au>
Date: Tue, 26 Aug 2014 04:21:42 -0700 (PDT)
To: public-svg-wg@w3.org
Message-Id: <20140826112142.4F85B1547B30@ps58493.dreamhostps.com>
https://github.com/w3c/svgwg/commit/3291d1230b0f7551927138ff67071a4328eeb861
commit 3291d1230b0f7551927138ff67071a4328eeb861
Author: Dirk Schulze <dschulze@chromium.org>
Date:   Tue Aug 26 12:09:33 2014 +0100

    Update text section and use proper CSS basic shape defintions.

diff --git a/master/text.html b/master/text.html
index f584009..810cd36 100644
--- a/master/text.html
+++ b/master/text.html
@@ -1839,7 +1839,7 @@ swash forms, old-style figures etc. while also ensuring that a font is provided
         of shifting x and y (e.g. using baseline='text-before-edge')
         by not allowing this option. It is trivial to define a
         rectangluar box content area using
-        shape-inside="rectangle(x,y,width,height)" as shown in
+        shape-inside="inset(&lt;offset-values>)" as shown in
         the example in the <a>'shape-inside'</a> section.
       </p>
     </dd>
@@ -2018,7 +2018,7 @@ swash forms, old-style figures etc. while also ensuring that a font is provided
     <dt><span class="attr-value">&lt;basic-shape&gt;</span></dt>
     <dd>
       The shape is computed based on the values of one of
-      ‘rectangle’,‘ circle’, ‘ellipse’ or ‘polygon’.
+      inset,‘ circle’, ‘ellipse’ or ‘polygon’.
 
       <div class="example">
 	<p>
@@ -2029,18 +2029,18 @@ swash forms, old-style figures etc. while also ensuring that a font is provided
 <svg xmlns="http://www.w3.org/2000/svg"
      width="300" height="100" viewBox="0 0 300 100">
 
-  <text shape-inside="rectangle(50,10,200,80)"
+  <text shape-inside="circle(100 at 100 100)"
 	font-family="sans-serif"
-	font-size="20px" >This text wraps in a rectangle.</text>
+	font-size="20px">Lorem ipsum dolor sit amet, consec-tetuer adipiscing elit...</text>
 
 </svg>
 ]]></pre>
 
 	<div class="figure">
-	  <img class="bordered" src="images/text/text-wrap-rectangle.svg"
-	       alt="Image showing text wrapped inside a rectangle."/>
+	  <img class="bordered" src="images/text/text-wrap-circle.svg"
+	       alt="Image showing text wrapped inside a circle."/>
 	  <p class="caption">
-	    Horizontal text wrapping inside a CSS rectangle shape.
+	    Horizontal text wrapping inside a CSS circle shape.
 	    The light-blue lines indicate the limits of the
 	    <a>content area</a>.
 	  </p>
@@ -2049,13 +2049,13 @@ swash forms, old-style figures etc. while also ensuring that a font is provided
 
       <div class="issue">
         <p>
-          Shapes also defines 'inset-rectangle'. It might be
+          Shapes also defines 'inset'. It might be
           interesting to be able to write:
         </p>
 
 	      <pre><![CDATA[
 <rect ...>
-  <text shape-inside="inset-rectangle(20px,10px,20px,10px)">...</text>
+  <text shape-inside="inset(20px 10px 20px 10px)">...</text>
 </rect>
 ]]></pre>
 
@@ -2194,7 +2194,7 @@ swash forms, old-style figures etc. while also ensuring that a font is provided
     <dt><span class="attr-value">&lt;basic-shape&gt;</span></dt>
     <dd>
       The shape is computed based on the values of one of
-      ‘rectangle’,‘ circle’, ‘ellipse’ or ‘polygon’.
+      ‘inset’,‘ circle’, ‘ellipse’ or ‘polygon’.
     </dd>
 
     <dt><span class="attr-value">&lt;uri&gt;</span></dt>
Received on Tuesday, 26 August 2014 11:22:05 UTC

This archive was generated by hypermail 2.3.1 : Tuesday, 6 January 2015 21:20:20 UTC