Commit 3f98995a authored by colemanw's avatar colemanw

CRM-15789 - Cleanup editable icons/styles

parent 52604b19
......@@ -217,38 +217,6 @@ input.crm-form-entityref {
color: #3E3E3E;
}
.crm-container .replace-plain,
.crm-container textarea,
.crm-container select.crm-form-multiselect {
border: 1px solid #999;
}
.crm-container .replace-plain {
cursor: pointer;
background: rgba(255,255,255,0.6);
min-height: 2em;
position: relative;
padding: 2px;
}
.crm-container .replace-plain:focus,
.crm-container .replace-plain:hover {
box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
background: rgba(255,255,255,0.8);
}
.crm-container .replace-plain .icon.ui-icon-pencil {
position: absolute;
top: .5em;
right: .5em;
}
.crm-container .replace-plain a:active .icon.ui-icon-pencil,
.crm-container .replace-plain:focus .icon.ui-icon-pencil,
.crm-container .replace-plain:hover .icon.ui-icon-pencil {
background-image: url("../i/icons/jquery-ui-2786C2.png");
}
/*
** class for hiding the text box;
it is used in the OtherActivity template
......@@ -715,13 +683,6 @@ input.crm-form-entityref {
padding: 4px;
}
.crm-container div.view-data {
padding: .25em .5em .25em .5em;
border: 1px solid DimGray;
width: auto;
background-color: #ffffff;
}
.crm-container .crm-footer {
font-size: 0.8em;
}
......@@ -3995,6 +3956,40 @@ div.m ul#civicrm-menu,
width: 100%;
}
/* editable placeholder containers - share some styles with crm-editable below */
.crm-container .replace-plain,
.crm-container textarea,
.crm-container select.crm-form-multiselect {
border: 1px solid #999;
}
.crm-container .replace-plain {
cursor: pointer;
background: rgba(255,255,255,0.6);
min-height: 1.4em;
position: relative;
padding: .4em 1.5em .3em .4em;
}
.crm-container .replace-plain p {
padding: .2em 0;
margin: 0;
}
.crm-container .replace-plain:focus,
.crm-container .replace-plain:hover {
box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
background: rgba(255,255,255,0.8);
}
.crm-container .replace-plain:before {
content: "";
position: absolute;
top: .4em;
right: .5em;
}
/* in place edit */
.crm-container .crm-editable-enabled {
white-space: nowrap;
......@@ -4016,21 +4011,25 @@ div.m ul#civicrm-menu,
}
.crm-container span.crm-editable-textarea-enabled {
display: inline-block !important;
width: 96%;
}
.crm-container span.crm-editable-enabled {
display: inline-block !important;
}
.crm-container .crm-editable-placeholder {
.crm-container .crm-editable-placeholder,
.crm-container .replace-plain:before {
background: url("../i/icons/jquery-ui-3E3E3E.png") -66px -114px no-repeat;
text-indent: -10000px;
display: block;
width: 12px;
height: 16px;
width: 16px;
opacity: .5;
}
.crm-container .replace-plain a:active:before,
.crm-container .replace-plain:focus:before,
.crm-container .replace-plain:hover:before,
.crm-container .crm-editable-enabled:hover .crm-editable-placeholder {
background-image: url("../i/icons/jquery-ui-2786C2.png");
opacity: 1;
......@@ -4041,12 +4040,6 @@ div.m ul#civicrm-menu,
opacity: 0.8;
}
.crm-container .crm-editable-error,
.crm-container .crm-editable-error input {
background: red!important;
opacity: 0.8;
}
.crm-container h2.crm-editable-enabled input {
min-height: 1.4em;
}
......@@ -4071,15 +4064,12 @@ div.m ul#civicrm-menu,
.crm-editable-form button {
position: absolute;
bottom: -22px;
left: 0;
text-align: center;
height: 23px;
width: 32px;
}
.crm-editable-form button[type=submit] {
left: 0;
}
.crm-editable-form button[type=cancel] {
left: 32px;
}
......
{*
+--------------------------------------------------------------------+
| CiviCRM version 4.6 |
+--------------------------------------------------------------------+
| Copyright CiviCRM LLC (c) 2004-2014 |
+--------------------------------------------------------------------+
| This file is a part of CiviCRM. |
| |
| CiviCRM is free software; you can copy, modify, and distribute it |
| under the terms of the GNU Affero General Public License |
| Version 3, 19 November 2007 and the CiviCRM Licensing Exception. |
| |
| CiviCRM is distributed in the hope that it will be useful, but |
| WITHOUT ANY WARRANTY; without even the implied warranty of |
| MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. |
| See the GNU Affero General Public License for more details. |
| |
| You should have received a copy of the GNU Affero General Public |
| License and the CiviCRM Licensing Exception along |
| with this program; if not, contact CiviCRM LLC |
| at info[AT]civicrm[DOT]org. If you have questions about the |
| GNU Affero General Public License or the licensing of CiviCRM, |
| see the CiviCRM license FAQ at http://civicrm.org/licensing |
+--------------------------------------------------------------------+
*}
{literal}
<script type="text/javascript">
CRM.$(function($) {
var $form = $('form.{/literal}{$form.formClass}{literal}');
$('#postal_greeting_id, #addressee_id, #email_greeting_id', $form).change(function() {
var fldName = $(this).attr('id');
if ($(this).val() == 4) {
$("#greetings1, #greetings2", $form).show();
$("#" + fldName + "_html, #" + fldName + "_label", $form).show();
} else {
$("#" + fldName + "_html, #" + fldName + "_label", $form).hide();
$("#" + fldName.slice(0, -3) + "_custom", $form).val('');
}
});
$('.replace-plain[data-id]', $form).click(function() {
var element = $(this).data('id');
$(this).hide();
$('#' + element, $form).show();
var fldName = '#' + element + '_id';
if ($(fldName, $form).val() == 4) {
$("#greetings1, #greetings2", $form).show();
$(fldName + "_html, " + fldName + "_label", $form).show();
}
});
});
</script>
{/literal}
......@@ -57,7 +57,9 @@
<td>
<span id="email_greeting" {if !empty($email_greeting_display) and $action eq 2} class="hiddenElement"{/if}>{$form.email_greeting_id.html|crmAddClass:big}</span>
{if !empty($email_greeting_display) and $action eq 2}
<div id="email_greeting_display" class="view-data">{$email_greeting_display}&nbsp;&nbsp;<a href="#" onclick="showGreeting('email_greeting');return false;"><img src="{$config->resourceBase}i/edit.png" border="0" title="{ts}Edit{/ts}"></a></div>
<div data-id="email_greeting" class="replace-plain" title="{ts}Click to edit{/ts}">
{$email_greeting_display}
</div>
{/if}
</td>
{/if}
......@@ -65,7 +67,9 @@
<td>
<span id="postal_greeting" {if !empty($postal_greeting_display) and $action eq 2} class="hiddenElement"{/if}>{$form.postal_greeting_id.html|crmAddClass:big}</span>
{if !empty($postal_greeting_display) and $action eq 2}
<div id="postal_greeting_display" class="view-data">{$postal_greeting_display}&nbsp;&nbsp;<a href="#" onclick="showGreeting('postal_greeting');return false;"><img src="{$config->resourceBase}i/edit.png" border="0" title="{ts}Edit{/ts}"></a></div>
<div data-id="postal_greeting" class="replace-plain" title="{ts}Click to edit{/ts}">
{$postal_greeting_display}
</div>
{/if}
</td>
{/if}
......@@ -73,7 +77,9 @@
<td>
<span id="addressee" {if !empty($addressee_display) and $action eq 2} class="hiddenElement"{/if}>{$form.addressee_id.html|crmAddClass:big}</span>
{if !empty($addressee_display) and $action eq 2}
<div id="addressee_display" class="view-data">{$addressee_display}&nbsp;&nbsp;<a href="#" onclick="showGreeting('addressee');return false;"><img src="{$config->resourceBase}i/edit.png" border="0" title="{ts}Edit{/ts}"></a></div>
<div data-id="addressee" class="replace-plain" title="{ts}Click to edit{/ts}">
{$addressee_display}
</div>
{/if}
</td>
{/if}
......@@ -125,43 +131,4 @@
</table>
</div><!-- /.crm-accordion-body -->
</div><!-- /.crm-accordion-wrapper -->
{literal}
<script type="text/javascript">
CRM.$(function($) {
var fields = new Array( 'postal_greeting', 'addressee', 'email_greeting');
for ( var i = 0; i < 3; i++ ) {
$( "#" + fields[i] + "_id").change( function( ) {
var fldName = $(this).attr( 'id' );
if ( $(this).val( ) == 4 ) {
$("#greetings1").show( );
$("#greetings2").show( );
$( "#" + fldName + "_html").show( );
$( "#" + fldName + "_label").show( );
} else {
$( "#" + fldName + "_html").hide( );
$( "#" + fldName + "_label").hide( );
$( "#" + fldName.slice(0, -3) + "_custom" ).val('');
}
});
}
});
function showGreeting( element ) {
cj("#" + element ).show( );
cj("#" + element + '_display' ).hide( );
// TO DO fix for custom greeting
var fldName = '#' + element + '_id';
if ( cj( fldName ).val( ) == 4 ) {
cj("#greetings1").show( );
cj("#greetings2").show( );
cj( fldName + "_html").show( );
cj( fldName + "_label").show( );
}
}
</script>
{/literal}
{include file="CRM/Contact/Form/Edit/CommunicationPreferences.js.tpl"}
......@@ -65,9 +65,10 @@
<div class="crm-summary-row">
<div class="crm-label">
{$form.preferred_mail_format.label}
{help id="id-emailFormat" file="CRM/Contact/Form/Contact.hlp"}
</div>
<div class="crm-content">
{$form.preferred_mail_format.html} {help id="id-emailFormat" file="CRM/Contact/Form/Contact.hlp"}
{$form.preferred_mail_format.html}
</div>
</div>
{/if}
......@@ -90,9 +91,11 @@
<span id="email_greeting" {if !empty($email_greeting_display)} class="hiddenElement"{/if}>
{$form.email_greeting_id.html|crmAddClass:big}
</span>
<span id="email_greeting_display" class="view-data">
{$email_greeting_display}&nbsp;&nbsp;<a href="#" onclick="showGreeting('email_greeting');return false;"><img src="{$config->resourceBase}i/edit.png" border="0" title="{ts}Edit{/ts}"></a>
</span>
{if !empty($email_greeting_display)}
<div data-id="email_greeting" class="replace-plain big" title="{ts}Click to edit{/ts}">
{$email_greeting_display}
</div>
{/if}
{if !empty($form.email_greeting_custom)}
<span id="email_greeting_id_html" class="hiddenElement">
<br/>{$form.email_greeting_custom.html|crmAddClass:big}
......@@ -110,9 +113,11 @@
<span id="postal_greeting" {if !empty($postal_greeting_display)} class="hiddenElement"{/if}>
{$form.postal_greeting_id.html|crmAddClass:big}
</span>
<span id="postal_greeting_display" class="view-data">
{$postal_greeting_display}&nbsp;&nbsp;<a href="#" onclick="showGreeting('postal_greeting');return false;"><img src="{$config->resourceBase}i/edit.png" border="0" title="{ts}Edit{/ts}"></a>
</span>
{if !empty($postal_greeting_display)}
<div data-id="postal_greeting" class="replace-plain big" title="{ts}Click to edit{/ts}">
{$postal_greeting_display}
</div>
{/if}
{if !empty($form.postal_greeting_custom)}
<span id="postal_greeting_id_html" class="hiddenElement">
<br/>{$form.postal_greeting_custom.html|crmAddClass:big}
......@@ -129,9 +134,11 @@
<span id="addressee" {if !empty($addressee_display)} class="hiddenElement"{/if}>
{$form.addressee_id.html|crmAddClass:big}
</span>
<span id="addressee_display" class="view-data">
{$addressee_display}&nbsp;&nbsp;<a href="#" onclick="showGreeting('addressee');return false;"><img src="{$config->resourceBase}i/edit.png" border="0" title="{ts}Edit{/ts}"></a>
</span>
{if !empty($addressee_display)}
<div data-id="addressee" class="replace-plain big" title="{ts}Click to edit{/ts}">
{$addressee_display}
</div>
{/if}
{if !empty($form.addressee_custom)}
<span id="addressee_id_html" class="hiddenElement">
<br/>{$form.addressee_custom.html|crmAddClass:big}
......@@ -143,41 +150,4 @@
</div>
</div>
{literal}
<script type="text/javascript">
CRM.$(function($) {
var fields = ['postal_greeting', 'addressee', 'email_greeting'];
for ( var i = 0; i < 3; i++ ) {
$( "#" + fields[i] + "_id").change( function( ) {
var fldName = $(this).attr( 'id' );
if ( $(this).val( ) == 4 ) {
$("#greetings1").show( );
$("#greetings2").show( );
$( "#" + fldName + "_html").show( );
$( "#" + fldName + "_label").show( );
} else {
$( "#" + fldName + "_html").hide( );
$( "#" + fldName + "_label").hide( );
$( "#" + fldName.slice(0, -3) + "_custom" ).val('');
}
});
}
});
function showGreeting( element ) {
cj("#" + element ).show( );
cj("#" + element + '_display' ).hide( );
// TO DO fix for custom greeting
var fldName = '#' + element + '_id';
if ( cj( fldName ).val( ) == 4 ) {
cj("#greetings1").show( );
cj("#greetings2").show( );
cj( fldName + "_html").show( );
cj( fldName + "_label").show( );
}
}
</script>
{/literal}
{include file="CRM/Contact/Form/Edit/CommunicationPreferences.js.tpl"}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment