Skip to content

Commit

Permalink
fix(range): Display range inputs on WP Closes #3479
Browse files Browse the repository at this point in the history
  • Loading branch information
perrygovier committed Apr 22, 2015
1 parent 63a0834 commit e8ecfe9
Show file tree
Hide file tree
Showing 3 changed files with 38 additions and 3 deletions.
3 changes: 3 additions & 0 deletions scss/_mixins.scss
Original file line number Diff line number Diff line change
Expand Up @@ -119,6 +119,9 @@
&::-webkit-slider-thumb:before {
background: $track-bg-color;
}
&::-ms-fill-lower{
background: $track-bg-color;
}
}


Expand Down
36 changes: 34 additions & 2 deletions scss/_range.scss
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@
border: 0;
}

&::-webkit-slider-thumb:before {
&::-webkit-slider-thumb:before{
/* what creates the colorful line on the left side of the slider */
position: absolute;
top: ($range-slider-height / 2) - ($range-track-height / 2);
Expand All @@ -54,7 +54,32 @@
//background: red;
//opacity: .5;
}

&::-ms-track{
background: transparent;
border-color: transparent;
border-width: 11px 0 16px;
color:transparent;
margin-top:20px;
}
&::-ms-thumb {
width: $range-slider-width;
height: $range-slider-height;
border-radius: $range-slider-border-radius;
background-color: $toggle-handle-off-bg-color;
border-color:$toggle-handle-off-bg-color;
box-shadow: $range-slider-box-shadow;
margin-left:1px;
margin-right:1px;
outline:none;
}
&::-ms-fill-lower{
height: $range-track-height;
background:$dark;
}
&::-ms-fill-upper {
height: $range-track-height;
background:$range-default-track-bg;
}
}

.range {
Expand Down Expand Up @@ -119,3 +144,10 @@
padding-right: 5px;
padding-left: 0;
}

// WP range height must be auto
.platform-windowsphone{
.range input{
height:auto;
}
}
2 changes: 1 addition & 1 deletion test/css/input-range.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
<link href="../../dist/css/ionic.css" rel="stylesheet">
<style>
body {
position: absolute;;
position: absolute;
}
</style>
</head>
Expand Down

0 comments on commit e8ecfe9

Please sign in to comment.