PDA

View Full Version : [CLOSED] Background button on click was turn to red after upgrade from SVN (version 2.2.0.742)



schneider.felipe
Mar 26, 2013, 12:44 PM
Tonight I have updated my application to use the last version of Ext.Net (2.2.0.742), and the after that when I click on any button, the button background turn to red:

5909

Whats happen?

Thanks,

Felipe Schneider

Daniil
Mar 26, 2013, 1:41 PM
Hi Felipe,

Interesting. I have not noticed such the behavior.

Could you, please, provide a test case to reproduce?

schneider.felipe
Mar 26, 2013, 2:28 PM

geoffrey.mcgill
Mar 26, 2013, 2:28 PM
More than likely you have a custom css style defined somewhere in your .css that is globally affecting elements. I'd search through your .css to find the css class that is causing the conflict.

If this is not the cause, posting a sample demonstrating how to reproduce will help us track down the problem.

Vladimir
Mar 26, 2013, 2:43 PM
It is ExtJS bug, reproducible under IE with gray theme
IE doesn't support css gradients and ExtJS uses incorrect images to replace css gradients
This issue should be fixed by Sencha in the next release

Vladimir
Mar 26, 2013, 2:56 PM
We commited fixed images, please update from SVN and retest (might need to clear IE temp files cache)

schneider.felipe
Mar 26, 2013, 4:09 PM
Thanks Vladimir, this is exactly the problem. Can you fix with new images, when I use the "flat=true" option too?

Thanks,

Felipe.

Vladimir
Mar 26, 2013, 4:59 PM
Thanks Vladimir, this is exactly the problem. Can you fix with new images, when I use the "flat=true" option too?

Can you post a sample demonstrates the issue? I was not able reproduce red backbackground after the images updating

schneider.felipe
Mar 26, 2013, 7:40 PM

Vladimir
Mar 26, 2013, 7:43 PM
You should not use Flat property in the toolbar because button is already flat inside a toolbar

schneider.felipe
Mar 26, 2013, 7:59 PM
Youre right, my example was wrong. See the right example, so you can reproduce the error:

Please note that I try with predefined icon, and the problem was the same.



<ext:TabPanel ID="tabAplicativos" runat="server" Border="false">
<Items>
<ext:Panel ID="tabTeste" runat="server" Title="Aplicativos" Layout="HBoxLayout"
Padding="10" Border="false">
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Middle" Pack="Start" />
</LayoutConfig>
<Items>
<ext:Button ID="btnM01A" runat="server" Scale="Large" IconAlign="Top" Flat="true"
IconUrl="/Img/icon_rfb_32x32.png" Text="Teste">
<DirectEvents>
<Click OnEvent="RunM01A">
<EventMask ShowMask="true" Msg="Aguarde..." MinDelay="100" />
</Click>
</DirectEvents>
</ext:Button>
</Items>
</ext:Panel>
</Items>
</ext:TabPanel>

Daniil
Mar 27, 2013, 4:41 AM
I can't reproduce.

Let's try to make a full standalone ASPX page to reproduce the problem.

Does the following page reproduce the problem on your side?

What exactly a browser and an OS are you testing with?

Also does the issue appear at bootstrap or does it need to hover the Button?

Example

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<!DOCTYPE html>
<html>
<head runat="server">
<title>Ext.NET v2 Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" Theme="Gray" />
<ext:TabPanel runat="server">
<Items>
<ext:Panel runat="server" Title="Tab">
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Middle" Pack="Start" />
</LayoutConfig>
<Items>
<ext:Button
runat="server"
Text="Test"
Scale="Large"
Icon="Accept"
IconAlign="Top"
Flat="true" />
</Items>
</ext:Panel>
</Items>
</ext:TabPanel>
</form>
</body>
</html>

Baidaly
Mar 27, 2013, 10:56 PM
Hello!

I was able to reproduce with the following example:



<%@ Page Language="C#" %>

<%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>

<!DOCTYPE html>

<html>
<head runat="server">
<title>Ext.NET Examples</title>
</head>
<body>
<ext:ResourceManager runat="server"></ext:ResourceManager>
<ext:TabPanel ID="tabAplicativos" runat="server" Border="false">
<Items>
<ext:Panel ID="tabTeste" runat="server" Title="Aplicativos" Layout="HBoxLayout"
Padding="10" Border="false">
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Middle" Pack="Start" />
</LayoutConfig>
<Items>
<ext:Button ID="btnM01A" runat="server" Scale="Large" IconAlign="Top" Flat="true"
Text="Teste">
</ext:Button>
</Items>
</ext:Panel>
</Items>
</ext:TabPanel>
</body>
</html>


Press left mouse button on the button: 5916

You can change it using the following CSS:


<style>
.x-btn-default-toolbar-large-menu-active, .x-btn-default-toolbar-large-pressed {
background-image: -moz-linear-gradient(center top , #D6D6D6, #DCDCDC 48%, #f1f1f1 52%, #f1f1f1) !important;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d6d6d6), color-stop(48%, #dcdcdc), color-stop(52%, #f1f1f1), color-stop(100%, #f1f1f1));
background-image: -webkit-linear-gradient(top, #d6d6d6, #dcdcdc 48%, #f1f1f1 52%, #f1f1f1);
background-image: -moz-linear-gradient(top, #d6d6d6, #dcdcdc 48%, #f1f1f1 52%, #f1f1f1);
background-image: -o-linear-gradient(top, #d6d6d6, #dcdcdc 48%, #f1f1f1 52%, #f1f1f1);
background-image: linear-gradient(top, #d6d6d6, #dcdcdc 48%, #f1f1f1 52%, #f1f1f1);
}
</style>

However, it seems that with IE it doesn't work.

We are investigating.

Vladimir
Mar 27, 2013, 11:52 PM
Fixed in SVN, please update and retest