Avoid modifying stylesheets when updating @medias.
[cydget.git] / Welcome.cydget / Welcome.html
1 <html><head>
2 <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
3 <style>
4 bob { color: red; }
5 </style>
6
7 <style>
8 * {
9 border: 0;
10 -moz-border-radius: 0;
11 -webkit-border-radius: 0;
12 box-sizing: border-box;
13 -moz-box-sizing: border-box;
14 -ms-box-sizing: border-box;
15 -webkit-box-sizing: border-box;
16 /*font-family: inherit;*/
17 font-size: 100%;
18 font-style: inherit;
19 font-weight: inherit;
20 margin: 0;
21 outline: 0;
22 padding: 0;
23 text-decoration: none;
24 vertical-align: baseline;
25 }
26
27 * {
28 -webkit-touch-callout: none;
29 -webkit-text-size-adjust: none;
30 -webkit-user-select: none;
31 }
32
33 body {
34 color: white;
35 background: none;
36 }
37
38 #lcd {
39 width: 100%;
40 }
41
42 #lcd h1 {
43 font-family: "LockClock-Light";
44 padding: 0px 0px 0px 1px;
45 position: relative;
46 text-align: center;
47 text-shadow: -0.5px -1px 1px black;
48 }
49
50 #lcd h2 {
51 font-family: "Helvetica";
52 position: relative;
53 text-align: center;
54 text-shadow: -0.5px -1px 1px black;
55 }
56
57 @media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
58 #lcd {
59 height: 96px;
60 }
61
62 #lcd h1 {
63 font-size: 65px;
64 top: -6px;
65 }
66
67 #lcd h2 {
68 font-size: 17px;
69 top: -16px;
70 }
71 }
72
73 @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
74 #lcd {
75 background: url(file:///System/Library/PrivateFrameworks/TelephonyUI.framework/BarLCD.png);
76 height: 96px;
77 }
78
79 #lcd h1 {
80 font-size: 69px;
81 top: -8px;
82 }
83
84 #lcd h2 {
85 font-size: 16px;
86 top: -18px;
87 }
88 }
89
90 @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
91 #lcd {
92 background: url(file:///System/Library/PrivateFrameworks/TelephonyUI.framework/BarLCD_T.png);
93 height: 107px;
94 }
95
96 #lcd h1 {
97 font-size: 69px;
98 top: -1px;
99 }
100
101 #lcd h2 {
102 font-size: 16px;
103 top: -8px;
104 }
105 }
106
107 #content {
108 font-family: "Helvetica";
109 }
110
111 #content h3 {
112 font-size: 20px;
113 text-align: center;
114 margin-bottom: 10px;
115 }
116
117 #content p {
118 font-size: 14px;
119 text-align: justify;
120 margin: 10px 12px;
121 }
122
123 sup {
124 font-size: smaller;
125 position: relative;
126 top: -5px;
127 }
128
129 @media (-cydget-media-controls) {
130 #lcd {
131 opacity: 0;
132 }
133 }
134
135 @media (-cydget-notification-list) {
136 #content {
137 opacity: 0;
138 }
139 }
140 </style></head><body>
141 <script type="text/javascript">
142 if (kCFCoreFoundationVersionNumber > 800)
143 document.write('<div style="height: 60px"></div>');
144 else
145 document.write('<style type="text/css"> #lcd { background: url(cydget://_UIImageWithName/UILCDBackground.png); } </style>');
146 </script>
147 <div id="lcd">
148 <script type="text/javascript">
149 document.write('<h1 id="time">');
150
151 var time;
152 if (typeof Cycript != 'undefined')
153 time = '&nbsp;';
154 else {
155 var now = new Date();
156 var minutes = String(now.getMinutes());
157 if (minutes.length == 1)
158 minutes = '0' + minutes
159 time = now.getHours() + ':' + minutes;
160 }
161
162 document.write(time);
163 document.write('</h1>');
164 </script>
165
166 <h2>Welcome to Cydget!</h2>
167 </div>
168
169 <div id="content">
170 <p>Cydget<sup>tm</sup> is a very simple SBAwayViewPlugin multiplexer, allowing both developers and web designers to extend the capabilities of the lock screen by tapping into the existing mechanism Apple had designed for VoiceRecorder and Nike+. The WebCycript Cydget framework is designed to be a powerful replacement for the Lock Widget feature from WinterBoard, which it hereby supersedes.</p>
171 <p>You can switch between Cydgets (your original SpringBoard away view is next in the rotation) using the Home/Menu button, and you can re-order them using Settings under "Cydget".</p>
172 </div>
173
174 <!-- XXX: extract this out to some kind of nifty Lock Cydget library -->
175 <script type="text/cycript">
176 var locale = CFLocaleCopyCurrent();
177 var now = CFDateCreate(NULL, CFAbsoluteTimeGetCurrent());
178 var formatter = CFDateFormatterCreate(NULL, locale, kCFDateFormatterNoStyle, kCFDateFormatterNoStyle);
179 CFRelease(locale);
180
181 CFDateFormatterSetFormat(formatter, UIDateFormatStringForFormatType(UINoAMPMTimeFormat));
182 var time = CFDateFormatterCreateStringWithDate(NULL, formatter, now);
183 document.getElementById("time").innerHTML = time;
184 CFRelease(time);
185
186 CFRelease(formatter);
187 CFRelease(now);
188 </script>
189 </body></html>