Skip to content

Instantly share code, notes, and snippets.

@jlandure
Last active August 29, 2015 14:00
Show Gist options
  • Select an option

  • Save jlandure/11291354 to your computer and use it in GitHub Desktop.

Select an option

Save jlandure/11291354 to your computer and use it in GitHub Desktop.
.ptl-checkbox label {
cursor: pointer;
position: relative;
width: 20px;
height: 20px;
left: 8px;
top: 8px;
margin: 0px;
background: transparent;
border: #999 solid 1px;
}
.ptl-checkbox label:after {
filter: alpha(opacity=0);
opacity: 0;
content: '';
position: absolute;
width: 15px;
height: 10px;
background: transparent;
border: 3px solid @orange;
border-top: none;
border-right: none;
top: 2px;
left: 2px;
transform: rotate(-45deg);
}
.ptl-checkbox label:hover:after {
/*-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";*/
filter: alpha(opacity=30);
opacity: 0.3;
}
.ptl-checkbox input[type="checkbox"]:checked + label {
border: @orange solid 1px;
}
.ptl-checkbox input[type="checkbox"]:checked + label:after {
filter: alpha(opacity=100);
opacity: 1;
}
.ptl-checkbox input[type="checkbox"] {
visibility: hidden;
}
<div class="ptl-checkbox">
<!--<span class="checkbox-special" ng-click="addItem(marche)"></span>-->
<input type="checkbox" id="'{{marche.id}}'"/>
<label for="'{{marche.id}}'" ng-click="addItem(marche)"></label>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment