widget/reftests/progressbar-fallback-default-style-ref.html@b8a032363ba2
widget/reftests/progressbar-fallback-default-style-ref.html
Thu, 22 Jan 2015 13:21:57 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Thu, 22 Jan 2015 13:21:57 +0100
- branch
- TOR_BUG_9701
- changeset 15
- b8a032363ba2
- permissions
- -rw-r--r--
Incorporate requested changes from Mozilla in review:
https://bugzilla.mozilla.org/show_bug.cgi?id=1123480#c6
1 <!DOCTYPE html>
2 <html>
3 <style>
4 div.progress-element {
5 /**
6 * The purpose of this test is to not show the native style.
7 * -moz-appearance: progressbar;
8 */
9 display: inline-block;
10 height: 1em;
11 width: 10em;
12 vertical-align: -0.2em;
14 /* Default style in case of there is -moz-appearance: none; */
15 border: 2px solid;
16 -moz-border-top-colors: ThreeDShadow #e6e6e6;
17 -moz-border-right-colors: ThreeDHighlight #e6e6e6;
18 -moz-border-bottom-colors: ThreeDHighlight #e6e6e6;
19 -moz-border-left-colors: ThreeDShadow #e6e6e6;
20 background-color: #e6e6e6;
21 }
23 div.progress-bar {
24 /**
25 * The purpose of this test is to not show the native style.
26 * -moz-appearance: progresschunk;
27 */
29 height: 100%;
30 width: 100%;
32 box-sizing: border-box;
34 /* Default style in case of there is -moz-appearance: none; */
35 background-color: #0064b4;
36 }
38 div.progress-element { padding: 5px; }
39 body > div:nth-child(1) { -moz-appearance: none; }
40 body > div:nth-child(2) > .progress-bar { -moz-appearance: none; }
41 body > div:nth-child(3) { background-color: red; }
42 body > div:nth-child(4) > .progress-bar { background-color: red; }
43 body > div:nth-child(5) { border: 2px solid red; }
44 body > div:nth-child(6) > .progress-bar { border: 5px solid red; }
45 </style>
46 <body>
47 <div class="progress-element">
48 <div class="progress-bar"></div>
49 </div>
50 <div class="progress-element">
51 <div class="progress-bar"></div>
52 </div>
53 <div class="progress-element">
54 <div class="progress-bar"></div>
55 </div>
56 <div class="progress-element">
57 <div class="progress-bar"></div>
58 </div>
59 <div class="progress-element">
60 <div class="progress-bar"></div>
61 </div>
62 <div class="progress-element">
63 <div class="progress-bar"></div>
64 </div>
65 </body>
66 </html>
