responsive self service
This commit is contained in:
parent
a2f5dae6b3
commit
5342ee41ad
|
@ -19,6 +19,7 @@
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@ -43,10 +44,16 @@ This is a list of API changes for all LAM releases.
|
||||||
|
|
||||||
<br>
|
<br>
|
||||||
|
|
||||||
<h2>5.0 -> 5.1</h2>Module interface - getPDFEntries(): It is no
|
<h2>5.0 -> 5.1</h2>Module interface<br>
|
||||||
|
<ul>
|
||||||
|
<li><span style="font-weight: bold;">getPDFEntries(): </span>It is no
|
||||||
longer supported that modules generate PDF XML on their own. You must
|
longer supported that modules generate PDF XML on their own. You must
|
||||||
use addSimplePDFField/addPDFKeyValue/addPDFTable() from baseModule for
|
use addSimplePDFField/addPDFKeyValue/addPDFTable() from baseModule for
|
||||||
this.<br>
|
this.</li>
|
||||||
|
<li><span style="font-weight: bold;">getSelfServiceOptions:</span> the function must now return an array of htmlResponsiveRow instead of htmlTableRow<br>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
<br>
|
<br>
|
||||||
<h2>4.8 -> 4.9</h2>
|
<h2>4.8 -> 4.9</h2>
|
||||||
API changes<br>
|
API changes<br>
|
||||||
|
|
|
@ -989,7 +989,9 @@ Have fun!
|
||||||
<section>
|
<section>
|
||||||
<title>5.0 -> 5.1</title>
|
<title>5.0 -> 5.1</title>
|
||||||
|
|
||||||
<para>No special actions needed.</para>
|
<para>Self Service: There were large changes to provide a responsive
|
||||||
|
design that works for desktop and mobile. If you use custom CSS to
|
||||||
|
style Self Service then this must be updated.</para>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
|
|
|
@ -1428,8 +1428,8 @@ abstract class baseModule {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$row = new htmlResponsiveRow();
|
$row = new htmlResponsiveRow();
|
||||||
$row->add(new htmlOutputText($this->getSelfServiceLabel($name, $label)), 12, 6, 6, 'tabletPlus-align-right mobile-align-left');
|
$row->add(new htmlOutputText($this->getSelfServiceLabel($name, $label)), 12, 6, 6, 'responsiveLabel');
|
||||||
$row->add($field, 12, 6, 6, 'tabletPlus-align-left');
|
$row->add($field, 12, 6, 6, 'responsiveField');
|
||||||
$container[$name] = $row;
|
$container[$name] = $row;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -3408,14 +3408,14 @@ class htmlResponsiveInputField extends htmlInputField {
|
||||||
if (is_dir("../graphics")) $graphicsPath = "../graphics";
|
if (is_dir("../graphics")) $graphicsPath = "../graphics";
|
||||||
$labelGroup->addElement(new htmlImage($graphicsPath . '/required.png', 16, 16, _('required'), _('required')));
|
$labelGroup->addElement(new htmlImage($graphicsPath . '/required.png', 16, 16, _('required'), _('required')));
|
||||||
}
|
}
|
||||||
$row->add($labelGroup, 12, 6, 6, 'tabletPlus-align-right mobile-align-left');
|
$row->add($labelGroup, 12, 6, 6, 'responsiveLabel');
|
||||||
// input field
|
// input field
|
||||||
$fieldGroup = new htmlGroup();
|
$fieldGroup = new htmlGroup();
|
||||||
$fieldGroup->addElement($this);
|
$fieldGroup->addElement($this);
|
||||||
if (!empty($this->helpID)) {
|
if (!empty($this->helpID)) {
|
||||||
$fieldGroup->addElement(new htmlHelpLink($this->helpID));
|
$fieldGroup->addElement(new htmlHelpLink($this->helpID));
|
||||||
}
|
}
|
||||||
$row->add($fieldGroup, 12, 6, 6, 'tabletPlus-align-left');
|
$row->add($fieldGroup, 12, 6, 6, 'responsiveField');
|
||||||
return $row->generateHTML($module, $input, $values, $restricted, $tabindex, $scope);
|
return $row->generateHTML($module, $input, $values, $restricted, $tabindex, $scope);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -667,25 +667,21 @@ div.dialog-page {
|
||||||
/* mobile */
|
/* mobile */
|
||||||
@media only screen and (max-width: 40.0625em) {
|
@media only screen and (max-width: 40.0625em) {
|
||||||
|
|
||||||
.mobile-align-left {
|
.responsiveLabel {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mobile-align-right {
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* tablet */
|
/* tablet */
|
||||||
@media only screen and (min-width: 40.0625em) and (max-width: 64.0625em) {
|
@media only screen and (min-width: 40.0625em) and (max-width: 64.0625em) {
|
||||||
|
|
||||||
.tablet-align-left,.tabletPlus-align-left {
|
.responsiveLabel {
|
||||||
text-align: left;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tablet-align-right,.tabletPlus-align-right {
|
.responsiveField {
|
||||||
text-align: right;
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -693,12 +689,12 @@ div.dialog-page {
|
||||||
/* desktop */
|
/* desktop */
|
||||||
@media only screen and (min-width: 64.0625em) {
|
@media only screen and (min-width: 64.0625em) {
|
||||||
|
|
||||||
.desktop-align-left,.tabletPlus-align-left {
|
.responsiveLabel {
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.desktop-align-right,.tabletPlus-align-right {
|
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.responsiveField {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue