← Back to team overview

dhis2-devs team mailing list archive

[Branch ~dhis2-devs-core/dhis2/trunk] Rev 4655: made mobile login page match mobile interface, also added image logo to mobile pages

 

------------------------------------------------------------
revno: 4655
committer: Morten Olav Hansen <mortenoh@xxxxxxxxx>
branch nick: dhis2
timestamp: Fri 2011-09-23 15:33:55 +0200
message:
  made mobile login page match mobile interface, also added image logo to mobile pages
added:
  dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/css/login_mobile.css
modified:
  dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/security/login_mobile.vm
  dhis-2/dhis-web/dhis-web-light/src/main/webapp/dhis-web-light/main.vm
  dhis-2/dhis-web/dhis-web-light/src/main/webapp/dhis-web-light/style/light.css


--
lp:dhis2
https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk

Your team DHIS 2 developers is subscribed to branch lp:dhis2.
To unsubscribe from this branch go to https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk/+edit-subscription
=== added file 'dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/css/login_mobile.css'
--- dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/css/login_mobile.css	1970-01-01 00:00:00 +0000
+++ dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/css/login_mobile.css	2011-09-23 13:33:55 +0000
@@ -0,0 +1,496 @@
+@charset "UTF-8";
+/* CSS Document */
+/*
+ * RESET
+ *
+ */
+
+html, body, div, span, object, blockquote, pre,
+abbr, acronym, address, big, cite, code, dfn, em, font, img, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center, dl, dt, dd, fieldset, form, label, legend,
+caption, tr, th, td {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	font-size: 100%;
+	font-weight: normal;
+	vertical-align: baseline;
+	background: transparent;
+}
+
+p {
+	border: 0;
+	font-size: 100%;
+	font-weight: normal;
+	vertical-align: baseline;
+	background: transparent;
+}
+a {
+	margin: 0;
+	padding: 0;
+	font-weight: normal;
+}
+
+h1, h2, h3, h4, h5, h6 {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	vertical-align: baseline;
+	background: transparent;
+}
+
+body table {
+	margin: 0;
+	padding: 0;
+	font-size: 100%;
+	font-weight: normal;
+	vertical-align: baseline;
+	background: transparent;
+	border-collapse: collapse;
+	border-spacing: 0;
+}
+
+/*
+ * DEFAULT STYLES
+ * 
+ */
+body {
+	color: #333333;
+	font-weight: normal;
+	font-family: sans-serif;
+}
+/*removes horizontal overflow on certain devices*/
+body div#wrap {
+	width: 100%;
+	overflow: hidden;
+	position: absolute;
+	left: 0;
+	padding: 0;
+}
+/*
+ * HEADER
+ * 
+ */
+body div#header {
+	height: 2.0em;
+	background-color: #1d5288;
+	border-bottom: 4px solid #2770B9;
+	padding-top: 2px;
+	padding-bottom: 2px;
+	margin-bottom: .5em;
+}
+
+body div#header span {
+	font-size: 1.5em;
+	font-weight: bold;
+	padding-left: 2%;
+	padding-right: 2%;
+	color: blue;
+	margin-bottom: .4em;
+	margin-top: .4em;
+}
+
+/*
+ * FOOTER
+ * 
+ */
+body div#footer {
+	background-color: #F6F6F6;
+	border-top: 1px solid #D8D8D8;
+	padding: .7em 0em;
+	clear: both;
+	height: 1.5em;
+	display: block;
+}
+
+body div#footer ul {
+	margin-left: 2em;
+	padding-left: 0;
+	margin-bottom: 0;
+	margin-top: 0;
+}
+
+body div#footer ul li {
+	margin-left: 0;
+	padding-left: 0;
+}
+
+body div#footer p {
+	margin-left: 2%;
+	margin-top: .3em;
+	padding: 0;
+}
+
+body div#footer ul li {
+	list-style-type: none;
+	text-align: right;
+	padding-right: 1em;
+}
+
+/*
+ * BASIC ELEMENTS
+ * 
+ */
+ 
+/*body required as early browsers don't understand p by itself */
+body p {
+	margin-top: 0;
+	margin-bottom: 0.6em;
+	padding: 0 2% 0 2%;
+	font-size: 100%;
+}
+
+strong {
+	font-weight: bold;
+}
+em {
+	font-style: normal;
+	font-weight: bold;
+}
+/*
+ * LINK STATES
+ * 
+ */
+a:link {
+	color:#003399;
+}
+
+a:visited {
+	color:#006600;
+}
+a:hover {
+	color:#FF9900;
+}
+
+a:active {
+	color:#990000;
+}
+
+/*
+ * HEADERS
+ * 
+ */
+body h1 {
+	font-size: 1.4em;
+	padding-left: 2%;
+	padding-right: 2%; 
+	margin-top: 0;
+	margin-bottom: 0.4em;
+	line-height: normal;
+	clear: both;
+}
+
+body h2 {
+	font-size: 1.3em;
+	padding-left: 2%;
+	padding-right: 2%;
+	color: white;
+	background-color: #44AA33;
+	border-top: 1px solid #67DD30;
+	border-bottom: 2px solid #378C29;
+	margin-top: 0;
+	margin-bottom: 0.4em;
+	line-height: normal;
+	clear: both;
+}
+
+body h3 {
+/*	font-size: 1.2em;
+	padding-left: 2%;
+	padding-right: 2%;
+	background-color: #0038E1;
+	color: #FFFFFF;
+	margin-top: 0;
+	margin-bottom: 0.4em;
+	border-top: 1px solid #0081CA;
+	border-bottom: 2px solid #000C30;
+	*/
+	font-size: 0.8em;
+	border: 2px solid #0038E1;
+	width: 95%;
+	margin: 0em auto;
+	padding: 0.3em 0.3em;
+	background-color: #0038E1;
+	color: white;
+}
+
+body h4 {
+	font-size: 1.1em;
+	padding-left: 2%;
+	padding-right: 2%;
+	color: #CC0066;
+	margin-top: 0;
+	margin-bottom: 0.4em;
+	font-weight: bold;
+}
+
+body h5 {
+	font-size: 1.0em;
+	background-color: #F6F6F6;
+	border-bottom: 1px solid #D8D8D8;
+	border-top: 1px solid #D8D8D8;
+	padding-left: 2%;
+	padding-right: 2%;
+	padding-top: .3em;
+	padding-bottom: .3em;
+	margin-top: 0;
+	margin-bottom: 0.6em;
+
+/*	padding-left: 2%;
+	padding-right: 2%;
+	color: #333333;
+	margin-top: 0;
+	margin-bottom: 0.4em; */
+}
+
+body h6 {
+	font-size: 0.9em;
+	background-color: #F6F6F6;
+	border-bottom: 1px solid #D8D8D8;
+	border-top: 1px solid #D8D8D8;
+	padding-left: 2%;
+	padding-right: 2%;
+	padding-top: .3em;
+	padding-bottom: .3em;
+	margin-top: 0;
+	margin-bottom: 0.6em;
+}
+/*
+ * IMAGE WITH OPTIONAL CAPTION
+ * 
+ */
+body img.captioned {
+	margin: 0 0 0 2%;
+}
+
+body p.caption-image {
+	font-size: small;
+	margin-top: 0;
+	margin-bottom: 0.6em;
+	padding-left: 2%;
+}
+/*
+ * BLOCKQUOTE
+ * 
+ */
+blockquote {
+	margin: 0 4% 0.4em 4%;
+	padding: .6em 0 .3em 0;
+	border-top: 1px solid #D8D8D8;
+	border-bottom: 1px solid #D8D8D8;
+}
+blockquote p {
+	margin: .0;
+	padding: 0 0 0.6em 0;
+	border-bottom: 1px solid #D8D8D8;
+}
+/*
+ * LISTS
+ * 
+ */
+/* compensates for smaller Opera Mini margins */
+ol, ul, dl {
+	margin-left: 2%;
+	padding-left: 5px;
+}
+
+ul li {
+	list-style-type: none;	
+}
+
+dd {
+	margin-left: 2%;
+}
+/*forces native margin*/
+body ul, body ol, body dl {
+	margin-top: 0;
+	margin-bottom: 0.6em;
+	font-size: 100%;
+}
+/*
+ * BREADCRUMBS
+ * 
+ */
+body ul.breadcrumbs {
+	padding-top: 0;
+	padding-bottom: .5em;
+	padding-left: 0;
+	padding-right: .5em;
+	font-size: small;
+	list-style-type: none;
+	margin-bottom: 0.6em;
+	margin-top: 0;
+	margin-left: 2%;
+}
+
+body ul.breadcrumbs li {
+	display: inline;
+	line-height: 1em;
+}
+/*
+ * FORMS
+ * 
+ */
+body fieldset {
+	margin: 0;
+	padding: 0;
+	border: none;
+}
+
+body form {
+	margin: 0;
+	color: #333333;
+}
+
+body form label {
+	font-size: medium;
+	width: 100%;
+	margin-bottom: .5em;
+	margin-top: .5em;
+}
+
+body form input {
+	width: 100%;
+}
+
+body input[type='text'] { 
+	padding: 0.2em;
+	margin-bottom: .5em;
+	display: block;
+}
+
+body textarea { 
+	padding: 0.2em;
+	margin-bottom: .7em;
+	display: block;
+}
+
+body form input[type='radio'], body form input[type='checkbox'] { 
+	margin:0.1em 0em;
+	padding: 0;
+}
+
+body select {
+	margin-bottom: 0;
+}
+
+body input[type='button'] {
+	padding: 1em 1.3em;
+	color: #D8D8D8;
+	margin: 1em 0em;
+}
+
+
+/*
+ * TABLES
+ * 
+ */
+body table {
+	border: 1px solid #D8D8D8;
+	margin: 0;
+	width: 100%;
+	color: #333333;
+	font-size: 80%;
+}
+
+body td {
+	padding-left: .3em;
+	padding-right: .3em;
+	padding-top: .2em;
+	padding-bottom: .2em;
+	line-height: 1.5em;
+	border: 1px solid #D8D8D8;
+}
+
+/*compensates for lack of consistent header support*/
+body td.table-header {
+	color: #0033CC;
+	font-weight: bold;
+	background-color: #F6F6F6;
+}
+
+body tr {
+	height: 1.5em;
+}
+
+body table td.odd {
+	background-color: #F6F6F6;
+}
+
+/*caption-side unlikely to be supported*/
+body caption {
+	caption-side: bottom;
+	padding-top: 0.3em;
+	padding-bottom: 0.3em;
+	margin-left: .5em;
+	font-size: small;
+	text-align: left;
+	font-style: normal;
+}
+
+/*
+ * CONTAINER BOXES
+ * 
+ */
+body div.box p.box-text {
+	border: 1px solid #D8D8D8;
+	width: 92%;
+	margin: 0 auto 0.6em auto;
+	padding: 0.4em 0.4em;
+	background-color: #F6F6F6;
+}
+
+body div.header-box p {
+	font-size: 1em;
+	border: 1px solid #D8D8D8;
+	width: 92%;
+	margin: 0 auto 0.6em auto;
+	padding: 0.4em 0.4em;
+	background-color: #F6F6F6;
+}
+
+/* 2px border is required to ensure header is flush with the box */
+body div.header-box h3 {
+	font-size: 1.2em;
+	border: 2px solid #0038E1;
+	width: 92%;
+	margin: 0em auto;
+	padding: 0.3em 0.3em;
+	background-color: #0038E1;
+	color: white;
+}
+
+/*
+ * BACK TO TOP/HOME
+ * 
+ */
+p.top {
+	font-size: small;
+	background-color: #F6F6F6;
+	border-bottom: 1px solid #D8D8D8;
+	border-top: 1px solid #D8D8D8;
+	padding-top: .3em;
+	padding-bottom: .3em;
+	margin-top: 0;
+	margin-bottom: 0.6em;
+	clear: both;
+}
+p.home {
+	font-size: small;
+	background-color: #F6F6F6;
+	border-bottom: 1px solid #D8D8D8;
+	border-top: 1px solid #D8D8D8;
+	padding-top: .3em;
+	padding-bottom: .3em;
+	margin-top: 0;
+	margin-bottom: 0.6em;
+	clear: both;
+}
+p.top a, p.home a {
+	color: #333333;
+	text-decoration: none;
+	width: 100%;
+	display: block;
+}
+

