Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

improved styling (experimental at this time)

Signed-off-by: Jonathan Fielding <j.fielding@me.com>
  • Loading branch information...
commit d894f7118f19d119101c7012240e62359ebe5426 1 parent dc9fafd
Jonathan Fielding authored
20 assets/js/AppBoilerplate.js
View
@@ -30,18 +30,28 @@ var app = function(){
app.device.type = 'phone'; //Assume is phone as I cant see any Windows Mobile phones on market
}
};
-
+
+ var styleFix = function(){
+ //There is some functionality in jQuery Mobile which is not App like, we fix this in both the CSS and JS
+ $('.ui-footer').removeClass('slideup');
+ $('.ui-header').removeClass('slidedown');
+ }
+
return {
'url_path': '',
'theme':'',
'device':{'os':'','type':''},
init: function(event, eventData){
+ //Initialise the application page
var module_name = $(eventData.toPage).attr('data-module');
var javascript_required = module_name +'.js'
if(window.location.pathname.match('modules')){
app.url_path = '../../';
}
+ else{
+ app.url_path = '';
+ }
getDevice();
@@ -50,12 +60,15 @@ var app = function(){
add_plugins.init();
});
+ //Styling
app.updateTheme();
+ styleFix();
//Each module should have a javascript file, we pull this in here
require([javascript_required],function(){
window[module_name].init(eventData);
- });
+ });
+
},
updateTheme: function(){
//load theme
@@ -77,4 +90,5 @@ var app = function(){
}();
-$(document.body).live('pagechange', app.init);
+$(document.body).live('pagechange', app.init);
+
9 modules/sample/index.html
View
@@ -53,7 +53,14 @@
</div><!-- /content -->
<div data-role="footer" data-position="fixed" data-fullscreen="true">
- <h1>based on AppBoilerplate</h1>
+ <div data-role="navbar">
+ <ul>
+ <li><a href="index.html" data-icon="search" class="ui-btn-active ui-state-persist" data-transition="none">Search</a></li>
+ <li><a href="fav.html" id="favorites" data-icon="custom" data-transition="none">Favorites</a></li>
+ <li><a href="basket.html" id="basket" data-icon="custom" data-transition="none">Basket</a></li>
+ <li><a href="more.html" id="more" data-icon="custom" data-transition="none">More</a></li>
+ </ul>
+ </div><!-- /navbar -->
</div>
</div><!-- /page -->
2  modules/sample/sample.js
View
@@ -7,7 +7,7 @@ var sample = function(){
init: function(eventData){
//Handle receiving messages from the previous page
if(eventData.options.data){
- alert(eventData.options.data);
+ console.log(eventData.options.data);
}
}
}
3  plugins/add_plugins.js
View
@@ -3,12 +3,13 @@ var add_plugins = function(){
init: function(){
//add all plugins to the app
- require([app.url_path + 'plugins/sample_plugin/sample_plugin.js',app.url_path + 'plugins/theme_switcher/theme_switcher.js'],function(){
+ require([app.url_path + 'plugins/sample_plugin/sample_plugin.js',app.url_path + 'plugins/theme_switcher/theme_switcher.js',app.url_path + 'plugins/notify/notify.js'],function(){
app.sample_plugin.init();
app.theme_switcher.default_theme = 'AppBoilerplate';
app.theme_switcher.android_theme = 'Android';
app.theme_switcher.iOS_theme = 'iOS';
app.theme_switcher.init();
+ app.notify.init();
});
}
};
12 plugins/notify/notify.js
View
@@ -0,0 +1,12 @@
+app.notify = function(){
+ var privateProperties = {
+
+ };
+
+ return {
+ init: function(){
+ console.log('test');
+ }
+ };
+
+}();
53 themes/iOS/style.css
View
@@ -647,7 +647,7 @@ input.ui-input-text, .ui-input-search {
}
.ui-footer .ui-btn-inner {
border-color: #434343;
- padding-top: 40px !important;
+ padding: 23px 0px 3px!important;
}
.ui-footer .ui-btn-text {
font-size: 10px;
@@ -657,6 +657,7 @@ input.ui-input-text, .ui-input-search {
width: 32px;
height: 32px;
margin-left: -16px;
+ top: 0px;
}
#tabA .ui-icon {
background: url(images/tabSprite.png) 0 0 no-repeat;
@@ -682,20 +683,46 @@ CSS fix for not being able to see top content or
bottom content in fullscreen mode
*/
+.ui-content .ui-listview-inset {
+ margin: 10px 0;
+}
+
+.ui-content .ui-listview:not(.ui-listview-inset) {
+ margin: 10px -15px;
+}
+
+.ui-content .ui-listview:first-child{
+ margin: -15px -15px 10px;
+}
+
+.ui-content .ui-listview:last-child{
+ margin: 10px -15px -15px;
+}
+
+.ui-content .ui-listview:first-child:last-child{
+ margin: -15px -15px -15px;
+}
+
.ui-page-header-fullscreen .ui-content, .ui-page-footer-fullscreen .ui-content{
padding-left: 15px;
padding-right: 15px;
}
.ui-page-footer-fullscreen .ui-content{
+ padding-top: 10px;
padding-bottom: 50px;
}
.ui-page-header-fullscreen .ui-content{
padding-top: 50px;
+ padding-bottom:10px;
+}
+
+.ui-page-footer-fullscreen.ui-page-header-fullscreen .ui-content{
+ padding-bottom: 50px;
}
-.ui-page-header-fullscreen .ui-content .ui-listview {
+.ui-page-header-fullscreen .ui-content .ui-listview:not(.ui-listview-inset) {
margin: 10px -15px 10px;
}
@@ -703,23 +730,35 @@ bottom content in fullscreen mode
margin: -15px -15px -15px;
}
-.ui-page-footer-fullscreen .ui-content .ui-listview {
+.ui-page-footer-fullscreen .ui-content .ui-listview:not(.ui-listview-inset) {
+ margin: 10px -15px 0px;
+}
+
+.ui-page-footer-fullscreen .ui-content .ui-listview:first-child{
+ margin: -11px -15px 0px;
+}
+
+.ui-page-footer-fullscreen .ui-content .ui-listview:first-child:last-child{
margin: -11px -15px -11px;
}
-.ui-page-footer-fullscreen.ui-page-header-fullscreen .ui-content .ui-listview {
+.ui-page-footer-fullscreen.ui-page-header-fullscreen .ui-content .ui-listview:not(.ui-listview-inset) {
margin: 10px -15px;
}
+.ui-page-footer-fullscreen.ui-page-header-fullscreen .ui-content .ui-listview:not(.ui-listview-inset):last-child{
+ margin: 10px -15px -10px;
+}
+
.ui-page-footer-fullscreen.ui-page-header-fullscreen .ui-content .ui-listview:first-child{
- margin: -15px -15px 0px;
+ margin: -10px -15px 0px;
}
.ui-page-footer-fullscreen.ui-page-header-fullscreen .ui-content .ui-listview:first-child:last-child{
- margin: -15px -15px -9px;
+ margin: -10px -15px -9px;
}
-.ui-page-footer-fullscreen .ui-content a[data-role=button]{
+.ui-content a[data-role=button]:last-child{
margin-bottom: 0px;
}
Please sign in to comment.
Something went wrong with that request. Please try again.