On Wed, Nov 3, 2010 at 8:09 PM, Ethan Jewett <[email protected]> wrote: > Hi all, > > This is the css/html change and images to make the update box expand and > contract as necessary when reply text is inserted, or if something else > changes in the future (like maybe we want an auto-expanding composition box > or something). > > Two things I need assistance with to finish this: > > 1. Testing, especially in IE. I can test in IE 8 and FF once it is deployed > to Stax, but if someone can test in IE7 that would be great. I've confirmed > it works in Chrome/webkit.
I can test with IE on Friday when I get back to work . > > 2. The image currently has a very slight gradient, which doesn't work with > background repetition. Can someone with more image editing chops than me > (and a real image editing program) make the three images single-color? > @Anne Can you help here? > Thanks! > Ethan > > On Wed, Nov 3, 2010 at 8:01 PM, <[email protected]> wrote: > >> Author: esjewett >> Date: Wed Nov 3 19:01:21 2010 >> New Revision: 1030614 >> >> URL: http://svn.apache.org/viewvc?rev=1030614&view=rev >> Log: >> [ESME-284] [ESME-296] Make message area expand and contract as needed. Also >> split bg-update.png as required. However, the split is not colored >> correctly, so we need to redo the image as a single color. >> >> Added: >> incubator/esme/trunk/server/src/main/webapp/images/bg-update-bot.png >> (with props) >> incubator/esme/trunk/server/src/main/webapp/images/bg-update-mid.png >> (with props) >> incubator/esme/trunk/server/src/main/webapp/images/bg-update-top.png >> (with props) >> Modified: >> incubator/esme/trunk/server/src/main/webapp/style/style.css >> >> incubator/esme/trunk/server/src/main/webapp/templates-hidden/message.html >> >> incubator/esme/trunk/server/src/main/webapp/templates-hidden/message_update_box.html >> >> Added: incubator/esme/trunk/server/src/main/webapp/images/bg-update-bot.png >> URL: >> http://svn.apache.org/viewvc/incubator/esme/trunk/server/src/main/webapp/images/bg-update-bot.png?rev=1030614&view=auto >> >> ============================================================================== >> Binary file - no diff available. >> >> Propchange: >> incubator/esme/trunk/server/src/main/webapp/images/bg-update-bot.png >> >> ------------------------------------------------------------------------------ >> svn:mime-type = application/octet-stream >> >> Added: incubator/esme/trunk/server/src/main/webapp/images/bg-update-mid.png >> URL: >> http://svn.apache.org/viewvc/incubator/esme/trunk/server/src/main/webapp/images/bg-update-mid.png?rev=1030614&view=auto >> >> ============================================================================== >> Binary file - no diff available. >> >> Propchange: >> incubator/esme/trunk/server/src/main/webapp/images/bg-update-mid.png >> >> ------------------------------------------------------------------------------ >> svn:mime-type = application/octet-stream >> >> Added: incubator/esme/trunk/server/src/main/webapp/images/bg-update-top.png >> URL: >> http://svn.apache.org/viewvc/incubator/esme/trunk/server/src/main/webapp/images/bg-update-top.png?rev=1030614&view=auto >> >> ============================================================================== >> Binary file - no diff available. >> >> Propchange: >> incubator/esme/trunk/server/src/main/webapp/images/bg-update-top.png >> >> ------------------------------------------------------------------------------ >> svn:mime-type = application/octet-stream >> >> Modified: incubator/esme/trunk/server/src/main/webapp/style/style.css >> URL: >> http://svn.apache.org/viewvc/incubator/esme/trunk/server/src/main/webapp/style/style.css?rev=1030614&r1=1030613&r2=1030614&view=diff >> >> ============================================================================== >> --- incubator/esme/trunk/server/src/main/webapp/style/style.css (original) >> +++ incubator/esme/trunk/server/src/main/webapp/style/style.css Wed Nov 3 >> 19:01:21 2010 >> @@ -230,7 +230,7 @@ label { >> } >> >> .post-form-row { >> - margin:7px 0; >> + margin-top:10px; >> } >> .line { >> margin-top:12px; >> @@ -238,22 +238,22 @@ label { >> } >> .login-btn, .update-btn, .submit-btn { >> float:right; >> -} >> -.share-select { >> - float:left; >> +} >> + >> +.share-select { >> + display:inline; >> } >> -.update-btn { >> + >> +.update-btn { >> + display:inline; >> margin-right:40px; >> -} >> -.update-btn, .share-select { >> - margin-top:10px; >> -} >> +} >> + >> #form-update label { >> font-weight:bold; >> color:#000; >> margin-top: 5px; >> - padding-right:5px; >> - float:left; >> + padding-right:5px; >> } >> select.inputBox2 { >> background-color:#FFFFFF !important; >> @@ -263,8 +263,7 @@ select.inputBox2 { >> padding:4px; >> } >> >> -textarea.inputBox2 { >> - float:left; >> +textarea.inputBox2 { >> background-color:#FFFFFF !important; >> border:1px solid #a7aaad; >> width:95%; >> @@ -406,15 +405,27 @@ ul.main-links { >> /* UPDATES >> >> *******************************************************************************/ >> #back-header { >> - margin-top:20px; >> - } >> + margin-top:20px; >> +} >> + >> .container-update { >> - >> - width: 550px; >> - height:185px; >> - padding:20px 30px; >> - background: url(../images/bg-update.png) no-repeat; >> - margin-bottom:20px; >> + width: 550px; >> + padding:10px 30px; >> + background: url(../images/bg-update-mid.png) repeat-y; >> +} >> + >> +.container-update-top { >> + height:15px; >> + width: 550px; >> + padding:0px 30px; >> + background: url(../images/bg-update-top.png) no-repeat; >> +} >> + >> +.container-update-bot { >> + height:20px; >> + width: 550px; >> + padding:0px 30px; >> + background: url(../images/bg-update-bot.png) no-repeat; >> } >> >> .gray-box { >> >> Modified: >> incubator/esme/trunk/server/src/main/webapp/templates-hidden/message.html >> URL: >> http://svn.apache.org/viewvc/incubator/esme/trunk/server/src/main/webapp/templates-hidden/message.html?rev=1030614&r1=1030613&r2=1030614&view=diff >> >> ============================================================================== >> --- >> incubator/esme/trunk/server/src/main/webapp/templates-hidden/message.html >> (original) >> +++ >> incubator/esme/trunk/server/src/main/webapp/templates-hidden/message.html >> Wed Nov 3 19:01:21 2010 >> @@ -20,11 +20,11 @@ >> >> >> <lift:surround with="base_top" at="left"> >> - <div id="back-header"> >> + <div id="back-header"> >> <lift:embed what="templates-hidden/message_update_box"/> >> </div> >> >> - <div class="container-aux"> >> + <div class="container-aux"> >> <lift:embed what="templates-hidden/timeline_personal"/> >> </div> >> </lift:surround> >> \ No newline at end of file >> >> Modified: >> incubator/esme/trunk/server/src/main/webapp/templates-hidden/message_update_box.html >> URL: >> http://svn.apache.org/viewvc/incubator/esme/trunk/server/src/main/webapp/templates-hidden/message_update_box.html?rev=1030614&r1=1030613&r2=1030614&view=diff >> >> ============================================================================== >> --- >> incubator/esme/trunk/server/src/main/webapp/templates-hidden/message_update_box.html >> (original) >> +++ >> incubator/esme/trunk/server/src/main/webapp/templates-hidden/message_update_box.html >> Wed Nov 3 19:01:21 2010 >> @@ -18,74 +18,78 @@ >> --> >> >> <!---UPDATE BOX --> >> -<div class="container-update"> >> - <h3 id="message_request"> >> - >> <lift:loc>ui_messages_message_label_message_request</lift:loc> >> - </h3> >> - <div id="form-update"> >> - <div id="messages"></div> >> - <div class="post-form-row"> >> - <textarea class="inputBox2 tipelement" title="Enter >> your status message here." id="vMsg" rows="5" cols="80%"></textarea> >> - <div class="row clear" style="display: none"> >> - <input id="vTag" style="width: 90%"/> >> - </div> >> - </div> >> - <div class="row clear" style="display: none" >> id="reply-to-div"> >> - <p> >> - >> <b><lift:loc>ui_messages_message_label_message_reply</lift:loc></b> >> - <span id="reply-to-span"><i></i></span> >> - <a href="javascript: clearReplyTo()"> >> - >> <lift:loc>ui_messages_message_label_message_remove_reply</lift:loc> >> - </a> >> - </p> >> - </div> >> - <div class="post-form-row"> >> - <div class="share-select"> >> - <label> >> - >> <lift:loc>ui_messages_share</lift:loc> >> - </label> >> - <select id="vPool" class="inputBox2 >> tipelement" title="Select the pool in which your message should be >> submitted"> >> - <option value="0"> >> - >> <lift:loc>ui_messages_message_label_message_pool_public</lift:loc> >> - </option> >> - <lift:UserSnip.accessPools/> >> - </select> >> - </div> >> - <div class="update-btn"> >> - <input type="image" >> onclick="javascript:post_msg();" src="images/btn-update.gif" /> >> - </div> >> - </div> >> - <script> >> - // <![CDATA[ >> - var currentConvNumber = 0; >> +<div> >> + <div class="container-update-top"></div> >> + <div class="container-update"> >> + <h3 id="message_request"> >> + >> <lift:loc>ui_messages_message_label_message_request</lift:loc> >> + </h3> >> + <div id="form-update"> >> + <div id="messages"></div> >> + <div class="post-form-row"> >> + <textarea class="inputBox2 tipelement" title="Enter >> your status message here." id="vMsg" rows="5" cols="80%"></textarea> >> + <div class="row clear" style="display: none"> >> + <input id="vTag" style="width: 90%"/> >> + </div> >> + </div> >> + <div class="row clear" style="display: none" >> id="reply-to-div"> >> + <p> >> + >> <b><lift:loc>ui_messages_message_label_message_reply</lift:loc></b> >> + <span id="reply-to-span"><i></i></span> >> + <a href="javascript: clearReplyTo()"> >> + >> <lift:loc>ui_messages_message_label_message_remove_reply</lift:loc> >> + </a> >> + </p> >> + </div> >> + <div class="post-form-row"> >> + <div class="share-select"> >> + <label> >> + >> <lift:loc>ui_messages_share</lift:loc> >> + </label> >> + <select id="vPool" class="inputBox2 >> tipelement" title="Select the pool in which your message should be >> submitted"> >> + <option value="0"> >> + >> <lift:loc>ui_messages_message_label_message_pool_public</lift:loc> >> + </option> >> + <lift:UserSnip.accessPools/> >> + </select> >> + </div> >> + <div class="update-btn"> >> + <input type="image" >> onclick="javascript:post_msg();" src="images/btn-update.gif" /> >> + </div> >> + </div> >> + <script> >> + // <![CDATA[ >> + var currentConvNumber = 0; >> >> - function setReplyTo(id, text, msgPool, >> author){ >> - currentConvNumber = id; >> - >> document.getElementById('reply-to-div').style.display = "block"; >> - >> jQuery('#message_request').html("Reply to: " + author); >> - var rep_msg = text >> - if (text.length > 50) >> - rep_msg = text.substr(0, 47) + >> "..." >> - >> jQuery('#reply-to-span').html(rep_msg); >> - jQuery('#vMsg').val("@" + author + " >> ") >> - jQuery('#vMsg').focus() >> - jQuery('#vPool').val(msgPool); >> - } >> + function setReplyTo(id, text, msgPool, >> author){ >> + currentConvNumber = id; >> + >> document.getElementById('reply-to-div').style.display = "block"; >> + >> jQuery('#message_request').html("Reply to: " + author); >> + var rep_msg = text >> + if (text.length > 50) >> + rep_msg = text.substr(0, 47) + >> "..." >> + >> jQuery('#reply-to-span').html(rep_msg); >> + jQuery('#vMsg').val("@" + author + >> " ") >> + jQuery('#vMsg').focus() >> + jQuery('#vPool').val(msgPool); >> + } >> >> - function clearReplyTo(){ >> - currentConvNumber = 0; >> - >> document.getElementById('reply-to-div').style.display = "none"; >> - jQuery('#vPool').val(0); >> - jQuery('#message_request').html('What are you working >> on?'); >> - } >> + function clearReplyTo(){ >> + currentConvNumber = 0; >> + >> document.getElementById('reply-to-div').style.display = "none"; >> + jQuery('#vPool').val(0); >> + jQuery('#message_request').html('What are you working >> on?'); >> + } >> >> - function clearResend(id){ >> - >> document.getElementById(id).style.display = "none" >> - } >> + function clearResend(id){ >> + >> document.getElementById(id).style.display = "none" >> + } >> >> - // ]]> >> - </script> >> - <lift:UserSnip.postScript/> >> - </div> >> + // ]]> >> + </script> >> + <lift:UserSnip.postScript/> >> + </div> >> + </div> >> + <div class="container-update-bot"></div> >> </div> >> <!--END UPDATE BOX--> >> \ No newline at end of file >> >> >> >