=== modified file 'dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/security/login_mobile.vm'
--- dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/security/login_mobile.vm	2011-09-22 10:22:37 +0000
+++ dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/security/login_mobile.vm	2011-09-23 13:33:55 +0000
@@ -4,64 +4,39 @@
 <title>DHIS 2</title>
 
 <meta name="viewport" content="width=device-width, user-scalable=no" />
-	
-<style type="text/css">
-html,body
-{
-	background-color: #1d5288;  
-	color: white;
-	font-size: 1.1em;
-	font-family: verdana, sans, sans-serif;
-}
-
-input {
-	font-size: 1em;
-	font-family: verdana, sans, sans-serif;
-	width: 96%;
-}
-
-table {
-	width: 100%;
-}
-</style>
+<link rel="stylesheet" href="../css/login_mobile.css" />
+
 </head>
 
-<body align="center">
-
-<div id="wrapper" align="center">
-<p>
-	<img alt="DHIS2" src="logo_banner.png">
-</p>
-
+<body>
+
+<div id="wrap">
+
+<div id="header">
+	<img src="logo_banner.png" alt="DHIS2" width="120" height="36">
+</div>
+
+<div id="content">
 <form id='loginForm' action="../../dhis-web-commons-security/login.action" method="POST">
 
-<table>
-	<tr>
-		<td><h3>Username</h3></td>
-	</tr>
-	<tr>
-		<td>
-			<input type="text" id="j_username" name="j_username" size="9">
-		</td>
-	</tr>
-	<tr>
-		<td><h3>Password</h3></td>
-	</tr>
-	<tr>
-		<td>
-			<input type="password" id="j_password" name="j_password" size="9">
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<br />
-			<input id='submit' type="submit" value="Login" style="width: 48%;">
-			<input id='reset' type="reset" value="Clear" style="width: 48%;">
-		</td>
-	</tr>
-</table>
+<div class="header-box">
+	<h3>Login</h3>
+	<p>
+		<label>Username</label> <input type="text" id="j_username" name="j_username" size="24"> <br />
+		<label>Password</label> <input type="password" id="j_password" name="j_password" size="24"> <br />
+	</p>
+</div>
+
+<div class="header-box">
+	<p>
+		<input type="submit" style="width: 48%" value="Login"/>
+		<input type="reset" style="width: 48%" value="Reset"/>
+	</p>
+</div>
 
 </form>
