minimal-devices 0.5.8 → 0.5.8.1

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: bd0c3ff7ab5c885c07da8e863032890e2703abf2
4
- data.tar.gz: 2f8dfe2c72be224baa2d8db59073817e3e961147
3
+ metadata.gz: f75c5f1b875fb98640c102acd29f1839af40a746
4
+ data.tar.gz: c8cb70eb9f3a16088879c86642592a045b41f4c1
5
5
  SHA512:
6
- metadata.gz: 123e990ddee96e75c98e6e3176dd3bcc2cd29548205d5a8a89ef7444e4e3cb42fee88acb66902996bc8ad0358f05f5acf52122f6c354ccd2efd825245481eb8a
7
- data.tar.gz: 9cb1124164beb069774ef2f4da29d25cad1a8e6330202a4d9fe9fc6111a68ec0d88c17ff959bef198fce72397d62fa1691bf753d9b88b06bad376b4bffcb57f6
6
+ metadata.gz: a4a20a29f1a0c6fc61c209df482c1d7a9de834c5c1bd54d7fcf7c185770f5457d52a7788ccc56da0a7a1da435ee43a4408d12d256ecfed43ffed96c93a2147a3
7
+ data.tar.gz: 1f8fe9f02c24a98ab84eb6ad5be351f25757cc5dadc3d644c4087af62733f35c1a701e77823293466dd02825f36e9328e5c2ecad4b0339c4ed837c716aac6785
data/Gemfile.lock CHANGED
@@ -1,7 +1,7 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- minimal-devices (0.5.8)
4
+ minimal-devices (0.5.8.1)
5
5
 
6
6
  GEM
7
7
  remote: https://rubygems.org/
data/css/imac.css CHANGED
@@ -92,8 +92,8 @@
92
92
  top: 0;
93
93
  right: 0;
94
94
  border-radius: 0 1.25em 0 0;
95
- background: -webkit-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
96
- background: -moz-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
97
- background: -o-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
98
- background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
95
+ background: -webkit-linear-gradient(42deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
96
+ background: -moz-linear-gradient(42deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
97
+ background: -o-linear-gradient(42deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
98
+ background: linear-gradient(48deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
99
99
  }
data/css/ipad.css CHANGED
@@ -65,16 +65,12 @@
65
65
  content: "";
66
66
  display: block;
67
67
  width: 50%;
68
- height: 80%;
68
+ height: 83%;
69
69
  position: absolute;
70
70
  top: 0.625em;
71
71
  right: 0.625em;
72
72
  border-radius: 0 3.125em 0 0;
73
- background: -webkit-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
74
- background: -moz-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
75
- background: -o-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
76
- background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
77
- z-index: 100;
73
+ z-index: 1;
78
74
  }
79
75
 
80
76
  .md-ipad {
@@ -93,6 +89,12 @@
93
89
  .md-ipad .md-home-button {
94
90
  bottom: -8.75em;
95
91
  }
92
+ .md-ipad.md-glare:before {
93
+ background: -webkit-linear-gradient(22deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
94
+ background: -moz-linear-gradient(22deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
95
+ background: -o-linear-gradient(22deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
96
+ background: linear-gradient(68deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
97
+ }
96
98
  .md-ipad.md-landscape {
97
99
  -webkit-transform: rotateZ(90deg);
98
100
  -moz-transform: rotateZ(90deg);
data/css/iphone.css CHANGED
@@ -65,16 +65,12 @@
65
65
  content: "";
66
66
  display: block;
67
67
  width: 50%;
68
- height: 80%;
68
+ height: 83%;
69
69
  position: absolute;
70
70
  top: 0.625em;
71
71
  right: 0.625em;
72
72
  border-radius: 0 3.125em 0 0;
73
- background: -webkit-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
74
- background: -moz-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
75
- background: -o-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
76
- background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
77
- z-index: 100;
73
+ z-index: 1;
78
74
  }
79
75
 
80
76
  .md-iphone-5:after {
@@ -145,6 +141,12 @@
145
141
  .md-iphone-5 .md-buttons:before {
146
142
  top: 6.25em;
147
143
  }
144
+ .md-iphone-5.md-glare:before {
145
+ background: -webkit-linear-gradient(16deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
146
+ background: -moz-linear-gradient(16deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
147
+ background: -o-linear-gradient(16deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
148
+ background: linear-gradient(74deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
149
+ }
148
150
  .md-iphone-5.md-landscape {
149
151
  -webkit-transform: rotateZ(90deg);
150
152
  -moz-transform: rotateZ(90deg);
data/css/macbook.css CHANGED
@@ -77,8 +77,8 @@
77
77
  top: 0;
78
78
  right: 0;
79
79
  border-radius: 0 1.25em 0 0;
80
- background: -webkit-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
81
- background: -moz-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
82
- background: -o-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
83
- background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
80
+ background: -webkit-linear-gradient(37deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
81
+ background: -moz-linear-gradient(37deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
82
+ background: -o-linear-gradient(37deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
83
+ background: linear-gradient(53deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
84
84
  }
Binary file
@@ -7,6 +7,6 @@ Compass::Frameworks.register('minimal-devices',
7
7
 
8
8
  module Minimal
9
9
  module Devices
10
- VERSION = "0.5.8"
10
+ VERSION = "0.5.8.1"
11
11
  end
12
12
  end
@@ -83,16 +83,16 @@
83
83
 
84
84
  &.md-glare {
85
85
  .md-top:after {
86
- content: "";
87
- display: block;
88
- width: 50%;
89
- height: 100%;
90
- position: absolute;
91
- top: 0;
92
- right: 0;
93
- border-radius: 0 pxtoem(20) 0 0;
94
- @include background(linear-gradient( bottom left, rgba(#fff, 0) 50%, rgba(#f7f8f0, 0.025) 50%, rgba(#faf5fc, 0.08) ));
95
- }
86
+ content: "";
87
+ display: block;
88
+ width: 50%;
89
+ height: 100%;
90
+ position: absolute;
91
+ top: 0;
92
+ right: 0;
93
+ border-radius: 0 pxtoem(20) 0 0;
94
+ @include background(linear-gradient(48deg, rgba(#fff, 0) 50%, rgba(#f7f8f0, 0.025) 50%, rgba(#faf5fc, 0.08) ));
95
+ }
96
96
  }
97
97
  }
98
98
 
@@ -30,7 +30,10 @@
30
30
  }
31
31
 
32
32
  &.md-glare {
33
- @extend %glare;
33
+ &:before {
34
+ @extend %glare;
35
+ @include background(linear-gradient(68deg, rgba(#fff, 0) 50%, rgba(#f7f8f0, 0.025) 50%, rgba(#faf5fc, 0.08)));
36
+ }
34
37
  }
35
38
 
36
39
  &.md-landscape {
@@ -79,7 +79,12 @@
79
79
 
80
80
 
81
81
  &.md-glare {
82
- @extend %glare;
82
+ &:before {
83
+ @extend %glare;
84
+ @include background(linear-gradient(74deg, rgba(#fff, 0) 50%, rgba(#f7f8f0, 0.025) 50%, rgba(#faf5fc, 0.08)));
85
+ }
86
+
87
+
83
88
  }
84
89
 
85
90
  &.md-landscape {
@@ -79,16 +79,16 @@
79
79
  }
80
80
 
81
81
  &.md-glare {
82
- .md-lid:after {
83
- content: "";
84
- display: block;
85
- width: 50%;
86
- height: 100%;
87
- position: absolute;
88
- top: 0;
89
- right: 0;
90
- border-radius: 0 pxtoem(20) 0 0;
91
- @include background(linear-gradient( bottom left, rgba(#fff, 0) 50%, rgba(#f7f8f0, 0.025) 50%, rgba(#faf5fc, 0.08) ));
92
- }
82
+ .md-lid:after {
83
+ content: "";
84
+ display: block;
85
+ width: 50%;
86
+ height: 100%;
87
+ position: absolute;
88
+ top: 0;
89
+ right: 0;
90
+ border-radius: 0 pxtoem(20) 0 0;
91
+ @include background(linear-gradient(53deg, rgba(#fff, 0) 50%, rgba(#f7f8f0, 0.025) 50%, rgba(#faf5fc, 0.08)));
92
+ }
93
93
  }
94
94
  }
@@ -71,19 +71,15 @@ $black-phone-base: #1b211e;
71
71
 
72
72
  // For glare
73
73
  %glare {
74
-
75
- &:before {
76
- content: "";
77
- display: block;
78
- width: 50%;
79
- height: 80%;
80
- position: absolute;
81
- top: pxtoem(10);
82
- right: pxtoem(10);
83
- border-radius: 0 pxtoem(50) 0 0;
84
- @include background(linear-gradient( bottom left, rgba(#fff, 0) 50%, rgba(#f7f8f0, 0.025) 50%, rgba(#faf5fc, 0.08) ));
85
- z-index: 100;
86
- }
74
+ content: "";
75
+ display: block;
76
+ width: 50%;
77
+ height: 83%;
78
+ position: absolute;
79
+ top: pxtoem(10);
80
+ right: pxtoem(10);
81
+ border-radius: 0 pxtoem(50) 0 0;
82
+ z-index: 1;
87
83
  }
88
84
 
89
85
  // On off toggle button
data/test.html CHANGED
@@ -12,6 +12,8 @@
12
12
  <style>
13
13
 
14
14
 
15
+ * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
16
+
15
17
  .md-iphone-5, .md-ipad, .md-macbook-pro, .md-imac {
16
18
  margin: 150px auto;
17
19
  }
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: minimal-devices
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.5.8
4
+ version: 0.5.8.1
5
5
  platform: ruby
6
6
  authors:
7
7
  - Jared Hardy
@@ -92,15 +92,6 @@ files:
92
92
  - dist/minimal-devices.zip
93
93
  - lib/minimal-devices.rb
94
94
  - minimal-devices.gemspec
95
- - pkg/minimal-devices-0.5.6.zip
96
- - pkg/minimal-devices-0.5.6/css/imac.css
97
- - pkg/minimal-devices-0.5.6/css/ipad.css
98
- - pkg/minimal-devices-0.5.6/css/iphone.css
99
- - pkg/minimal-devices-0.5.6/css/macbook.css
100
- - pkg/minimal-devices-0.5.6/templates/device_markup/imac.html
101
- - pkg/minimal-devices-0.5.6/templates/device_markup/ipad.html
102
- - pkg/minimal-devices-0.5.6/templates/device_markup/iphone.html
103
- - pkg/minimal-devices-0.5.6/templates/device_markup/macbook.html
104
95
  - stylesheets/_minimal-devices.scss
105
96
  - stylesheets/device/_color-variations.scss
106
97
  - stylesheets/device/_imac.scss
@@ -1,99 +0,0 @@
1
- .md-imac {
2
- width: 62.5em;
3
- height: 50em;
4
- }
5
- .md-imac .md-body {
6
- width: 100%;
7
- height: 43.125em;
8
- background: #c6c7ca;
9
- border-radius: 1.875em;
10
- overflow: hidden;
11
- }
12
- .md-imac .md-top {
13
- width: 100%;
14
- height: 37.1875em;
15
- background: #0f0f0f;
16
- border-radius: 1.875em 1.875em 0 0;
17
- position: relative;
18
- }
19
- .md-imac .md-screen {
20
- width: 57.5em;
21
- height: 32.375em;
22
- margin: 0 auto;
23
- position: relative;
24
- top: 2.375em;
25
- background: #17171a;
26
- }
27
- .md-imac .md-camera {
28
- width: 0.375em;
29
- height: 0.375em;
30
- margin: 0 auto;
31
- position: relative;
32
- top: 1.25em;
33
- background: #000;
34
- border-radius: 100%;
35
- box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.25);
36
- }
37
- .md-imac .md-camera:after {
38
- content: "";
39
- display: block;
40
- width: 0.125em;
41
- height: 0.125em;
42
- position: absolute;
43
- left: 0.125em;
44
- top: 0.0625em;
45
- background: #353542;
46
- border-radius: 100%;
47
- }
48
- .md-imac .md-base {
49
- width: 19.25em;
50
- height: 6.875em;
51
- margin: -0.5em auto;
52
- }
53
- .md-imac .md-stand {
54
- width: 13.125em;
55
- height: 6.125em;
56
- margin: 0 auto;
57
- background: #cccdcf;
58
- background: -webkit-linear-gradient(#b7b8bb, #cccdcf 50%, #d9dadb 80%, #cccdcf, #bfc0c3);
59
- background: -moz-linear-gradient(#b7b8bb, #cccdcf 50%, #d9dadb 80%, #cccdcf, #bfc0c3);
60
- background: -o-linear-gradient(#b7b8bb, #cccdcf 50%, #d9dadb 80%, #cccdcf, #bfc0c3);
61
- background: linear-gradient(#b7b8bb, #cccdcf 50%, #d9dadb 80%, #cccdcf, #bfc0c3);
62
- -webkit-transform: perspective(50em) rotate3d(1, 0, 0, 30deg);
63
- -moz-transform: perspective(50em) rotate3d(1, 0, 0, 30deg);
64
- -ms-transform: perspective(50em) rotate3d(1, 0, 0, 30deg);
65
- -o-transform: perspective(50em) rotate3d(1, 0, 0, 30deg);
66
- transform: perspective(50em) rotate3d(1, 0, 0, 30deg);
67
- }
68
- .md-imac .md-foot {
69
- width: 15em;
70
- height: 3.125em;
71
- margin: 0 auto;
72
- position: relative;
73
- bottom: 1.5em;
74
- border-radius: 0 0 0.625em 0.625em;
75
- background: -webkit-linear-gradient(#bfc0c3 20%, #cccdcf);
76
- background: -moz-linear-gradient(#bfc0c3 20%, #cccdcf);
77
- background: -o-linear-gradient(#bfc0c3 20%, #cccdcf);
78
- background: linear-gradient(#bfc0c3 20%, #cccdcf);
79
- -webkit-transform: perspective(11.875em) rotate3d(1, 0, 0, 70deg);
80
- -moz-transform: perspective(11.875em) rotate3d(1, 0, 0, 70deg);
81
- -ms-transform: perspective(11.875em) rotate3d(1, 0, 0, 70deg);
82
- -o-transform: perspective(11.875em) rotate3d(1, 0, 0, 70deg);
83
- transform: perspective(11.875em) rotate3d(1, 0, 0, 70deg);
84
- box-shadow: 0 0.375em 0 #bfc0c3;
85
- }
86
- .md-imac.md-glare .md-top:after {
87
- content: "";
88
- display: block;
89
- width: 50%;
90
- height: 100%;
91
- position: absolute;
92
- top: 0;
93
- right: 0;
94
- border-radius: 0 1.25em 0 0;
95
- background: -webkit-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
96
- background: -moz-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
97
- background: -o-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
98
- background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
99
- }
@@ -1,185 +0,0 @@
1
- .md-ipad .md-body {
2
- width: 100%;
3
- height: 100%;
4
- border-radius: 3.75em;
5
- border-style: solid;
6
- border-width: 0.375em;
7
- position: relative;
8
- }
9
-
10
- .md-ipad .md-screen {
11
- position: relative;
12
- margin: 0 auto;
13
- background-color: #161616;
14
- border-radius: 0.25em;
15
- overflow: hidden;
16
- box-shadow: 0 0 0px 3px #161616;
17
- }
18
- .md-ipad .md-screen img {
19
- width: 100%;
20
- }
21
-
22
- .md-ipad .md-home-button {
23
- display: block;
24
- width: 3.625em;
25
- height: 3.625em;
26
- margin: 0 auto;
27
- position: relative;
28
- border-radius: 100%;
29
- border: none;
30
- cursor: default;
31
- font-size: 100%;
32
- }
33
- .md-ipad .md-home-button:after {
34
- content: "";
35
- display: block;
36
- width: 1.125em;
37
- height: 1.125em;
38
- margin: 0 auto;
39
- position: relative;
40
- border-style: solid;
41
- border-width: 0.125em;
42
- border-radius: 0.25em;
43
- }
44
-
45
- .md-ipad .md-front-camera {
46
- width: 0.875em;
47
- height: 0.875em;
48
- margin: 0 auto;
49
- position: relative;
50
- border-radius: 100%;
51
- }
52
- .md-ipad .md-front-camera:after {
53
- content: "";
54
- display: block;
55
- width: 0.375em;
56
- height: 0.375em;
57
- position: relative;
58
- top: 0.25em;
59
- left: 0.25em;
60
- background-color: #8c8091;
61
- border-radius: 100%;
62
- }
63
-
64
- .md-ipad.md-glare:before {
65
- content: "";
66
- display: block;
67
- width: 50%;
68
- height: 80%;
69
- position: absolute;
70
- top: 0.75em;
71
- right: 0em;
72
- border-radius: 0 3.125em 0 0;
73
- background: -webkit-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
74
- background: -moz-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
75
- background: -o-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
76
- background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
77
- z-index: 100;
78
- }
79
-
80
- .md-ipad {
81
- width: 53.375em;
82
- height: 79.4375em;
83
- position: relative;
84
- }
85
- .md-ipad .md-front-camera {
86
- top: 3.125em;
87
- }
88
- .md-ipad .md-screen {
89
- width: 48em;
90
- height: 64em;
91
- top: 6.25em;
92
- }
93
- .md-ipad .md-home-button {
94
- bottom: -8.75em;
95
- }
96
- .md-ipad.md-landscape {
97
- -webkit-transform: rotateZ(90deg);
98
- -moz-transform: rotateZ(90deg);
99
- -ms-transform: rotateZ(90deg);
100
- -o-transform: rotateZ(90deg);
101
- transform: rotateZ(90deg);
102
- }
103
- .md-ipad.md-landscape.md-glare:before {
104
- -webkit-transform: rotateY(180deg);
105
- -moz-transform: rotateY(180deg);
106
- -ms-transform: rotateY(180deg);
107
- -o-transform: rotateY(180deg);
108
- transform: rotateY(180deg);
109
- left: 0.625em;
110
- top: 0.625em;
111
- }
112
-
113
- .md-white-device .md-front-camera, .md-white-device .md-top-speaker, .md-white-device .md-home-button {
114
- background: -webkit-linear-gradient(#d0d0c5, #eeeeea);
115
- background: -moz-linear-gradient(#d0d0c5, #eeeeea);
116
- background: -o-linear-gradient(#d0d0c5, #eeeeea);
117
- background: linear-gradient(#d0d0c5, #eeeeea);
118
- }
119
-
120
- .md-black-device .md-front-camera, .md-black-device .md-top-speaker, .md-black-device .md-home-button {
121
- background: -webkit-linear-gradient(#141917, #202623);
122
- background: -moz-linear-gradient(#141917, #202623);
123
- background: -o-linear-gradient(#141917, #202623);
124
- background: linear-gradient(#141917, #202623);
125
- }
126
-
127
- .md-white-device.md-landscape .md-home-button, .md-white-device.md-landscape .md-front-camera, .md-white-device.md-landscape .md-top-speaker {
128
- background: -webkit-linear-gradient(left, #d0d0c5, #eeeeea);
129
- background: -moz-linear-gradient(left, #d0d0c5, #eeeeea);
130
- background: -o-linear-gradient(left, #d0d0c5, #eeeeea);
131
- background: linear-gradient(to right, #d0d0c5, #eeeeea);
132
- }
133
-
134
- .md-black-device.md-landscape .md-home-button, .md-black-device.md-landscape .md-front-camera, .md-black-device.md-landscape .md-top-speaker {
135
- background: -webkit-linear-gradient(left, #141917, #202623);
136
- background: -moz-linear-gradient(left, #141917, #202623);
137
- background: -o-linear-gradient(left, #141917, #202623);
138
- background: linear-gradient(to right, #141917, #202623);
139
- }
140
-
141
- .md-white-device .md-body {
142
- background-color: #ebebe4;
143
- border-color: #f1f2eb;
144
- }
145
- .md-white-device .md-buttons {
146
- background-color: #ebebe4;
147
- }
148
- .md-white-device .md-buttons:after, .md-white-device .md-buttons:before {
149
- background-color: #ebebe4;
150
- }
151
- .md-white-device .md-front-camera:after {
152
- background-color: #8c8091;
153
- }
154
- .md-white-device .md-top-speaker:after {
155
- background-color: #4b414a;
156
- }
157
- .md-white-device .md-home-button:after {
158
- border-color: #eff1e6;
159
- }
160
- .md-white-device:after {
161
- background: #ebebe4;
162
- }
163
-
164
- .md-black-device .md-body {
165
- background-color: #1b211e;
166
- border-color: #282e2b;
167
- }
168
- .md-black-device .md-buttons {
169
- background-color: #1b211e;
170
- }
171
- .md-black-device .md-buttons:after, .md-black-device .md-buttons:before {
172
- background-color: #1b211e;
173
- }
174
- .md-black-device .md-front-camera:after {
175
- background-color: #2c292f;
176
- }
177
- .md-black-device .md-top-speaker:after {
178
- background-color: #191616;
179
- }
180
- .md-black-device .md-home-button:after {
181
- border-color: #444a45;
182
- }
183
- .md-black-device:after {
184
- background: #1b211e;
185
- }
@@ -1,237 +0,0 @@
1
- .md-iphone-5 .md-body {
2
- width: 100%;
3
- height: 100%;
4
- border-radius: 3.75em;
5
- border-style: solid;
6
- border-width: 0.375em;
7
- position: relative;
8
- }
9
-
10
- .md-iphone-5 .md-screen {
11
- position: relative;
12
- margin: 0 auto;
13
- background-color: #161616;
14
- border-radius: 0.25em;
15
- overflow: hidden;
16
- box-shadow: 0 0 0px 3px #161616;
17
- }
18
- .md-iphone-5 .md-screen img {
19
- width: 100%;
20
- }
21
-
22
- .md-iphone-5 .md-home-button {
23
- display: block;
24
- width: 3.625em;
25
- height: 3.625em;
26
- margin: 0 auto;
27
- position: relative;
28
- border-radius: 100%;
29
- border: none;
30
- cursor: default;
31
- font-size: 100%;
32
- }
33
- .md-iphone-5 .md-home-button:after {
34
- content: "";
35
- display: block;
36
- width: 1.125em;
37
- height: 1.125em;
38
- margin: 0 auto;
39
- position: relative;
40
- border-style: solid;
41
- border-width: 0.125em;
42
- border-radius: 0.25em;
43
- }
44
-
45
- .md-iphone-5 .md-front-camera {
46
- width: 0.875em;
47
- height: 0.875em;
48
- margin: 0 auto;
49
- position: relative;
50
- border-radius: 100%;
51
- }
52
- .md-iphone-5 .md-front-camera:after {
53
- content: "";
54
- display: block;
55
- width: 0.375em;
56
- height: 0.375em;
57
- position: relative;
58
- top: 0.25em;
59
- left: 0.25em;
60
- background-color: #8c8091;
61
- border-radius: 100%;
62
- }
63
-
64
- .md-iphone-5.md-glare:before {
65
- content: "";
66
- display: block;
67
- width: 50%;
68
- height: 80%;
69
- position: absolute;
70
- top: 0.75em;
71
- right: 0em;
72
- border-radius: 0 3.125em 0 0;
73
- background: -webkit-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
74
- background: -moz-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
75
- background: -o-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
76
- background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
77
- z-index: 100;
78
- }
79
-
80
- .md-iphone-5:after {
81
- content: "";
82
- display: block;
83
- width: 3.3125em;
84
- height: 0.1875em;
85
- position: absolute;
86
- right: 3.625em;
87
- top: -0.1875em;
88
- border-radius: 0.125em 0.125em 0 0;
89
- }
90
-
91
- .md-iphone-5 {
92
- width: 22.8125em;
93
- height: 49em;
94
- position: relative;
95
- }
96
- .md-iphone-5 .md-front-camera {
97
- top: 1.25em;
98
- }
99
- .md-iphone-5 .md-top-speaker {
100
- width: 3.75em;
101
- height: 0.875em;
102
- margin: 0 auto;
103
- position: relative;
104
- top: 2.25em;
105
- border-radius: 3.125em;
106
- }
107
- .md-iphone-5 .md-top-speaker:after {
108
- content: "";
109
- display: block;
110
- width: 3.25em;
111
- height: 0.375em;
112
- margin: 0 auto;
113
- position: relative;
114
- top: 0.25em;
115
- background-color: #4b414a;
116
- border-radius: 3.125em;
117
- }
118
- .md-iphone-5 .md-screen {
119
- width: 20em;
120
- height: 35.5em;
121
- top: 3.75em;
122
- }
123
- .md-iphone-5 .md-home-button {
124
- bottom: -5.9375em;
125
- }
126
- .md-iphone-5 .md-buttons {
127
- width: 0.1875em;
128
- height: 1.875em;
129
- position: absolute;
130
- left: -0.5em;
131
- top: 5.9375em;
132
- border-radius: 0.125em 0 0 0.125em;
133
- }
134
- .md-iphone-5 .md-buttons:after, .md-iphone-5 .md-buttons:before {
135
- content: "";
136
- display: block;
137
- position: absolute;
138
- width: 0.1875em;
139
- height: 1.5625em;
140
- border-radius: 0.125em 0 0 0.125em;
141
- }
142
- .md-iphone-5 .md-buttons:after {
143
- top: 3.125em;
144
- }
145
- .md-iphone-5 .md-buttons:before {
146
- top: 6.25em;
147
- }
148
- .md-iphone-5.md-landscape {
149
- -webkit-transform: rotateZ(90deg);
150
- -moz-transform: rotateZ(90deg);
151
- -ms-transform: rotateZ(90deg);
152
- -o-transform: rotateZ(90deg);
153
- transform: rotateZ(90deg);
154
- }
155
- .md-iphone-5.md-landscape.md-glare:before {
156
- -webkit-transform: rotateY(180deg);
157
- -moz-transform: rotateY(180deg);
158
- -ms-transform: rotateY(180deg);
159
- -o-transform: rotateY(180deg);
160
- transform: rotateY(180deg);
161
- left: 0.625em;
162
- top: 0.625em;
163
- }
164
-
165
- .md-white-device .md-front-camera, .md-white-device .md-top-speaker, .md-white-device .md-home-button {
166
- background: -webkit-linear-gradient(#d0d0c5, #eeeeea);
167
- background: -moz-linear-gradient(#d0d0c5, #eeeeea);
168
- background: -o-linear-gradient(#d0d0c5, #eeeeea);
169
- background: linear-gradient(#d0d0c5, #eeeeea);
170
- }
171
-
172
- .md-black-device .md-front-camera, .md-black-device .md-top-speaker, .md-black-device .md-home-button {
173
- background: -webkit-linear-gradient(#141917, #202623);
174
- background: -moz-linear-gradient(#141917, #202623);
175
- background: -o-linear-gradient(#141917, #202623);
176
- background: linear-gradient(#141917, #202623);
177
- }
178
-
179
- .md-white-device.md-landscape .md-home-button, .md-white-device.md-landscape .md-front-camera, .md-white-device.md-landscape .md-top-speaker {
180
- background: -webkit-linear-gradient(left, #d0d0c5, #eeeeea);
181
- background: -moz-linear-gradient(left, #d0d0c5, #eeeeea);
182
- background: -o-linear-gradient(left, #d0d0c5, #eeeeea);
183
- background: linear-gradient(to right, #d0d0c5, #eeeeea);
184
- }
185
-
186
- .md-black-device.md-landscape .md-home-button, .md-black-device.md-landscape .md-front-camera, .md-black-device.md-landscape .md-top-speaker {
187
- background: -webkit-linear-gradient(left, #141917, #202623);
188
- background: -moz-linear-gradient(left, #141917, #202623);
189
- background: -o-linear-gradient(left, #141917, #202623);
190
- background: linear-gradient(to right, #141917, #202623);
191
- }
192
-
193
- .md-white-device .md-body {
194
- background-color: #ebebe4;
195
- border-color: #f1f2eb;
196
- }
197
- .md-white-device .md-buttons {
198
- background-color: #ebebe4;
199
- }
200
- .md-white-device .md-buttons:after, .md-white-device .md-buttons:before {
201
- background-color: #ebebe4;
202
- }
203
- .md-white-device .md-front-camera:after {
204
- background-color: #8c8091;
205
- }
206
- .md-white-device .md-top-speaker:after {
207
- background-color: #4b414a;
208
- }
209
- .md-white-device .md-home-button:after {
210
- border-color: #eff1e6;
211
- }
212
- .md-white-device:after {
213
- background: #ebebe4;
214
- }
215
-
216
- .md-black-device .md-body {
217
- background-color: #1b211e;
218
- border-color: #282e2b;
219
- }
220
- .md-black-device .md-buttons {
221
- background-color: #1b211e;
222
- }
223
- .md-black-device .md-buttons:after, .md-black-device .md-buttons:before {
224
- background-color: #1b211e;
225
- }
226
- .md-black-device .md-front-camera:after {
227
- background-color: #2c292f;
228
- }
229
- .md-black-device .md-top-speaker:after {
230
- background-color: #191616;
231
- }
232
- .md-black-device .md-home-button:after {
233
- border-color: #444a45;
234
- }
235
- .md-black-device:after {
236
- background: #1b211e;
237
- }
@@ -1,84 +0,0 @@
1
- .md-macbook-pro {
2
- width: 55.3125em;
3
- height: 31.875em;
4
- }
5
- .md-macbook-pro .md-lid {
6
- width: 45em;
7
- height: 30.625em;
8
- margin: 0 auto;
9
- position: relative;
10
- border-radius: 1.875em;
11
- border: solid 0.1875em #cdced1;
12
- background: #131313;
13
- }
14
- .md-macbook-pro .md-camera {
15
- width: 0.375em;
16
- height: 0.375em;
17
- margin: 0 auto;
18
- position: relative;
19
- top: 1.0625em;
20
- background: #000;
21
- border-radius: 100%;
22
- box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.25);
23
- }
24
- .md-macbook-pro .md-camera:after {
25
- content: "";
26
- display: block;
27
- width: 0.125em;
28
- height: 0.125em;
29
- position: absolute;
30
- left: 0.125em;
31
- top: 0.0625em;
32
- background: #353542;
33
- border-radius: 100%;
34
- }
35
- .md-macbook-pro .md-screen {
36
- width: 42.25em;
37
- height: 26.375em;
38
- margin: 0 auto;
39
- position: relative;
40
- top: 2.0625em;
41
- background: #1d1d1d;
42
- }
43
- .md-macbook-pro .md-base {
44
- width: 100%;
45
- height: 0.9375em;
46
- position: relative;
47
- top: -0.75em;
48
- background: #c6c7ca;
49
- }
50
- .md-macbook-pro .md-base:after {
51
- content: "";
52
- display: block;
53
- width: 100%;
54
- height: 0.5em;
55
- margin: 0 auto;
56
- position: relative;
57
- bottom: -0.1875em;
58
- background: #b9babe;
59
- border-radius: 0 0 1.25em 1.25em;
60
- }
61
- .md-macbook-pro .md-base:before {
62
- content: "";
63
- display: block;
64
- width: 7.6875em;
65
- height: 0.625em;
66
- margin: 0 auto;
67
- position: relative;
68
- background: #a6a8ad;
69
- border-radius: 0 0 0.625em 0.625em;
70
- }
71
- .md-macbook-pro.md-glare .md-lid:after {
72
- content: "";
73
- display: block;
74
- width: 50%;
75
- height: 100%;
76
- position: absolute;
77
- top: 0;
78
- right: 0;
79
- border-radius: 0 1.25em 0 0;
80
- background: -webkit-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
81
- background: -moz-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
82
- background: -o-linear-gradient(bottom left, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
83
- background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
84
- }
@@ -1,13 +0,0 @@
1
- <div class="md-imac md-glare">
2
- <div class="md-body">
3
- <div class="md-top">
4
- <div class="md-camera"></div>
5
- <div class="md-screen"></div>
6
- </div>
7
- </div>
8
-
9
- <div class="md-base">
10
- <div class="md-stand"></div>
11
- <div class="md-foot"></div>
12
- </div>
13
- </div>
@@ -1,18 +0,0 @@
1
- <div class="md-ipad md-white-device md-glare">
2
- <div class="md-body">
3
- <div class="md-front-camera"></div>
4
- <div class="md-screen"></div>
5
-
6
- <button class="md-home-button"></button>
7
- </div>
8
- </div>
9
-
10
-
11
- <div class="md-ipad md-black-device md-glare">
12
- <div class="md-body">
13
- <div class="md-front-camera"></div>
14
- <div class="md-screen"></div>
15
-
16
- <button class="md-home-button"></button>
17
- </div>
18
- </div>
@@ -1,24 +0,0 @@
1
- <div class="md-iphone-5 md-white-device md-glare">
2
- <div class="md-body">
3
- <div class="md-buttons"></div>
4
-
5
- <div class="md-front-camera"></div>
6
- <div class="md-top-speaker"></div>
7
- <div class="md-screen"></div>
8
-
9
- <button class="md-home-button"></button>
10
- </div>
11
- </div>
12
-
13
- <div class="md-iphone-5 md-black-device md-glare">
14
- <div class="md-body">
15
-
16
- <div class="md-buttons"></div>
17
-
18
- <div class="md-front-camera"></div>
19
- <div class="md-top-speaker"></div>
20
- <div class="md-screen"></div>
21
-
22
- <button class="md-home-button"></button>
23
- </div>
24
- </div>
@@ -1,13 +0,0 @@
1
- <div class="md-imac md-glare">
2
- <div class="md-body">
3
- <div class="md-top">
4
- <div class="md-camera"></div>
5
- <div class="md-screen"></div>
6
- </div>
7
- </div>
8
-
9
- <div class="md-base">
10
- <div class="md-stand"></div>
11
- <div class="md-foot"></div>
12
- </div>
13
- </div>
Binary file