Skip to content

Instantly share code, notes, and snippets.

@joe-watkins

joe-watkins/A-Pen-by-Joe-Watkins.markdown

Created February 17, 2014 19:46
Show Gist options
  • Save joe-watkins/9057565 to your computer and use it in GitHub Desktop.
Save joe-watkins/9057565 to your computer and use it in GitHub Desktop.
Download ZIP
A Pen by Joe Watkins.
Raw
index.html
<div class="item" data-website="http://google.com">
<p>
<span class="name has-website">
<a href="#">Item Name</a>
</span>
<span class="name no-website">
Item Name
</span>
I am the description
</p>
</div>
<div class="item" data-website="">
<p>
<span class="name has-website">
<a href="#">Item Name</a>
</span>
<span class="name no-website">
Item Name
</span>
I am the description
</p>
</div>
<div class="item" data-website="http://google.com">
<p>
<span class="name has-website">
<a href="#">Item Name</a>
</span>
<span class="name no-website">
Item Name
</span>
I am the description
</p>
</div>
Raw
style.scss
@import "compass";
.item {
.name {
display:block;
}
.name.has-website {
display:none;
visibility:hidden;
}
&[data-website*="http"] {
.name.has-website {
display:block;
visibility:visible;
}
.name.no-website {
display:none;
visibility:hidden;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment