PDA

View Full Version : ST2.2 and phonegap 2.7.0 style problem



kodak
30 May 2013, 1:57 PM
Hi!

Iam trying to package my app with the sencha-cordova-builder (https://github.com/bricemason/sencha-cordova-builder).
Iam using Sencha Touch 2.2.0 and Phonegap 2.7.
The build works without problems and I can start it with the ios simulator.

But my styles from the app.css are missing.
The strange thing is that the app.css gets loaded but I see just some styles.

Styles with selectors like:


.x-list-item .x-list-disclosure

or

.x-tabbar-dark.x-docked-bottom .x-tab
are getting displayed but not my own.

To select the elements Im using the cls or id property.
Here is an example:



.topbar{
background-size: 320px 46px;
background: url('../images/topbar.png');
}
.gwitext {
position: relative;
top: -10px;
text-align: center;
font-size: 80%;
font-family: $font-family;
}
#box {
position: relative;
width: 280px;
height: 10px;
border-top: 2px solid #918d8f;
-webkit-opacity: 0.8;
}




All resources are getting copied and the app.css gets loaded (as I said, I can see some changes but not all).
When I navigate with Chrome to the index.html in the build folder everything looks good.

I think that there is some problem with my divs and/or selectors... but I have no idea where to start.
Any help would be appreciated!

Thanks!
Kodak

shepsii
31 May 2013, 5:53 AM
Does it do this just in the simulator with phonegap? Or do your packaged apps in the desktop browser also have this issue?

kodak
31 May 2013, 2:42 PM
Just in the simulator with phonegap :-/

kodak
3 Jun 2013, 2:44 PM
Got it working.

I think there was a problem with sencha cmd. I installed it new and my css worked.
After that I had still some problems with custom fonts (icons).
Then I did the following:
- added the fonts to the directory /resources/fonts
- added the fonts in app.scss (src: ../fonts/fontname.xx)
- added the fonts path ("resources/fonts") to the resource section in app.json

After that, when I now build the app with sencha-cordova-builder and phonegap 2.7.0 with the command "sencha app build package" the css and fonts are working correct.