Merge pull request #50 from CartoDB/three-points-changes

Changing Threepoints usage markup to Button instead of div.
This commit is contained in:
piensaenpixel 2016-02-04 19:57:56 +01:00
commit 597da73511

View File

@ -7,29 +7,29 @@ Description
<h2>16px</h2> <h2>16px</h2>
<div style="padding: 20px;"> <div style="padding: 20px;">
<div class="CDB-Shape" style="background: rgba(0, 0, 0, .02);"> <div class="CDB-Shape" style="background: rgba(0, 0, 0, .02);">
<div class="CDB-Shape-threePoints"> <button class="CDB-Shape-threePoints js-actions">
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
</div> </button>
</div> </div>
</div> </div>
<div style="padding: 20px;"> <div style="padding: 20px;">
<div class="CDB-Shape" style="background: rgba(0, 0, 0, .02);"> <div class="CDB-Shape" style="background: rgba(0, 0, 0, .02);">
<div class="CDB-Shape-threePoints is-blue"> <button class="CDB-Shape-threePoints is-blue js-actions">
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
</div> </button>
</div> </div>
</div> </div>
<div style="padding: 20px; background: #2E3C43;"> <div style="padding: 20px; background: #2E3C43;">
<div class="CDB-Shape" style="background: rgba(0, 0, 0, .08);"> <div class="CDB-Shape" style="background: rgba(0, 0, 0, .08);">
<div class="CDB-Shape-threePoints is-white"> <button class="CDB-Shape-threePoints is-white js-actions">
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
</div> </button>
</div> </div>
</div> </div>
<br> <br>
@ -39,29 +39,29 @@ Description
<h2>12px</h2> <h2>12px</h2>
<div style="padding: 20px;"> <div style="padding: 20px;">
<div class="CDB-Shape" style="background: rgba(0, 0, 0, .02);"> <div class="CDB-Shape" style="background: rgba(0, 0, 0, .02);">
<div class="CDB-Shape-threePoints is-small"> <button class="CDB-Shape-threePoints is-small js-actions">
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
</div> </button>
</div> </div>
</div> </div>
<div style="padding: 20px;"> <div style="padding: 20px;">
<div class="CDB-Shape" style="background: rgba(0, 0, 0, .02);"> <div class="CDB-Shape" style="background: rgba(0, 0, 0, .02);">
<div class="CDB-Shape-threePoints is-blue is-small"> <button class="CDB-Shape-threePoints is-blue is-small js-actions">
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
</div> </button>
</div> </div>
</div> </div>
<div style="padding: 20px; background: #2E3C43;"> <div style="padding: 20px; background: #2E3C43;">
<div class="CDB-Shape" style="background: rgba(0, 0, 0, .08);"> <div class="CDB-Shape" style="background: rgba(0, 0, 0, .08);">
<div class="CDB-Shape-threePoints is-white is-small"> <button class="CDB-Shape-threePoints is-white is-small js-actions">
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div> <div class="CDB-Shape-threePointsItem"></div>
</div> </button>
</div> </div>
</div> </div>
``` ```