<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
	<title>jQuery Grid Plugin - jqGrid - Topic: small incompatibilities to jQuery UI Theme</title>
	<link>http://www.trirand.com/blog/?page_id=393/bugs/small-incompatibilities-to-jquery-ui-theme</link>
	<description><![CDATA[Grid plugin]]></description>
	<generator>Simple:Press Version 5.7.5.3</generator>
	<atom:link href="http://www.trirand.com/blog/?page_id=393/bugs/small-incompatibilities-to-jquery-ui-theme/rss" rel="self" type="application/rss+xml" />
        <item>
        	<title>tony on small incompatibilities to jQuery UI Theme</title>
        	<link>http://www.trirand.com/blog/?page_id=393/bugs/small-incompatibilities-to-jquery-ui-theme#p24262</link>
        	<category>Bugs</category>
        	<guid isPermaLink="true">http://www.trirand.com/blog/?page_id=393/bugs/small-incompatibilities-to-jquery-ui-theme#p24262</guid>
        	        	<description><![CDATA[<p>Hello Oleg,</p>
<p>Thanks for all improvemets fixes and suggestions.</p>
<p>As you can see today is a bug fix day for jqGrid <img class="spSmiley" style="margin:0" title="Wink" src="/blog/wp-content/forum-smileys/sf-wink.gif" alt="Wink" /></p>
</p>
<p>Tony</p>
]]></description>
        	        	<pubDate>Sun, 14 Aug 2011 12:35:26 +0300</pubDate>
        </item>
        <item>
        	<title>OlegK on small incompatibilities to jQuery UI Theme</title>
        	<link>http://www.trirand.com/blog/?page_id=393/bugs/small-incompatibilities-to-jquery-ui-theme#p23815</link>
        	<category>Bugs</category>
        	<guid isPermaLink="true">http://www.trirand.com/blog/?page_id=393/bugs/small-incompatibilities-to-jquery-ui-theme#p23815</guid>
        	        	<description><![CDATA[<p>Hello Tony,</p>
<p><a href="http://stackoverflow.com/questions/6454839/jqgrid-form-edit-overlay-not-the-same-as-theme/6455281#6455281" target="_blank">one question</a> on the stackoverflow took my attention at the problem of small incompatibilities of jqGrid to jQuery UI Theme.</p>
<p>If you look inside of <strong>ui.jqgrid.css</strong> you will find two places where the <strong>background-color</strong>&#160;style are defined explicitly:</p>
<p><input type='button' class='sfcodeselect' name='sfselectit3201' value='Select Code' data-codeid='sfcode3201' /></p>
<div class='sfcode' id='sfcode3201'>.jqmOverlay { background-color: #000; }</div>
<p>and</p>
<p><input type='button' class='sfcodeselect' name='sfselectit7661' value='Select Code' data-codeid='sfcode7661' /></p>
<div class='sfcode' id='sfcode7661'>.ui-jqgrid .ui-jqgrid-resize-mark { width:2px; left:0; background-color:#777; cursor: e-resize; cursor: col-resize; position:absolute; top:0; height:100px; overflow:hidden; display:none;	border:0 none;}</div>
<p>If one color is good for <em>Smoothness</em>&#160;theme for example it will be not so good for <em>UI darkness</em>, <em>Hot sneaks</em> or <em>Pepper Grinder</em>&#160;theme. Exactly because of that the <strong>ui-widget-overlay</strong> class from the jQuery UI Theme defines the background collor and the sometimes the background image of the overlay. For example like</p>
<p><input type='button' class='sfcodeselect' name='sfselectit7282' value='Select Code' data-codeid='sfcode7282' /></p>
<div class='sfcode' id='sfcode7282'>.ui-widget-overlay { background: #f7f7ba url(images/ui-bg_white-lines_85_f7f7ba_40x100.png) 50% 50% repeat; opacity: .80;filter:Alpha(Opacity=80); }</div>
<p>from the <a href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/hot-sneaks/jquery-ui.css" target="_blank">jquery-ui.css</a> or <a href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/hot-sneaks/jquery.ui.theme.css" target="_blank">jquery.ui.theme.css</a>. The class&#160;<strong>ui-widget-overlay</strong>&#160;are used already by jqGrid in the most cases, but not in with jqModal.js.</p>
<p>So my first suggestion is to set <strong>overlayClass</strong> parameter of <strong>$.fn.jqm</strong> method to &#39;ui-widget-overlay&#39; or &#39;ui-widget-overlay jqgrid-overlay&#39;. It sees to me that adding the parameter in the first statement of&#160;<a href="https://github.com/tonytomov/jqGrid/blob/v4.1.1/js/grid.common.js#L158" target="_blank">viewModal</a>&#160;(<strong>o = $.extend({...</strong>) could solve the problem. Of cause one should remove the jqmOverlay from the <strong>ui.jqgrid.css</strong>.</p>
<p>I don&#39;t know what is the best solution for&#160;the <strong>.ui-jqgrid .ui-jqgrid-resize-mark</strong>, but I am sure that <strong>background-color</strong>&#160;attribute should be removed and the border color from the theme should be used. Probably no background color is really needed be defined or one needs to use just some additional class from the standard theme class at the div definition from <a href="https://github.com/tonytomov/jqGrid/blob/v4.1.1/js/grid.base.js#L2097" target="_blank">here</a>. I have not enough experience in the subject, but I am sure that you Tony will find the solution of the problem yourself.</p>
<p>Best regards<br />Oleg</p>
]]></description>
        	        	<pubDate>Thu, 30 Jun 2011 15:05:29 +0300</pubDate>
        </item>
</channel>
</rss>