text transformation added

Transform text in components with text capitalization classes.

diff --git a/docs/_includes/css/type.html b/docs/_includes/css/type.html
index da81d7414a6277cdc27dc4aba882b49b63df8ea9..57ee72b920504e835199d51b34d049b9e1853c65 100644 (file)
--- a/docs/_includes/css/type.html
+++ b/docs/_includes/css/type.html
@@ -203,6 +203,18 @@ You can use the mark tag to <mark>highlight</mark> text.
 <p class="text-justify">Justified text.</p>
 {% endhighlight %}
 
+  <h2 id="type-transformation">Transformation classes</h2>
+  <p>Transform text in components with text capitalization classes.</p>
+  <div class="bs-example">
+      <p class="text-lowercase">Lowercase text.</p>
+      <p class="text-uppercase">Uppercase text.</p>
+      <p class="text-capitalize">Capitalize text.</p>
+  </div>
+{% highlight html %}
+<p class="text-lowercase">Lowercase text.</p>
+<p class="text-uppercase">Uppercase text.</p>
+<p class="text-capitalize">Capitalize text.</p>
+{% endhighlight %}
 
   <!-- Abbreviations -->
   <h2 id="type-abbreviations">Abbreviations</h2>

diff --git a/docs/_includes/nav/css.html b/docs/_includes/nav/css.html
index 5a8d86368da06d136b2ccc9080aed2cb49bf3ef5..ac86dffceccba52e7aad8bc49202f21e240d543b 100644 (file)
--- a/docs/_includes/nav/css.html
+++ b/docs/_includes/nav/css.html
@@ -33,6 +33,7 @@
     <li><a href="#type-body-copy">Body copy</a></li>
     <li><a href="#type-inline-text">Inline text elements</a></li>
     <li><a href="#type-alignment">Alignment classes</a></li>
+    <li><a href="#type-transformation">Transformation classes</a></li>
     <li><a href="#type-abbreviations">Abbreviations</a></li>
     <li><a href="#type-addresses">Addresses</a></li>
     <li><a href="#type-blockquotes">Blockquotes</a></li>

diff --git a/less/type.less b/less/type.less
index 384cacc8e8b67a7821f418e860da8e02ac1e4377..d76298e578b58d92ce0bc8a1b74775af27381f9b 100644 (file)
--- a/less/type.less
+++ b/less/type.less
@@ -97,6 +97,11 @@ mark,
 .text-center         { text-align: center; }
 .text-justify        { text-align: justify; }
 
+// Transformation
+.text-lowercase      { text-transform: lowercase; }
+.text-uppercase      { text-transform: uppercase; }
+.text-capitalize     { text-transform: capitalize; }
+
 // Contextual colors
 .text-muted {
   color: @text-muted;