improve layout of personal settings page

1 files changed, 35 insertions, 20 deletions

diff --git a/settings/css/settings.css b/settings/css/settings.css
index 5a1d864734b..cf9a61431c9 100644
--- a/settings/css/settings.css
+++ b/settings/css/settings.css
@@ -6,30 +6,49 @@ select#languageinput, select#timezone { width:15em; }
 input#openid, input#webdav { width:20em; }
 
 /* PERSONAL */
-#sslCertificate tr.expired {
-	background-color: rgba(255, 0, 0, 0.5);
+
+#avatar {
+	display: inline-block;
+	float: left;
+	width: 160px;
+	padding-right: 0;
 }
-#sslCertificate td {
-	padding: 5px;
+#avatar .avatardiv {
+	margin-bottom: 10px;
+}
+#avatar .warning {
+	width: 350px;
+}
+#uploadavatarbutton,
+#selectavatar,
+#removeavatar {
+	width: 33px;
+	height: 33px;
 }
 
-/* Sync clients */
-.clientsbox {
-	padding-top: 30px;
-	margin-top: -30px;
+#displaynameform,
+#lostpassword,
+#groups {
+	display: inline-block;
+	margin-bottom: 0;
+	padding-bottom: 0;
+	padding-right: 0;
+	min-width: 60%;
 }
-.clientsbox h2 {
-	font-weight: 300;
-	font-size: 20px;
-	margin: 35px 0 10px;
+#avatar,
+#passwordform {
+	margin-bottom: 0;
+	padding-bottom: 0;
 }
-.clientsbox .center {
-	margin-top: 10px;
+
+#sslCertificate tr.expired {
+	background-color: rgba(255, 0, 0, 0.5);
 }
-.clientsbox a {
-	font-weight: 600;
+#sslCertificate td {
+	padding: 5px;
 }
 
+
 #displaynameerror {
 	display: none;
 }
@@ -44,10 +63,6 @@ input#identity {
 	width: 17em;
 }
 
-#avatar .warning {
-	width: 350px;
-}
-
 .msg.success {
 	color: #fff;
 	background-color: #47a447;