Deprecate .hide-text mixin for .text-hide as mixin and class

This commit is contained in:
Mark Otto 2013-08-23 22:11:41 -07:00
parent e25ca1e7a9
commit 6de67c0ab6
3 changed files with 11 additions and 4 deletions

View File

@ -2294,14 +2294,14 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<h3 id="helper-classes-image-replacement">Image replacement</h3> <h3 id="helper-classes-image-replacement">Image replacement</h3>
<p>Utilize the <code>.hide-text</code> mixin or <code>.text-hide</code> class to help replace an element's text content with a background image.</p> <p>Utilize the <code>.text-hide</code> class or mixin to help replace an element's text content with a background image.</p>
{% highlight html %} {% highlight html %}
<h1 class="text-hide">Custom heading</h1> <h1 class="text-hide">Custom heading</h1>
{% endhighlight %} {% endhighlight %}
{% highlight css %} {% highlight css %}
// Usage as a Mixin // Usage as a Mixin
.heading { .heading {
.hide-text(); .text-hide();
} }
{% endhighlight %} {% endhighlight %}
</div> </div>

View File

@ -69,8 +69,15 @@
} }
// CSS image replacement // CSS image replacement
//
// Heads up! v3 launched with with only `.hide-text()`, but per our pattern for
// mixins being reused as classes with the same name, this doesn't hold up. As
// of v3.0.1 we have added `.text-hide()` and deprecated `.hide-text()`.
//
// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757 // Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
.hide-text() {
.hide-text(),
.text-hide() {
font: ~"0/0" a; font: ~"0/0" a;
color: transparent; color: transparent;
text-shadow: none; text-shadow: none;

View File

@ -30,7 +30,7 @@
visibility: hidden; visibility: hidden;
} }
.text-hide { .text-hide {
.hide-text(); .text-hide();
} }