PDA

View Full Version : ExtJS Theme "Slate" 3.1.1



egilas
16 Feb 2010, 6:19 AM
Hi all!

ExtJS theme "Slate" ported to ExtJS version 3.1.1.

Tested with almost all of the examples, even some of the complex ones, and I have not seen any issues with this yet.

After spending a few days on this, I am satisfied enough with it to share it with you all!

Please report any bugs/graphical errors you might encounter!


Feel free to post screenshots, I didn't have the time to find an image host atm..

- Re-worked a lot of the graphics
- Re-written a lot of the CSS to make it compatible with ExtJS 3.1.1
- Re-worked the progress bar gradient
- Fixed HTML editor header (image was set to 0%)
- Fixed bottom tabs
- Tweaked buttons
- BONUS: New slider buttons!

Enjoy!

jheid
16 Feb 2010, 8:58 AM
Great!!!

But I do have some problems with combo boxes... It seems there's no background on the items when the popup appears so you can see all the content below... And the grid seems to be strange....

egilas
16 Feb 2010, 12:09 PM
Great!!!

But I do have some problems with combo boxes... It seems there's no background on the items when the popup appears so you can see all the content below... And the grid seems to be strange....

Can you post a screenshot? Is it one of the included demos? The combo boxes in the demo seems fine to me..


Thank you.

agorman
16 Feb 2010, 12:50 PM
Fantasic work. I just put this into a project that uses exjts 3.0.3 and it's working quite well.

jheid
16 Feb 2010, 1:03 PM
Can you post a screenshot? Is it one of the included demos? The combo boxes in the demo seems fine to me..
Thank you.

Maybe I'm doing something wrong, but here's the screenshot.
I downloaded ExtJS 3.1.1 and changed the file examples/form/combos.html to


<!-- link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" / -->
<!-- link rel="stylesheet" type="text/css" href="../../resources/css/xtheme-gray.css" / -->
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all-notheme.css" />
<link rel="stylesheet" type="text/css" href="../../resources/css/xtheme-slate.css" />

jheid
16 Feb 2010, 1:09 PM
And this is a screenshot of the grid (examples/grid/array-grid.html). Doesn't look perfect with those black lines IMHO.

egilas
16 Feb 2010, 1:19 PM
Maybe I'm doing something wrong, but here's the screenshot.
I downloaded ExtJS 3.1.1 and changed the file examples/form/combos.html to


<!-- link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" / -->
<!-- link rel="stylesheet" type="text/css" href="../../resources/css/xtheme-gray.css" / -->
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all-notheme.css" />
<link rel="stylesheet" type="text/css" href="../../resources/css/xtheme-slate.css" />


Hi.

Well, the screenshots didn't look right, no.. However, can you try using "ext-all.css" instead of "ext-all-notheme.css" ? Slate is using themes, but the "xtheme-slate.css" is used only to override default settings..

Please have a go with this change and let me know. =)



<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="../../resources/css/xtheme-slate.css" />

jheid
16 Feb 2010, 1:26 PM
Hi.

Well, the screenshots didn't look right, no.. However, can you try using "ext-all.css" instead of "ext-all-notheme.css" ? Slate is using themes, but the "xtheme-slate.css" is used only to override default settings..

Please have a go with this change and let me know. =)



<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="../../resources/css/xtheme-slate.css" />


Okay, that's it. Thanks.

wemerson.januario
16 Feb 2010, 6:42 PM
Humm, I have tested and everything is ok. Thanks for sharing.

berniesaurus
24 Feb 2010, 12:34 PM
Added this CSS to fix a little bug in menu:


.x-menu-list-item {
border-left:1px solid #e5e8ea;
border-right:1px solid #e9ecef;
}

Now on hover a menu item, the text doesn't jump anymore left and right.

wemerson.januario
24 Feb 2010, 7:26 PM
nice

syl_via38
25 Feb 2010, 5:47 AM
Hello,

Thanks a lot for this sharing

Sylvia

andrejdo
26 Feb 2010, 1:21 AM
Thanks for theme sharing. Looks pretty cool.

Whether planning to change the picture to this style?

.x-tbar-loading {
background-image:url(../images/default/grid/refresh.gif) !important;
}

wm003
26 Feb 2010, 2:24 AM
Thanks for sharing, looks good to me after some testpages. Keep it up:)

Frank
12 Apr 2010, 9:05 PM
Thanks!:)

jchris
19 Apr 2010, 12:12 PM
Thanks :)

Use this refresh.gif:


.x-tbar-loading{
background-image:url(../images/slate/grid/refresh.gif)!important;
}

djMaxM
24 May 2010, 7:08 AM
Not that it should work necessarily, but slate seems to really foul up the FileUploadFIeld example. The regular dialog buttons break too, and that confuses me more than the upload field itself having problems.

smcguire36
14 Dec 2010, 8:14 AM
Are there any updates to this theme for 3.3.1?

--Stewart McGuire