@mixin placeholder { &::-moz-placeholder { @content; } &::-webkit-input-placeholder { @content; } &:-ms-input-placeholder { @content; } &.placeholder-visible, & + .placeholder-text { @content; } } @mixin checked { &:checked { @content; } &.prop-checked { @content; } } @mixin progress { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; @content; &::-webkit-progress-bar { @content; border: 0 none; } &::-moz-progress-bar { @content; } &::-ms-fill { animation-name: none; @content; } } @mixin progressbar { &::-webkit-progress-value { @content; } &::-moz-progress-bar { @content; } &::-ms-fill { animation-name: none; @content; } > span.progress-value { display: block !important; @content; } } @mixin indeterminate-progressbar { &:indeterminate::-webkit-progress-bar { @content; } &:indeterminate::-moz-progress-bar { @content; } &:indeterminate { animation-name: none; @content; } &.ws-indeterminate > span.progress-value { display: block !important; width: 100%; right: 0; @content; } } @mixin summary-marker { &::-webkit-details-marker { display: none; } > .details-open-indicator { display: none; } &:before { display: inline-block; content: ">"; @content; } } @mixin cue($c: false) { @if $c == false { &::cue { @content; } & + .cue-display span.cue { @content; } } @else { &::cue(#{$c}) { @content; } & + .cue-display span.cue #{$c} { @content; } } }