SuiteCRM/SuiteCRM-Core
2
0
Fork 0
mirror of https://github.com/SuiteCRM/SuiteCRM-Core.git synced 2025-09-05 10:18:33 +08:00
Code Issues Projects Packages Activity Actions

[Legacy] Email Settings Mobile Fixes

Browse source
This commit is contained in:
balumahendran 2022-07-21 11:26:49 +05:30 • committed by Clemente Raposo
parent 0f39a0f264
commit 2feffbadab
2 changed files with 233 additions and 133 deletions
Download patch file Download diff file Expand all files Collapse all files

256
public/legacy/modules/EmailMan/tpls/config.tpl
View file

@ -104,8 +104,8 @@ function change_state(radiobutton) {
<td width="30%"> <td width="30%">
<select id="mail_sendtype" name="mail_sendtype" onChange="notify_setrequired(document.ConfigureSettings); SUGAR.user.showHideGmailDefaultLink(this);" tabindex="1">{$mail_sendtype_options}</select> <select id="mail_sendtype" name="mail_sendtype" onChange="notify_setrequired(document.ConfigureSettings); SUGAR.user.showHideGmailDefaultLink(this);" tabindex="1">{$mail_sendtype_options}</select>
</td> </td>
<td scope="row">&nbsp;</td> <td scope="row" class="mobile-hide">&nbsp;</td>
<td >&nbsp;</td> <td class="mobile-hide">&nbsp;</td>
</tr> </tr>
<tr> <tr>
<td width="20%" scope="row">{$MOD.LBL_NOTIFY_FROMNAME} <span class="required">{$APP.LBL_REQUIRED_SYMBOL}</span></td> <td width="20%" scope="row">{$MOD.LBL_NOTIFY_FROMNAME} <span class="required">{$APP.LBL_REQUIRED_SYMBOL}</span></td>
@ -176,8 +176,8 @@ function change_state(radiobutton) {
<tr id="smtp_auth1"> <tr id="smtp_auth1">
<td width="20%" scope="row"><span id="mail_smtpuser_label">{$MOD.LBL_MAIL_SMTPUSER}</span> <span class="required">{$APP.LBL_REQUIRED_SYMBOL}</span></td> <td width="20%" scope="row"><span id="mail_smtpuser_label">{$MOD.LBL_MAIL_SMTPUSER}</span> <span class="required">{$APP.LBL_REQUIRED_SYMBOL}</span></td>
<td width="30%" ><input type="text" id="mail_smtpuser" name="mail_smtpuser" size="25" maxlength="255" value="{$mail_smtpuser}" tabindex='1' ></td> <td width="30%" ><input type="text" id="mail_smtpuser" name="mail_smtpuser" size="25" maxlength="255" value="{$mail_smtpuser}" tabindex='1' ></td>
<td width="20%">&nbsp;</td> <td width="20%" class="mobile-hide">&nbsp;</td>
<td width="30%">&nbsp;</td> <td width="30%" class="mobile-hide">&nbsp;</td>
</tr> </tr>
<tr id="smtp_auth2"> <tr id="smtp_auth2">
<td width="20%" scope="row"><span id="mail_smtppass_label">{$MOD.LBL_MAIL_SMTPPASS}</span> <span class="required">{$APP.LBL_REQUIRED_SYMBOL}</span></td> <td width="20%" scope="row"><span id="mail_smtppass_label">{$MOD.LBL_MAIL_SMTPPASS}</span> <span class="required">{$APP.LBL_REQUIRED_SYMBOL}</span></td>
@ -185,8 +185,8 @@ function change_state(radiobutton) {
<input type="password" id="mail_smtppass" name="mail_smtppass" size="25" maxlength="255" tabindex='1'> <input type="password" id="mail_smtppass" name="mail_smtppass" size="25" maxlength="255" tabindex='1'>
<a href="javascript:void(0)" id='mail_smtppass_link' onClick="SUGAR.util.setEmailPasswordEdit('mail_smtppass')" style="display: none">{$APP.LBL_CHANGE_PASSWORD}</a> <a href="javascript:void(0)" id='mail_smtppass_link' onClick="SUGAR.util.setEmailPasswordEdit('mail_smtppass')" style="display: none">{$APP.LBL_CHANGE_PASSWORD}</a>
</td> </td>
<td width="20%">&nbsp;</td> <td width="20%" class="mobile-hide">&nbsp;</td>
<td width="30%">&nbsp;</td> <td width="30%" class="mobile-hide">&nbsp;</td>
</tr> </tr>
<tr id="mail_allow_user"> <tr id="mail_allow_user">
<td width="25%" scope="row"> <td width="25%" scope="row">
@ -217,12 +217,12 @@ function change_state(radiobutton) {
</div> </div>
</td> </td>
</tr> </tr>
<tr><td colspan="4">&nbsp;</tr> <tr><td colspan="4" class="mobile-hide">&nbsp;</tr>
<tr> <tr>
<td width="15%"><input type="button" class="btn btn-info" value="{$APP.LBL_EMAIL_TEST_OUTBOUND_SETTINGS}" onclick="testOutboundSettings();">&nbsp;</td> <td width="15%"><input type="button" class="btn btn-info" value="{$APP.LBL_EMAIL_TEST_OUTBOUND_SETTINGS}" onclick="testOutboundSettings();">&nbsp;</td>
<td width="15%">&nbsp;</td> <td width="15%" class="mobile-hide">&nbsp;</td>
<td width="40%">&nbsp;</td> <td width="40%" class="mobile-hide">&nbsp;</td>
<td width="40%">&nbsp;</td> <td width="40%" class="mobile-hide">&nbsp;</td>
</tr> </tr>
</table> </table>
</div> </div>
@ -309,20 +309,14 @@ function change_state(radiobutton) {
</div> </div>
</a> </a>
</div> </div>
<div class="panel-body"> <div class="panel-body applet-content">
<div class="tab-content"> <div class="tab-content">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="edit view"> <div>{$MOD.LBL_SECURITY_DESC}</div>
<tr>
<td align="left" scope="row" colspan="4"> <div class="flex">
{$MOD.LBL_SECURITY_DESC} <div>{$MOD.LBL_SECURITY_OUTLOOK_DEFAULTS}</div>
</td> <div style="margin-left: 3em;">
</tr> <input type="checkbox" value="1" name="set_outlook_defaults" id="set_outlook_defaults" onclick="setOutlookDefaults();">&nbsp;
<tr>
<td valign="middle" valign="top" scope="row" colspan="3">
{$MOD.LBL_SECURITY_OUTLOOK_DEFAULTS}
</td>
<td width="10%" NOWRAP valign="top" >
<input type="checkbox" value="1" name="set_outlook_defaults" id="set_outlook_defaults" onclick="setOutlookDefaults();">&nbsp;
{literal} {literal}
<script type="text/javascript" language="Javascript"> <script type="text/javascript" language="Javascript">
<!-- <!--
@ -369,111 +363,110 @@ function change_state(radiobutton) {
--> -->
</script> </script>
{/literal} {/literal}
</td> </div>
</tr> </div>
<tr>
<td valign="middle" valign="top" scope="row" colspan="3"> <div class="flex">
{$MOD.LBL_SECURITY_TOGGLE_ALL} <div>{$MOD.LBL_SECURITY_TOGGLE_ALL}</div>
</td> <div style="margin-left: 3em;">
<td width="10%" NOWRAP valign="top" > <input type="checkbox" value="1" name="toggle_all" id="toggle_all" onclick="toggleAllSecurityOptions();">&nbsp;
<input type="checkbox" value="1" name="toggle_all" id="toggle_all" onclick="toggleAllSecurityOptions();">&nbsp; </div>
</td> </div>
</tr>
<tr> <div class="applet-container">
<td width="10%" valign="middle" scope="row">
{$MOD.LBL_SECURITY_APPLET} <div class="flex-container">
</td> <div class="flex-child">
<td width="40%" NOWRAP valign="middle" > <div class="lbl-space">{$MOD.LBL_SECURITY_APPLET}</div>
<input type="checkbox" value="1" name="applet" id="applet" {$appletChecked}>&nbsp; &lt;applet&gt; <div><input type="checkbox" value="1" name="applet" id="applet" {$appletChecked}></div>
</td> <div>&nbsp; &lt;applet&gt;</div>
<td width="10%" valign="middle" scope="row"> </div>
{$MOD.LBL_SECURITY_BASE} <div class="flex-child">
</td> <div class="lbl-space">{$MOD.LBL_SECURITY_BASE}</div>
<td width="40%" NOWRAP valign="middle" > <div><input type="checkbox" value="1" name="base" id="base" {$baseChecked}></div>
<input type="checkbox" value="1" name="base" id="base" {$baseChecked}>&nbsp; &lt;base&gt; <div>&nbsp; &lt;base&gt</div>
</td> </div>
</tr> </div>
<tr>
<td width="10%" valign="middle" scope="row"> <div class="flex-container">
{$MOD.LBL_SECURITY_EMBED} <div class="flex-child">
</td> <div class="lbl-space">{$MOD.LBL_SECURITY_EMBED}</div>
<td width="40%" NOWRAP valign="middle" > <div><input type="checkbox" value="1" name="embed" id="embed" {$embedChecked}></div>
<input type="checkbox" value="1" name="embed" id="embed" {$embedChecked}>&nbsp; &lt;embed&gt; <div>&nbsp; &lt;embed&gt;</div>
</td> </div>
<td width="10%" valign="middle" scope="row"> <div class="flex-child">
{$MOD.LBL_SECURITY_FORM} <div class="lbl-space">{$MOD.LBL_SECURITY_FORM}</div>
</td> <div><input type="checkbox" value="1" name="form" id="form" {$formChecked}></div>
<td width="40%" NOWRAP valign="middle" > <div>&nbsp; &lt;form&gt;</div>
<input type="checkbox" value="1" name="form" id="form" {$formChecked}>&nbsp; &lt;form&gt; </div>
</td> </div>
</tr>
<tr> <div class="flex-container">
<td width="10%" valign="middle" scope="row"> <div class="flex-child">
{$MOD.LBL_SECURITY_FRAME} <div class="lbl-space">{$MOD.LBL_SECURITY_FRAME}</div>
</td> <div><input type="checkbox" value="1" name="frame" id="frame" {$frameChecked}></div>
<td width="40%" NOWRAP valign="middle" > <div>&nbsp; &lt;frame&gt;</div>
<input type="checkbox" value="1" name="frame" id="frame" {$frameChecked}>&nbsp; &lt;frame&gt; </div>
</td> <div class="flex-child">
<td width="10%" valign="middle" scope="row"> <div class="lbl-space">{$MOD.LBL_SECURITY_FRAMESET}</div>
{$MOD.LBL_SECURITY_FRAMESET} <div><input type="checkbox" value="1" name="frameset" id="frameset" {$framesetChecked}></div>
</td> <div>&nbsp; &lt;frameset&gt;</div>
<td width="40%" NOWRAP valign="middle" > </div>
<input type="checkbox" value="1" name="frameset" id="frameset" {$framesetChecked}>&nbsp; &lt;frameset&gt; </div>
</td>
</tr> <div class="flex-container">
<tr> <div class="flex-child">
<td width="10%" valign="middle" scope="row"> <div class="lbl-space">{$MOD.LBL_SECURITY_IFRAME}</div>
{$MOD.LBL_SECURITY_IFRAME} <div><input type="checkbox" value="1" name="iframe" id="iframe" {$iframeChecked}></div>
</td> <div>&nbsp; &lt;iframe&gt;</div>
<td width="40%" NOWRAP valign="middle" > </div>
<input type="checkbox" value="1" name="iframe" id="iframe" {$iframeChecked}>&nbsp; &lt;iframe&gt; <div class="flex-child">
</td> <div class="lbl-space">{$MOD.LBL_SECURITY_IMPORT}</div>
<td width="10%" valign="middle" scope="row"> <div><input type="checkbox" value="1" name="import" id="import" {$importChecked}></div>
{$MOD.LBL_SECURITY_IMPORT} <div>&nbsp; &lt;import&gt;</div>
</td> </div>
<td width="40%" NOWRAP valign="middle" > </div>
<input type="checkbox" value="1" name="import" id="import" {$importChecked}>&nbsp; &lt;import&gt;
</td> <div class="flex-container">
</tr> <div class="flex-child">
<tr> <div class="lbl-space">{$MOD.LBL_SECURITY_LAYER}</div>
<td width="10%" valign="middle" scope="row"> <div><input type="checkbox" value="1" name="layer" id="layer" {$layerChecked}></div>
{$MOD.LBL_SECURITY_LAYER} <div>&nbsp; &lt;layer&gt;</div>
</td> </div>
<td width="40%" NOWRAP valign="middle" > <div class="flex-child">
<input type="checkbox" value="1" name="layer" id="layer" {$layerChecked}>&nbsp; &lt;layer&gt; <div class="lbl-space">{$MOD.LBL_SECURITY_LINK}</div>
</td> <div><input type="checkbox" value="1" name="link" id="link" {$linkChecked}></div>
<td width="10%" valign="middle" scope="row"> <div>&nbsp; &lt;link&gt;</div>
{$MOD.LBL_SECURITY_LINK} </div>
</td> </div>
<td width="40%" NOWRAP valign="middle" >
<input type="checkbox" value="1" name="link" id="link" {$linkChecked}>&nbsp; &lt;link&gt; <div class="flex-container">
</td> <div class="flex-child">
</tr> <div class="lbl-space">{$MOD.LBL_SECURITY_OBJECT}</div>
<tr> <div><input type="checkbox" value="1" name="object" id="object" {$objectChecked}></div>
<td width="10%" valign="middle" scope="row"> <div>&nbsp; &lt;object&gt;</div>
{$MOD.LBL_SECURITY_OBJECT} </div>
</td> <div class="flex-child">
<td width="40%" NOWRAP valign="middle" > <div class="lbl-space">{$MOD.LBL_SECURITY_STYLE}</div>
<input type="checkbox" value="1" name="object" id="object" {$objectChecked}>&nbsp; &lt;object&gt; <div><input type="checkbox" value="1" name="style" id="style" {if isset($styleChecked)}{$styleChecked}{else}{log msg="styleChecked is not set"}{/if}></div>
</td> <div>&nbsp; &lt;style&gt;</div>
<td width="10%" valign="middle" scope="row"> </div>
{$MOD.LBL_SECURITY_STYLE} </div>
</td>
<td width="40%" NOWRAP valign="middle" > <div class="flex-container">
<input type="checkbox" value="1" name="style" id="style" {if isset($styleChecked)}{$styleChecked}{else}{log msg="styleChecked is not set"}{/if}>&nbsp; &lt;style&gt; <div class="flex-child">
</td> <div class="lbl-space">{$MOD.LBL_SECURITY_XMP}</div>
</tr> <div><input type="checkbox" value="1" name="xmp" id="xmp" {$xmpChecked}></div>
<tr> <div>&nbsp; &lt;xmp&gt;</div>
<td width="10%" valign="middle" scope="row"> </div>
{$MOD.LBL_SECURITY_XMP} <div class="flex-child">
</td> <div>&nbsp;</div>
<td width="40%" NOWRAP valign="middle" > <div>&nbsp;</div>
<input type="checkbox" value="1" name="xmp" id="xmp" {$xmpChecked}>&nbsp; &lt;xmp&gt; </div>
</td> </div>
<td scope="row">&nbsp;</td>
<td>&nbsp;</td>
</tr> </div>
</table>
</div> </div>
</div> </div>
</div> </div>
@ -501,14 +494,13 @@ function change_state(radiobutton) {
<input type="button" class="button" value=" {$APP.LBL_CANCEL_BUTTON_LABEL} " onclick="javascript:EmailMan.testOutboundDialog.hide();">&nbsp; <input type="button" class="button" value=" {$APP.LBL_CANCEL_BUTTON_LABEL} " onclick="javascript:EmailMan.testOutboundDialog.hide();">&nbsp;
</td> </td>
</tr> </tr>
</table> </table>
</div> </div>
</div> </div>
<div class="btn-hide"> <div class="btn-hide">
<input title="{$APP.LBL_SAVE_BUTTON_TITLE}" class="button primary" onclick="this.form.action.value='Save';return verify_data(this);" type="submit" name="button" value=" {$APP.LBL_SAVE_BUTTON_LABEL} "> <input title="{$APP.LBL_SAVE_BUTTON_TITLE}" class="button primary" onclick="this.form.action.value='Save';return verify_data(this);" type="submit" name="button" value=" {$APP.LBL_SAVE_BUTTON_LABEL} ">
<input title="{$APP.LBL_CANCEL_BUTTON_TITLE}" class="button" onclick="this.form.action.value='{$RETURN_ACTION}'; this.form.module.value='{$RETURN_MODULE}';" type="submit" name="button" value=" {$APP.LBL_CANCEL_BUTTON_LABEL} "> <input title="{$APP.LBL_CANCEL_BUTTON_TITLE}" class="button" onclick="this.form.action.value='{$RETURN_ACTION}'; this.form.module.value='{$RETURN_MODULE}';" type="submit" name="button" value=" {$APP.LBL_CANCEL_BUTTON_LABEL} ">
</div> </div>
</form> </form>
@ -803,4 +795,4 @@ changeEmailScreenDisplay("{/literal}{$mail_smtptype}{literal}", false);
</script> </script>
{/literal} {/literal}
</div> </div>

110
public/legacy/themes/suite8/css/suitep-base/email-settings.scss
View file

@ -20,11 +20,12 @@
.action-btn-top { .action-btn-top {
position: absolute; position: absolute;
right: 0; right: 0;
bottom: 2%; margin-top: -4.2em;
} }
.required-text { .required-text {
position:absolute; position:absolute;
right: 0; right: 0;
top: -5px;
} }
.panel-heading a:before { .panel-heading a:before {
display: none; display: none;
@ -49,3 +50,110 @@
} }
} }
} }
/*Email Settings Starts Here */
.view-module-EmailMan.view-action-config {
.email-settings {
.applet-content {
.tab-content {
line-height: 3em;
font-weight: 700;
color: #534D64;
}
.flex {
display: flex;
}
.flex-container {
display: flex;
line-height: 3em;
@media (max-width: 750px) {
display: block;
}
}
.flex-child {
display: flex;
width: 50%;
@media (max-width: 750px) {
width: 100%;
}
.label-descrp {
width: 20%;
}
span {
margin-left: 1em;
}
.lbl-space {
margin-right: 2em;
width: 12%;
@media (min-width: 500px) and (max-width: 1200px){
width: 18%;
white-space: nowrap;
}
@media (max-width: 500px) {
width: 30%;
}
}
}
}
}
}
@media (min-width:769px) and (max-width:800px) {
.view-module-EmailMan.view-action-config {
.edit tr td[scope="row"] {
height: auto;
line-height: 2em;
}
}
}
@media (max-width: 768px) {
.view-module-EmailMan.view-action-config {
.moduleTitle {
width: 100%;
}
.edit tr {
border-bottom: none;
}
.edit tr td[scope="row"] {
height: auto;
line-height: 2em;
}
.mobile-hide {
display: none;
}
.applet-content {
table {
tr {
display: flex;
align-items: center;
}
}
}
#EditView {
#EditView_tabs {
input[type="text"]#notify_fromname {
width: 100%;
}
input[type="text"]#notify_fromaddress {
width: 100%;
}
input[type="text"]#mail_smtpserver {
width: 100%;
}
input[type="text"]#mail_smtpport {
width: 100%;
}
input[type="text"]#mail_smtpuser {
width: 100%;
}
input[type="password"]#mail_smtppass {
width: 100%;
}
}
}
}
}
/*Email Settings Ends here */