Updated Branches: refs/heads/master ed8bdea4b -> de4f3c0f2
[app] Switched to using absolute positioning for centring the logo + text 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/de4f3c0f Tree: http://git-wip-us.apache.org/repos/asf/incubator-cordova-app-hello-world/tree/de4f3c0f Diff: http://git-wip-us.apache.org/repos/asf/incubator-cordova-app-hello-world/diff/de4f3c0f Branch: refs/heads/master Commit: de4f3c0f26bb51f5ee5c8809e50af62e39a33918 Parents: ed8bdea Author: Yohei Shimomae <yohei.shimo...@gmail.com> Authored: Thu Aug 9 16:22:37 2012 -0700 Committer: Yohei Shimomae <yohei.shimo...@gmail.com> Committed: Thu Aug 9 16:22:37 2012 -0700 ---------------------------------------------------------------------- www/css/index.css | 22 ++++++++-------------- 1 files changed, 8 insertions(+), 14 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-cordova-app-hello-world/blob/de4f3c0f/www/css/index.css ---------------------------------------------------------------------- diff --git a/www/css/index.css b/www/css/index.css index 0edd132..2fcce99 100644 --- a/www/css/index.css +++ b/www/css/index.css @@ -23,12 +23,8 @@ body { width:100%; } -html { - display:table; -} - body { - background-color:#A7A7A7; + background-color:#E4E4E4; background-image:linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%); background-image:-webkit-linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%); background-image:-ms-linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%); @@ -39,19 +35,13 @@ body { color-stop(0, #A7A7A7), color-stop(0.51, #E4E4E4) ); + background-attachment:fixed; display:table-cell; font-family:'HelveticaNeue-Light', 'HelveticaNeue', Helvetica, Arial, sans-serif; text-transform:uppercase; vertical-align:middle; } -.app { - background-image:url(../img/cordova.png); - background-repeat:no-repeat; - margin:0px auto; - width:275px; -} - h1 { font-size:2em; font-weight:300; @@ -99,9 +89,12 @@ h1 { -webkit-animation:fade 3000ms infinite; } -/* portrait */ -/* @media screen and (max-aspect-ratio: 1/1) */ .app { + background:url(../img/cordova.png) no-repeat; + position: absolute; + left: 50%; /* center container text */ + top: 50%; + margin: -120px 0 0 -110px; /* shifts container to top left by half its width and height */ background-position:center top; height:100px; /* adds enough room for text */ padding:180px 0px 0px 0px; /* background height - shadow offset */ @@ -114,5 +107,6 @@ h1 { height:140px; /* height + padding = background image size */ padding-left:170px; /* background width */ padding-top:60px; /* center the text */ + margin: -90px 0 0 -200px; /* shifts container to top left by half its width and height */ } }
