[fix] missing desktop in ios and other minor cleanup, fixes #5007

This commit is contained in:
Rushabh Mehta 2016-03-18 14:39:38 +05:30
parent 71dc66aa70
commit 652cf569cb
7 changed files with 104 additions and 38 deletions

View file

@ -3,8 +3,7 @@
<div class="layout-main-section">
<div class="page-content desktop-list" style="margin-top: 40px;">
{% for (var i=0, l=desktop_items.length; i < l; i++) {
var module = frappe.get_module(desktop_items[i]);
if (module) {
var module = desktop_items[i];
%}
<div class="desktop-list-item" id="module-icon-{%= module._id %}"
data-name="{%= module.name %}" data-link="{%= module.link %}"

View file

@ -62,8 +62,11 @@ frappe.pages['modules'].on_page_load = function(wrapper) {
page.set_title(__(m.label));
page.main.html(frappe.render_template('modules_section', m));
if(frappe.utils.is_mobile()) {
$(document).scrollTop($('.module-body').offset().top - 100);
if(frappe.utils.is_xs() || frappe.utils.is_sm()) {
// call this after a timeout, becuase a refresh will set the page to the top
setTimeout(function() {
$(document).scrollTop($('.module-body').offset().top - 100);
}, 100);
}
//setup_section_toggle();

View file

@ -1,7 +1,7 @@
<div class="module-body">
{% for (var i=0; i < data.length; i++) { var section = data[i]; %}
{% if ((i % 2)===0) { %}<div class="row module-section">{% } %}
<div class="col-md-6">
<div class="col-sm-6 module-section-column">
<div class="h4 section-head">
{{ section.label }}
</div>

View file

@ -13,15 +13,43 @@
margin-bottom: 15px;
}
.module-section {
padding: 15px;
padding-top: 0px;
border-bottom: 1px solid #EBEFF2;
}
.module-section .module-section-link {
line-height: 1.5em;
font-size: 12px;
}
.module-section .section-head {
margin-top: 30px;
.module-section-column {
padding: 15px 30px;
padding-bottom: 20px;
}
@media (min-width: 767px) {
.module-section:nth-child(even) {
background-color: #fafbfc;
}
.module-section:last-child {
border-bottom: none;
}
}
@media (max-width: 991px) {
.module-body {
margin-top: 15px;
border-top: 1px solid #d1d8dd;
}
}
@media (max-width: 767px) {
.module-section {
border: none;
}
.module-section-column {
border-bottom: 1px solid #EBEFF2;
}
.module-section-column:nth-child(even) {
background-color: #fafbfc;
}
.module-section:last-child .module-section-column:last-child {
border-bottom: none;
}
}
.module-item {
margin: 0px;
@ -68,10 +96,6 @@
width: 0px;
}
@media (max-width: 767px) {
.module-body {
border-top: 1px solid #EBEFF2;
margin-top: 15px;
}
body[data-route^="Module"] .page-title {
width: 100%;
}

View file

@ -24,8 +24,17 @@ frappe.utils = {
return true;
},
is_mobile: function() {
return frappe.utils.is_xs();
},
is_xs: function() {
return $(document).width() < 768;
},
is_sm: function() {
return $(document).width() < 991 && $(document).width() >= 768;
},
is_md: function() {
return $(document).width() < 1199 && $(document).width() >= 991;
},
strip_whitespace: function(html) {
return (html || "").replace(/<p>\s*<\/p>/g, "").replace(/<br>(\s*<br>\s*)+/g, "<br><br>");
},

View file

@ -16,8 +16,7 @@
<a class="btn btn-default btn-small dropdown-toggle"
data-toggle="dropdown" title="{{ __("Font Size") }}">
<i class="icon-text-height"></i>
<small style="margin-left: 5px;" class="hidden-xs">
{{ __("Font Size") }}</small>
<small style="margin-left: 5px;" class="hidden-xs"></small>
<b class="caret"></b>
</a>
<ul class="dropdown-menu" role="menu">

View file

@ -1,41 +1,77 @@
@import "variables.less";
.module-head {
padding: 15px 30px;
border-bottom: 1px solid @light-border-color;
padding: 15px 30px;
border-bottom: 1px solid @light-border-color;
}
.module-head h1 {
padding: 0px;
margin: 0px;
padding: 0px;
margin: 0px;
}
.module-body {
padding: 0px 15px;
padding: 0px 15px;
.section-head {
margin-bottom: 15px;
}
.section-head {
margin-bottom: 15px;
}
}
.module-section {
padding: 15px;
padding-top: 0px;
border-bottom: 1px solid @light-border-color;
.module-section-link {
line-height: 1.5em;
font-size: 12px;
}
.module-section-link {
line-height: 1.5em;
font-size: 12px;
}
}
.module-section .section-head {
margin-top: 30px;
.module-section-column {
padding: 15px 30px;
padding-bottom: 20px;
}
@media(min-width: @screen-xs) {
.module-section:nth-child(even) {
background-color: @light-bg;
}
.module-section:last-child {
border-bottom: none;
}
}
@media(max-width: @screen-sm) {
.module-body {
margin-top: 15px;
border-top: 1px solid @border-color;
}
}
@media(max-width: @screen-xs) {
.module-section {
border: none;
}
.module-section-column {
border-bottom: 1px solid @light-border-color;
}
.module-section-column:nth-child(even) {
background-color: @light-bg;
}
.module-section:last-child .module-section-column:last-child {
border-bottom: none;
}
}
.module-item {
margin: 0px;
padding: 7px;
font-weight: 400;
font-weight: 400;
border-bottom: 1px solid @border-color;
cursor: pointer;
transition: 0.2s;
@ -85,11 +121,7 @@
width: 0px;
}
@media(max-width: 767px) {
.module-body {
border-top: 1px solid @light-border-color;
margin-top: 15px;
}
@media(max-width: @screen-xs) {
body[data-route^="Module"] {
.page-title {