+</div>
+</div>
 
 #if( $failed == true )
 <p style="color: #eee;">
@@ -70,5 +45,4 @@
 #end
 
 </body>
-
 </html>

=== modified file 'dhis-2/dhis-web/dhis-web-light/src/main/webapp/dhis-web-light/main.vm'
--- dhis-2/dhis-web/dhis-web-light/src/main/webapp/dhis-web-light/main.vm	2011-09-23 13:11:20 +0000
+++ dhis-2/dhis-web/dhis-web-light/src/main/webapp/dhis-web-light/main.vm	2011-09-23 13:33:55 +0000
@@ -11,7 +11,7 @@
 <div id="wrap">
 
 <div id="header">
-	<span>DHIS 2</span>
+	<img src="../dhis-web-commons/security/logo_banner.png" alt="DHIS2" width="120" height="36">
 </div>
 
 <div id="content">

=== modified file 'dhis-2/dhis-web/dhis-web-light/src/main/webapp/dhis-web-light/style/light.css'
--- dhis-2/dhis-web/dhis-web-light/src/main/webapp/dhis-web-light/style/light.css	2011-09-23 13:11:20 +0000
+++ dhis-2/dhis-web/dhis-web-light/src/main/webapp/dhis-web-light/style/light.css	2011-09-23 13:33:55 +0000
@@ -74,8 +74,10 @@
  */
 body div#header {
 	height: 2.0em;
-	background-color: #D8D8D8;
-	border-bottom: 4px solid #44AA33;
+	background-color: #1d5288;
+	border-bottom: 4px solid #2770B9;
+	padding-top: 2px;
+	padding-bottom: 2px;
 	margin-bottom: .5em;
 }