responsive self service

lam/lib/baseModule.inc

@@ -1412,9 +1412,10 @@ abstract class baseModule {
 		if (!$isTextArea && !in_array($name, $readOnlyFields)) {
 			$field = new htmlInputField(get_class($this) . '_' . $name, $value);
 			$field->setRequired($required);
+			$field->setFieldSize(null);
 		}
 		elseif ($isTextArea && !in_array($name, $readOnlyFields)) {
-			$field = new htmlInputTextarea(get_class($this) . '_' . $name, $value, 30, 3);
+			$field = new htmlInputTextarea(get_class($this) . '_' . $name, $value, null, null);
 		}
 		else {
 			if (!$isTextArea) {
@@ -1426,9 +1427,10 @@ abstract class baseModule {
 				$field = new htmlOutputText($value, false);
 			}
 		}
-		$container[$name] = new htmlTableRow(array(
+		$row = new htmlResponsiveRow();
-			new htmlOutputText($this->getSelfServiceLabel($name, $label)), $field
+		$row->add(new htmlOutputText($this->getSelfServiceLabel($name, $label)), 12, 6, 6, 'tabletPlus-align-right mobile-align-left');
-		));
+		$row->add($field, 12, 6, 6, 'tabletPlus-align-left');
+		$container[$name] = $row;
 	}
 
 	/**
@@ -1610,7 +1612,7 @@ abstract class baseModule {
 	 * @param array $attributes attributes of LDAP account
 	 * @param boolean $passwordChangeOnly indicates that the user is only allowed to change his password and no LDAP content is readable
 	 * @param array $readOnlyFields list of read-only fields
-	 * @return array list of meta HTML elements (field name => htmlTableRow)
+	 * @return array list of meta HTML elements (field name => htmlResponsiveRow)
 	 *
 	 * @see htmlElement
 	 */

lam/lib/html.inc

@@ -955,6 +955,10 @@ class htmlButton extends htmlElement {
 		elseif ($this->iconClass == null) {
 			$classList[] = 'smallPadding';
 		}
+		// button with text and icon
+		else {
+			$classList[] = 'margin5';
+		}
 		if (sizeof($classList) > 0) {
 			$class = ' class="' . implode(' ', $classList) . '"';
 		}
@@ -2215,8 +2219,8 @@ class htmlInputTextarea extends htmlElement {
 		if (isset($values[$this->name])) {
 			$this->value = implode("\r\n", $values[$this->name]);
 		}
-		$colCount = ' cols="' . $this->colCount . '"';
+		$colCount = ($this->colCount != null) ? ' cols="' . $this->colCount . '"' : '';
-		$rowCount = ' rows="' . $this->rowCount . '"';
+		$rowCount = ($this->rowCount != null) ? ' rows="' . $this->rowCount . '"' : '';
 		$tabindexValue = ' tabindex="' . $tabindex . '"';
 		$tabindex++;
 		$disabled = '';

lam/lib/modules/windowsUser.inc

@@ -1711,23 +1711,22 @@ class windowsUser extends baseModule implements passwordService {
 	 * @param array $attributes attributes of LDAP account
 	 * @param boolean $passwordChangeOnly indicates that the user is only allowed to change his password and no LDAP content is readable
 	 * @param array $readOnlyFields list of read-only fields
-	 * @return array list of meta HTML elements (field name => htmlTableRow)
+	 * @return array list of meta HTML elements (field name => htmlResponsiveRow)
 	 */
 	function getSelfServiceOptions($fields, $attributes, $passwordChangeOnly, $readOnlyFields) {
 		$return = array();
 		if (in_array('unicodePwd', $fields)) {
-			$pwdTable = new htmlTable();
+			$row = new htmlResponsiveRow();
-			$pwdTable->colspan = 3;
+			$pwd1 = new htmlResponsiveInputField($this->getSelfServiceLabel('unicodePwd', _('New password')), 'windowsUser_unicodePwd');
-			$pwd1 = new htmlTableExtendedInputField($this->getSelfServiceLabel('unicodePwd', _('New password')), 'windowsUser_unicodePwd');
 			$pwd1->setIsPassword(true, true);
-			$pwdTable->addElement($pwd1, true);
+			$pwd1->setFieldSize(null);
-			$pwd2 = new htmlTableExtendedInputField(_('Reenter password'), 'windowsUser_unicodePwd2');
+			$row->add($pwd1, 12);
+			$pwd2 = new htmlResponsiveInputField(_('Reenter password'), 'windowsUser_unicodePwd2');
 			$pwd2->setIsPassword(true);
+			$pwd2->setFieldSize(null);
 			$pwd2->setSameValueFieldID('windowsUser_unicodePwd');
-			$pwdTable->addElement($pwd2);
+			$row->add($pwd2, 12);
-			$return['unicodePwd'] = new htmlTableRow(array(
+			$return['unicodePwd'] = $row;
-				$pwdTable
-			));
 		}
 		if ($passwordChangeOnly) {
 			return $return; // only password fields as long no LDAP content can be read

lam/lib/selfService.inc

@@ -92,7 +92,7 @@ function getSelfServiceFieldSettings($scope) {
  * @param array $attributes LDAP attributes (attribute names in lower case)
  * @param boolean $passwordChangeOnly indicates that the user is only allowed to change his password and no LDAP content is readable
  * @param array $readOnlyFields list of read-only fields
- * @return array meta HTML code (array(<moduleName> => htmlTableRow))
+ * @return array meta HTML code (array(<moduleName> => htmlResponsiveRow))
  */
 function getSelfServiceOptions($scope, $fields, $attributes, $passwordChangeOnly, $readOnlyFields) {
 	$return = array();

lam/style/500_layout.css

@@ -3,7 +3,7 @@ $Id$
 
   This code is part of LDAP Account Manager (http://www.ldap-account-manager.org/)
   Copyright (C) 2003  Leonhard Walchshaeusl
-  Copyright (C) 2005 - 2014  Roland Gruber
+  Copyright (C) 2005 - 2015  Roland Gruber
 
   This program is free software; you can redistribute it and/or modify
   it under the terms of the GNU General Public License as published by
@@ -41,6 +41,7 @@ body {
 
 body.selfservice {
   padding: 10px;
+  background: #fffde2;
 }
 
 .defaultBackground {