1.1 --- a/tizenporta/index.html Wed May 02 20:50:26 2012 +0200
1.2 +++ b/tizenporta/index.html Sat May 05 16:08:17 2012 +0200
1.3 @@ -68,11 +68,11 @@
1.4 min-height: 740px;
1.5
1.6 background: rgb(215, 215, 215);
1.7 - background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 500, from(rgb(250, 250, 250)), to(rgb(160, 160, 160)));
1.8 - background: -webkit-radial-gradient(rgb(250, 250, 250), rgb(160, 160, 160));
1.9 - background: -moz-radial-gradient(rgb(250, 250, 250), rgb(160, 160, 160));
1.10 - background: -o-radial-gradient(rgb(250, 250, 250), rgb(160, 160, 160));
1.11 - background: radial-gradient(rgb(250, 250, 250), rgb(160, 160, 160));
1.12 + background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 500, from(rgb(255, 255, 255)), to(rgb(160, 140, 80)));
1.13 + background: -webkit-radial-gradient(rgb(255, 255, 255), rgb(160, 140, 80));
1.14 + background: -moz-radial-gradient(rgb(255, 255, 255), rgb(160, 140, 80));
1.15 + background: -o-radial-gradient(rgb(255, 255, 255), rgb(160, 140, 80));
1.16 + background: radial-gradient(rgb(255, 255, 255), rgb(160, 140, 80));
1.17
1.18 -webkit-font-smoothing: antialiased;
1.19 }
1.20 @@ -248,6 +248,15 @@
1.21 padding-left: 96px;
1.22 }
1.23
1.24 +#contents a {
1.25 + color: inherit;
1.26 + text-decoration: none;
1.27 + padding: 0 0.1em;
1.28 + border-radius: 0.2em;
1.29 + background: rgba(220,220,220,0.5);
1.30 + text-shadow: 0 0 0;
1.31 + }
1.32 +
1.33 #topcat .smalltext, #tophybrid .smalltext {
1.34 font-size: 80px;
1.35 position: absolute;
1.36 @@ -274,6 +283,18 @@
1.37 transform: translateZ(50px);
1.38 }
1.39
1.40 +#tophybrid .extratext {
1.41 + width: 200px;
1.42 + padding-right: 0;
1.43 + color: #808080;
1.44 + font-size: 72px;
1.45 + position: absolute;
1.46 + top: 1.5em;
1.47 + left: 9.5em;
1.48 + text-align: right;
1.49 + line-height: 60px;
1.50 + }
1.51 +
1.52 #tophybrid h1 {
1.53 font-size: 180px;
1.54 line-height: 200px;
1.55 @@ -400,6 +421,33 @@
1.56 opacity: 1;
1.57 }
1.58
1.59 +#specases .smalltext {
1.60 + font-size: 92px;
1.61 + line-height: 116px;
1.62 + position: absolute;
1.63 + top: 1.25em;
1.64 + left: 2.5em;
1.65 +
1.66 + -webkit-transform: translateZ(20px);
1.67 + -moz-transform: translateZ(20px);
1.68 + -ms-transform: translateZ(20px);
1.69 + -o-transform: translateZ(20px);
1.70 + transform: translateZ(20px);
1.71 + }
1.72 +
1.73 +#specases h1 {
1.74 + font-size: 160px;
1.75 + position: relative;
1.76 + top: -.8em;
1.77 + text-align: center;
1.78 +
1.79 + -webkit-transform: translateZ(50px);
1.80 + -moz-transform: translateZ(50px);
1.81 + -ms-transform: translateZ(50px);
1.82 + -o-transform: translateZ(50px);
1.83 + transform: translateZ(50px);
1.84 + }
1.85 +
1.86 #topchoose1 .smalltext {
1.87 font-size: 130px;
1.88 position: absolute;
1.89 @@ -488,8 +536,9 @@
1.90
1.91 #resources {
1.92 background-image: url('meegarbeit.svg');
1.93 - background-position: 90% 80%;
1.94 + background-position: 90% 70%;
1.95 background-repeat: no-repeat;
1.96 + color: #202020;
1.97 }
1.98
1.99 #resources h1 {
1.100 @@ -502,24 +551,27 @@
1.101
1.102 #resources ul {
1.103 font-size: 36px;
1.104 - line-height: 52px;
1.105 + line-height: 44px;
1.106 padding-left: 64px;
1.107 }
1.108
1.109 -#resources .ecrivain {
1.110 +#resources .buchtit {
1.111 text-decoration: underline;
1.112 }
1.113
1.114 #conclusion {
1.115 - background-image: url('qrtizportdev.png');
1.116 - background-size: 300px 300px;
1.117 - background-position: 10% 95%;
1.118 + background-size: 100% 100%;
1.119 + background-image: url(schlusshintergrund.png);
1.120 background-repeat: no-repeat;
1.121 + background-attachment: fixed;
1.122 + background-position: top;
1.123 +
1.124 + color: white;
1.125 + text-shadow: 8px 6px 12px black;
1.126 }
1.127
1.128 #conclusion h1 {
1.129 padding-top: 64px;
1.130 - text-align: center;
1.131 padding-bottom: 96px;
1.132 font-size: 200px;
1.133 font-weight: bold;
1.134 @@ -527,10 +579,18 @@
1.135 }
1.136
1.137 #conclusion h2 {
1.138 - text-align: center;
1.139 - font-size: 72px;
1.140 + display: inline;
1.141 + width: 600px;
1.142 + padding-left: 64px;
1.143 + font-size: 96px;
1.144 font-weight: bold;
1.145 font-family: 'Open Sans', Arial, sans-serif;
1.146 + line-height: 108px;
1.147 + }
1.148 +
1.149 +#conclusion img {
1.150 + display: inline;
1.151 + padding-left: 48px;
1.152 }
1.153
1.154 /* overview step */
1.155 @@ -1023,12 +1083,12 @@
1.156 <div id="contents" class="step slide" data-x="1300" data-y="-1920">
1.157 <h1>Contents</h1>
1.158 <ul>
1.159 - <li>Mobile App <b>Categories</b></li>
1.160 - <li><b>Web</b> App Frameworks</li>
1.161 - <li><b>Native</b> App Frameworks</li>
1.162 - <li><b>Hybrid</b> App Frameworks</li>
1.163 - <li>Tizen SDK <b>Provision</b></li>
1.164 - <li>Tizen SDK <b>Integration</b></li>
1.165 + <li><a href="index.html#/topcat">Mobile App <b>Categories</b></a></li>
1.166 + <li><a href="index.html#/topnative"><b>Native</b> App Frameworks</a></li>
1.167 + <li><a href="index.html#/topweb"><b>Web</b> App Frameworks</a></li>
1.168 + <li><a href="index.html#/tophybrid"><b>Hybrid</b> App Frameworks</a></li>
1.169 + <li><a href="index.html#/sdkprovide">Tizen SDK <b>Provision</b></a></li>
1.170 + <li><a href="index.html#/sdkinteg">Tizen SDK <b>Integration</b></a></li>
1.171 <!--<li>Web App Frameworks</li>
1.172 <li>Hybrid Frameworks</li>
1.173 <li>License Compatibility </li>
1.174 @@ -1044,11 +1104,11 @@
1.175 <h1>Categories</h1>
1.176 </div>
1.177
1.178 - <div id="svgrich1" class="step" data-x="1050" data-y="-240" data-z="-1000" data-scale="0.1">
1.179 + <div id="svgrich1" class="step" data-x="1052" data-y="-240" data-z="-1000" data-scale="0.125">
1.180 <img src="richreach.svg" width="100%" />
1.181 </div>
1.182
1.183 - <div id="topnative" class="step" data-x="200" data-y="-560" data-z="-1000" data-scale="0.3">
1.184 + <div id="topnative" class="step" data-x="200" data-y="-570" data-z="-1000" data-scale="0.3">
1.185 <span class="smalltext">Development</span>
1.186 <h1>Native App</h1>
1.187 </div>
1.188 @@ -1099,24 +1159,29 @@
1.189 </ul>
1.190 </div>
1.191
1.192 - <div id="topchoose1" class="step" data-x="-2755" data-y="-3850" data-z="-1000" data-rotate="180" data-scale="2">
1.193 + <div id="specases" class="step" data-x="-2755" data-y="-3700" data-z="-1000" data-rotate="180" data-scale=".5">
1.194 + <span class="smalltext">HTML5Boilerplate Modernizr</span>
1.195 + <h1>Special Cases</h1>
1.196 + </div>
1.197 +
1.198 + <div id="topchoose1" class="step" data-x="-2755" data-y="-4550" data-z="-1000" data-rotate="180" data-scale="2">
1.199 <span class="smalltext">a framework</span>
1.200 <h1>Choosing</h1>
1.201 </div>
1.202
1.203 - <div id="svgappflow" class="step" data-x="-2740" data-y="-3800" data-z="-1000" data-rotate="180" data-scale="0.1">
1.204 + <div id="svgappflow" class="step" data-x="-2740" data-y="-4500" data-z="-1000" data-rotate="180" data-scale="0.1">
1.205 <img src="newappflow.svg" width="100%" />
1.206 </div>
1.207
1.208 - <div id="topchoose2" class="step" data-x="-2755" data-y="-4050" data-z="-1000" data-rotate="180" data-scale="2">
1.209 + <div id="topchoose2" class="step" data-x="-2755" data-y="-4850" data-z="-1000" data-rotate="180" data-scale="2">
1.210 <a target="_blank" href="http://www.markus-falk.com/mobile-frameworks-comparison-chart/">with Markus FALK's chart</a>
1.211 </div>
1.212
1.213 - <div id="topwhy" class="step" data-x="-2755" data-y="-5450" data-z="-1000" data-rotate="180" data-scale="2">
1.214 + <div id="topwhy" class="step" data-x="-2755" data-y="-6250" data-z="-1000" data-rotate="180" data-scale="2">
1.215 <h1>Why a Web Framework?</h1>
1.216 </div>
1.217
1.218 - <div id="rasterwhy" class="step" data-x="-2755" data-y="-5450" data-z="-500" data-rotate="180" data-scale="2">
1.219 + <div id="rasterwhy" class="step" data-x="-2755" data-y="-6250" data-z="-500" data-rotate="180" data-scale="2">
1.220 <blockquote>“2012 will come to be known as the year of the web
1.221 runtimes. Officially there is no native development. Tizen
1.222 is an html5 affair only.”
1.223 @@ -1125,6 +1190,7 @@
1.224
1.225 <div id="tophybrid" class="step" data-x="1000" data-y="-5000" data-z="0" data-rotate="360" data-scale="4">
1.226 <span class="smalltext">Leveraging</span>
1.227 + <span class="extratext">Rhomobile Titanium Cordova</span>
1.228 <h1>Hybrid Frameworks</h1>
1.229 </div>
1.230
1.231 @@ -1155,19 +1221,22 @@
1.232 <div id="resources" class="step slide" data-x="0" data-y="-2600" data-rotate="0">
1.233 <h1>Resources</h1>
1.234 <ul>
1.235 - <li>jQuery Mobile: Up and Running, <span class="ecrivain">Maximiliano FIRTMAN</span>
1.236 - <li>Beginning Phonegap, <span class="ecrivain">Thomas MYER</span>
1.237 + <li><span class="buchtit">jQuery Mobile: Up and Running</span>, Maximiliano FIRTMAN</li>
1.238 + <li><span class="buchtit">Mobile Design Pattern Gallery</span>, Theresa NEIL</li>
1.239 + <li><span class="buchtit">Beginning Phonegap</span>, Thomas MYER</li>
1.240 <li><a href="http://docs.phonegap.com/">http://docs.phonegap.com/</a></li>
1.241 <li><a href="http://www.modernizr.com/">http://www.modernizr.com/</a></li>
1.242 <li><a href="http://www.dojotoolkit.org/">http://www.dojotoolkit.org/</a></li>
1.243 <li><a href="http://www.jquerymobile.com/">http://www.jquerymobile.com/</a></li>
1.244 <li><a href="http://www.sencha.com/products/touch/">http://www.sencha.com/products/touch/</a></li>
1.245 + <li><a href="http://ftp.europalab.com/pub/doc/lect/tizenportdev/">http://ftp.europalab.com/pub/doc/lect/tizenportdev/</a></li>
1.246 </ul>
1.247 </div>
1.248
1.249 <div id="conclusion" class="step slide" data-x="-1300" data-y="-2600" data-rotate="0">
1.250 - <h1>Thank You</h1>
1.251 - <h2>Tizen Application Portability</h2>
1.252 + <h1>Thank You!</h1>
1.253 + <img src="qrtizportdev.png" width="300px" />
1.254 + <h2><span style="color: aqua;">Tizen</span> <span style="color: orange;">Application</span> <span style="color: green;">Portability</span></h2>
1.255 </div>
1.256
1.257 <div id="overview" class="step" data-x="2500" data-y="-4200" data-scale="12">
