You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cordova.apache.org by mw...@apache.org on 2012/08/01 18:39:08 UTC
[22/48] git commit: [app] Simply the markup and css.
[app] Simply the markup and css.
Project: http://git-wip-us.apache.org/repos/asf/incubator-cordova-app-hello-world/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-cordova-app-hello-world/commit/98613df6
Tree: http://git-wip-us.apache.org/repos/asf/incubator-cordova-app-hello-world/tree/98613df6
Diff: http://git-wip-us.apache.org/repos/asf/incubator-cordova-app-hello-world/diff/98613df6
Branch: refs/heads/master
Commit: 98613df6bbf59361b297517b8bdc43e41026e124
Parents: c7e0c89
Author: Michael Brooks <mi...@michaelbrooks.ca>
Authored: Mon Jul 16 21:32:03 2012 -0700
Committer: Michael Brooks <mi...@michaelbrooks.ca>
Committed: Mon Jul 16 21:32:03 2012 -0700
----------------------------------------------------------------------
www/css/index.css | 56 ++++++++++++++++++++++++++++-----------
www/img/cordova-small.png | Bin 0 -> 26318 bytes
www/index.html | 1 -
3 files changed, 40 insertions(+), 17 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/incubator-cordova-app-hello-world/blob/98613df6/www/css/index.css
----------------------------------------------------------------------
diff --git a/www/css/index.css b/www/css/index.css
index f255a2f..c18533d 100644
--- a/www/css/index.css
+++ b/www/css/index.css
@@ -1,7 +1,7 @@
html,
body {
height:100%;
- font-size:16px;
+ font-size:12px;
width:100%;
}
@@ -27,19 +27,13 @@ body {
}
h1 {
+ background-image:url(../img/cordova-small.png);
+ background-repeat:no-repeat;
font-size:2em;
font-weight:300;
margin:0px;
+ overflow:visible;
padding:0px;
- text-align:center;
-}
-
-img {
- display:block;
- margin:0px auto;
- margin-bottom:-20px;
- width:400px;
- max-width:100%;
}
.status {
@@ -47,14 +41,12 @@ img {
border-radius:4px;
-webkit-border-radius:4px;
color:#FFFFFF;
- display:block;
font-size:1em;
- margin:5px auto;
- margin-top:10px;
- padding:2px 4px;
+ margin:0px auto;
+ padding:2px 10px;
text-align:center;
- width:225px;
- max-width:225px;
+ width:100%;
+ max-width:175px;
}
.status.complete {
@@ -74,3 +66,35 @@ img {
.blink {
-webkit-animation:fade 3000ms infinite;
}
+
+/* portrait */
+@media screen and (max-aspect-ratio: 1/1) {
+ h1 {
+ background-position:center top;
+ padding:225px 0px 0px 0px;
+ text-align:center;
+ }
+}
+
+/* lanscape */
+@media screen and (min-aspect-ratio: 1/1) {
+ h1,
+ div {
+ padding-left:220px;
+ }
+
+ h1 {
+ background-position:left center;
+ margin-bottom:-100px;
+ margin-top:-100px;
+ padding-top:100px;
+ padding-bottom:100px;
+ text-align:left;
+ }
+
+ .status {
+ margin-left:0px;
+ margin-right:0px;
+ }
+}
+
http://git-wip-us.apache.org/repos/asf/incubator-cordova-app-hello-world/blob/98613df6/www/img/cordova-small.png
----------------------------------------------------------------------
diff --git a/www/img/cordova-small.png b/www/img/cordova-small.png
new file mode 100644
index 0000000..a7240b5
Binary files /dev/null and b/www/img/cordova-small.png differ
http://git-wip-us.apache.org/repos/asf/incubator-cordova-app-hello-world/blob/98613df6/www/index.html
----------------------------------------------------------------------
diff --git a/www/index.html b/www/index.html
index 34b3806..ea56d76 100644
--- a/www/index.html
+++ b/www/index.html
@@ -8,7 +8,6 @@
<title>Hello Cordova</title>
</head>
<body>
- <img src="img/cordova.png" />
<h1>Apache Cordova™</h1>
<div id="deviceready">
<p class="status pending blink">Connecting to Device</p>