aboutsummaryrefslogtreecommitdiff
path: root/node_modules/montage/ui/bluemoon/checkbox.reel/checkbox.css
diff options
context:
space:
mode:
authorValerio Virgillito2012-02-03 12:20:10 -0800
committerValerio Virgillito2012-02-03 12:20:10 -0800
commite6e539f345f5e1ac36a595db5d1a1c3700715e88 (patch)
tree39846bf1570f9b5a4057b726c54905de9e9e1c02 /node_modules/montage/ui/bluemoon/checkbox.reel/checkbox.css
parent7950424cf704bb221971f4645406b01e6979db18 (diff)
parentc630ead20487c3948fa36448d3e7d5f7b5cba782 (diff)
downloadninja-e6e539f345f5e1ac36a595db5d1a1c3700715e88.tar.gz
Merge branch 'master' into components
Conflicts: node_modules/montage/ui/bluemoon/progress.reel/progress.html node_modules/montage/ui/image2.reel/image2.html node_modules/ninja-components/effect/desaturate-effect.js node_modules/ninja-components/effect/effect.js node_modules/ninja-components/effect/invert-effect.js node_modules/ninja-components/effect/kaliedoscope-effect.js node_modules/ninja-components/effect/multiply-effect.js node_modules/ninja-components/effect/sepia-effect.js node_modules/ninja-components/flow-controller.reel/flow-controller.html node_modules/ninja-components/flow-controller.reel/flow-controller.js node_modules/ninja-components/flow-offset.js node_modules/ninja-components/hottext.reel/hottext.css node_modules/ninja-components/hottext.reel/hottext.html node_modules/ninja-components/hottext.reel/hottext.js node_modules/ninja-components/hottextunit.reel/hottextunit.css node_modules/ninja-components/hottextunit.reel/hottextunit.html node_modules/ninja-components/hottextunit.reel/hottextunit.js node_modules/ninja-components/image2.reel/image2.html node_modules/ninja-components/image2.reel/image2.js node_modules/ninja-components/image3d.reel/image3d.html node_modules/ninja-components/image3d.reel/image3d.js node_modules/ninja-components/photo-editor.reel/photo-editor.css node_modules/ninja-components/photo-editor.reel/photo-editor.html node_modules/ninja-components/photo-editor.reel/photo-editor.js node_modules/ninja-components/slider-base.js user-document-templates/montage-application-cloud/appdelegate.js Signed-off-by: Valerio Virgillito <valerio@motorola.com>
Diffstat (limited to 'node_modules/montage/ui/bluemoon/checkbox.reel/checkbox.css')
-rw-r--r--node_modules/montage/ui/bluemoon/checkbox.reel/checkbox.css116
1 files changed, 116 insertions, 0 deletions
diff --git a/node_modules/montage/ui/bluemoon/checkbox.reel/checkbox.css b/node_modules/montage/ui/bluemoon/checkbox.reel/checkbox.css
new file mode 100644
index 00000000..2a0c8c99
--- /dev/null
+++ b/node_modules/montage/ui/bluemoon/checkbox.reel/checkbox.css
@@ -0,0 +1,116 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */
6.montage-checkbox {
7 display: inline-block;
8 width: 53px;
9 height: 53px;
10}
11
12.montage-checkbox .background {
13 display: block;
14 position: absolute;
15 width: 53px;
16 height: 53px;
17 border-radius: 27px;
18 background: #CCC;
19 -webkit-box-shadow: inset 0 1px 2px #8D8D8D, 0 2px 2px rgba(255,255,255,.4), 0 -2px 2px rgba(0,0,0,.1);
20 -webkit-transform: scale3d(.5283, .5283, 1);
21}
22
23.montage-checkbox .button {
24 display: block;
25 position: absolute;
26 width: 49px;
27 height: 49px;
28 border-radius: 25px;
29 background: -webkit-gradient(linear, left top, left bottom, from(#FEFEFE), to(#E6E6E6));
30 -webkit-transform: translate3d(2px, 2px, 0) scale3d(.5283, .5283, 1);
31}
32
33.montage-checkbox .checkmark {
34 display: block;
35 position: absolute;
36 width: 63px;
37 height: 53px;
38 background: url(checkmark.svg) no-repeat 10px 0;
39 background-size: 53px 53px;
40 -webkit-transform-origin: 26.5px 26.5px;
41 -webkit-transform: scale3d(.5283, .5283, 1);
42 opacity: 0;
43}
44
45.montage-checkbox.active .background, .montage-checkbox.active .button, .montage-checkbox.active .checkmark{
46 -webkit-transition-duration: 150ms;
47 -webkit-transition-property: all;
48}
49
50.montage-checkbox .checkmark{
51 -webkit-transition-duration: 360ms;
52}
53
54.montage-checkbox input[type=checkbox] {
55 -webkit-appearance: none;
56 -webkit-tap-highlight-color: transparent;
57 display: inline-block;
58 position: absolute;
59 border: 0;
60 border-radius: 27px;
61 margin: 0;
62 padding: 0;
63 width: 53px;
64 height: 53px;
65 background: transparent;
66}
67
68.montage-checkbox.active .background,
69.montage-checkbox.active .button,
70.montage-checkbox.active .checkmark {
71 -webkit-transform: scale3d(1, 1, 1);
72}
73
74.montage-checkbox.active .button {
75 opacity: 0;
76}
77
78.montage-checkbox.checked .checkmark {
79 opacity: 1;
80}
81
82.montage-checkbox.dark .checkmark {
83 background-image: url(checkmark-dark.svg);
84}
85
86.montage-checkbox.dark .button {
87 background: -webkit-gradient(linear, left top, left bottom, from(#757575), to(#5c5c5c));
88}
89
90.montage-checkbox.dark .background {
91 background: #404040;
92 -webkit-box-shadow: inset 0 1px 2px #333, 0 2px 2px rgba(255,255,255,.2), 0 -2px 2px rgba(0,0,0,.1);
93}
94
95.montage-checkbox.disabled .background {
96 margin: 12px 0 0 13px;
97 width: 26px;
98 height: 26px;
99 background: transparent;
100 -webkit-box-shadow: none;
101 border: 1px solid #000;
102 -webkit-transform: none;
103 opacity: .26;
104}
105
106.montage-checkbox.disabled .button {
107 display: none;
108}
109
110.montage-checkbox.disabled .checkmark {
111 background-image: url(checkmark-light-disabled.svg);
112}
113
114.montage-checkbox.dark.disabled .checkmark {
115 background-image: url(checkmark-dark-disabled.svg);
116}