fix gradient mixins by escaping them, add notes on progress bars

2 files changed, 13 insertions, 13 deletions

diff --git a/docs/templates/pages/components.mustache b/docs/templates/pages/components.mustache
index 849d905ca..c334c3aa3 100644
--- a/docs/templates/pages/components.mustache
+++ b/docs/templates/pages/components.mustache
@@ -1694,7 +1694,7 @@
     </div>
     <div class="span4">
       <h3>{{_i}}Striped{{/i}}</h3>
-      <p>{{_i}}Uses a gradient to create a striped effect.{{/i}}</p>
+      <p>{{_i}}Uses a gradient to create a striped effect (no IE).{{/i}}</p>
       <div class="progress progress-striped">
         <div class="bar" style="width: 20%;"></div>
       </div>
@@ -1707,7 +1707,7 @@
     </div>
     <div class="span4">
       <h3>{{_i}}Animated{{/i}}</h3>
-      <p>{{_i}}Takes the striped example and animates it.{{/i}}</p>
+      <p>{{_i}}Takes the striped example and animates it (no IE).{{/i}}</p>
       <div class="progress progress-striped active">
         <div class="bar" style="width: 45%"></div>
       </div>
@@ -1762,8 +1762,8 @@
     </div>
     <div class="span3">
       <h3>{{_i}}Browser support{{/i}}</h3>
-      <p>{{_i}}Progress bars use CSS3 gradients, transitions, and animations to achieve all their effects. These features are not supported in IE7-8 or older versions of Firefox.{{/i}}</p>
-      <p>{{_i}}Opera does not support animations at this time.{{/i}}</p>
+      <p>{{_i}}Progress bars use CSS3 gradients, transitions, and animations to achieve all their effects. These features are not supported in IE7-9 or older versions of Firefox.{{/i}}</p>
+      <p>{{_i}}Opera and IE do not support animations at this time.{{/i}}</p>
     </div>
   </div>
 
diff --git a/docs/templates/pages/less.mustache b/docs/templates/pages/less.mustache
index 744861dea..1ffb92b2e 100644
--- a/docs/templates/pages/less.mustache
+++ b/docs/templates/pages/less.mustache
@@ -578,47 +578,47 @@
     </thead>
     <tbody>
       <tr>
-        <td><code>.#translucent > .background()</code></td>
+        <td><code>#translucent > .background()</code></td>
         <td><code>@color: @white, @alpha: 1</code></td>
         <td>{{_i}}Give an element a translucent background color{{/i}}</td>
       </tr>
       <tr>
-        <td><code>.#translucent > .border()</code></td>
+        <td><code>#translucent > .border()</code></td>
         <td><code>@color: @white, @alpha: 1</code></td>
         <td>{{_i}}Give an element a translucent border color{{/i}}</td>
       </tr>
       <tr>
-        <td><code>.#gradient > .vertical()</code></td>
+        <td><code>#gradient > .vertical()</code></td>
         <td><code>@startColor, @endColor</code></td>
         <td>{{_i}}Create a cross-browser vertical background gradient{{/i}}</td>
       </tr>
       <tr>
-        <td><code>.#gradient > .horizontal()</code></td>
+        <td><code>#gradient > .horizontal()</code></td>
         <td><code>@startColor, @endColor</code></td>
         <td>{{_i}}Create a cross-browser horizontal background gradient{{/i}}</td>
       </tr>
       <tr>
-        <td><code>.#gradient > .directional()</code></td>
+        <td><code>#gradient > .directional()</code></td>
         <td><code>@startColor, @endColor, @deg</code></td>
         <td>{{_i}}Create a cross-browser directional background gradient{{/i}}</td>
       </tr>
       <tr>
-        <td><code>.#gradient > .vertical-three-colors()</code></td>
+        <td><code>#gradient > .vertical-three-colors()</code></td>
         <td><code>@startColor, @midColor, @colorStop, @endColor</code></td>
         <td>{{_i}}Create a cross-browser three-color background gradient{{/i}}</td>
       </tr>
       <tr>
-        <td><code>.#gradient > .radial()</code></td>
+        <td><code>#gradient > .radial()</code></td>
         <td><code>@innerColor, @outerColor</code></td>
         <td>{{_i}}Create a cross-browser radial background gradient{{/i}}</td>
       </tr>
       <tr>
-        <td><code>.#gradient > .striped()</code></td>
+        <td><code>#gradient > .striped()</code></td>
         <td><code>@color, @angle</code></td>
         <td>{{_i}}Create a cross-browser striped background gradient{{/i}}</td>
       </tr>
       <tr>
-        <td><code>.#gradientBar()</code></td>
+        <td><code>#gradientBar()</code></td>
         <td><code>@primaryColor, @secondaryColor</code></td>
         <td>{{_i}}Used for buttons to assign a gradient and slightly darker border{{/i}}</td>
       </tr>