Search and Top Navigation
#8366 closed bug (duplicate)
Opened May 30, 2012 01:04PM UTC
Closed May 30, 2012 01:17PM UTC
Last modified May 30, 2012 01:17PM UTC
Dialog widget styling issue with scoped theme
Reported by: | frediani.adrien | Owned by: | |
---|---|---|---|
Priority: | minor | Milestone: | 1.9.0 |
Component: | ui.dialog | Version: | 1.8.20 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
There's a bug with dialog when using custom scoped-theme. It's easy to reproduce with the following test page snippet. I'm able to reproduce it on all browsers.
instructions:
1. Go to http://jqueryui.com/download/?themeParams=%3Fctl%3Dthemeroller
2. Select any theme, and open the 'advanced Theme Settings'.
3. Set the two following options: 'Version:': 1.8.20
'CSS Scope': '.custom_scope', 'Theme Folder Name:': 'custom_scope'
4. Download the theme.
5. Create a dir, copy you fresh custom_scope theme directory in it.
6. Create a index.html page with the following snippet:
<!DOCTYPE html> <html> <head> <title>Test</title> <meta charset="UTF-8"> <link rel="stylesheet" href="custom_scope/jquery-ui-1.8.20.custom.css" type="text/css" media="all" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <!-- Tested with same failure on latest jquery UI version (jquery-ui-1.8.20) --> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#dialogID').dialog(); }); </script> </head> <body> <div class="custom_scope"> <div id="dialogID">This is not styled correctly.</div> </div> </body> </html>
Result: No theme is applied to the popup.
Expected result: The custom_scope theme should have been applied to the dialog.