1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000 1.2 +++ b/widget/reftests/meter-fallback-default-style-ref.html Wed Dec 31 06:09:35 2014 +0100 1.3 @@ -0,0 +1,57 @@ 1.4 +<!DOCTYPE html> 1.5 +<html> 1.6 + <style> 1.7 + div.meter-element { 1.8 + /** 1.9 + * The purpose of this test is to not show the native style. 1.10 + * -moz-appearance: meterbar; 1.11 + */ 1.12 + display: inline-block; 1.13 + height: 1em; 1.14 + width: 5em; 1.15 + vertical-align: -0.2em; 1.16 + 1.17 + background: linear-gradient(#e6e6e6, #e6e6e6, #eeeeee 20%, #cccccc 45%, #cccccc 55%); 1.18 + } 1.19 + 1.20 + div.meter-bar { 1.21 + /** 1.22 + * The purpose of this test is to not show the native style. 1.23 + * -moz-appearance: meterchunk; 1.24 + */ 1.25 + 1.26 + height: 100%; 1.27 + width: 100%; 1.28 + 1.29 + background: linear-gradient(#ad7, #ad7, #cea 20%, #7a3 45%, #7a3 55%); 1.30 + } 1.31 + 1.32 + div.meter-element { padding: 5px; } 1.33 + body > div:nth-child(1) { -moz-appearance: none; } 1.34 + body > div:nth-child(2) > .meter-bar { -moz-appearance: none; } 1.35 + body > div:nth-child(3) { background: red; } 1.36 + body > div:nth-child(4) > .meter-bar { background: red; } 1.37 + body > div:nth-child(5) { border: 2px solid red; } 1.38 + body > div:nth-child(6) > .meter-bar { border: 5px solid red; width: -moz-calc(100% - 10px); } 1.39 + </style> 1.40 + <body> 1.41 + <div class="meter-element"> 1.42 + <div class="meter-bar"></div> 1.43 + </div> 1.44 + <div class="meter-element"> 1.45 + <div class="meter-bar"></div> 1.46 + </div> 1.47 + <div class="meter-element"> 1.48 + <div class="meter-bar"></div> 1.49 + </div> 1.50 + <div class="meter-element"> 1.51 + <div class="meter-bar"></div> 1.52 + </div> 1.53 + <div class="meter-element"> 1.54 + <div class="meter-bar"></div> 1.55 + </div> 1.56 + <div class="meter-element"> 1.57 + <div class="meter-bar"></div> 1.58 + </div> 1.59 + </body> 1.60 +</html>