[website] updates for bootstrap3
diff --git a/website/css/website.css b/website/css/website.css
index 25e2c91..ea88396 100644
--- a/website/css/website.css
+++ b/website/css/website.css
@@ -1,47 +1,15 @@
-div.outer {
- padding: 30px;
- margin: 30px -30px 10px -30px;
- min-height: 400px;
+h1, h2, h3, h4, h5 {
+ font-weight: bold;
}
-.outer .navbar {
- margin: -30px -30px 20px -30px;
-}
-
-footer {
- text-align: left;
- margin: auto;
- margin-bottom: 20px;
-}
-
-.navbar-inner {
- border: 0px;
- border-bottom: 1px solid #ddd;
- border-radius: 0px;
- padding-right: 30px;
- padding-left: 30px;
-}
-
-p, li {
- line-height: 1.5em;
-}
-
-.layout-wrapper {
- box-shadow: none;
- -webkit-box-shadow: none;
- -moz-box-shadow: none;
- border-radius: 0px 0px 5px 5px;
-}
-
-.layout-main {
- min-height: 400px;
- padding: 30px;
+.content {
+ padding-bottom: 30px;
}
.missing-image {
background-color: #eee;
padding: 40px;
- width: 32px;
+ width: 112px;
font-size: 32px;
color: #888;
}
diff --git a/website/doctype/style_settings/custom_template.css b/website/doctype/style_settings/custom_template.css
index f055b78..996774e 100644
--- a/website/doctype/style_settings/custom_template.css
+++ b/website/doctype/style_settings/custom_template.css
@@ -66,8 +66,9 @@
}
/* Bootstrap Navbar */
-.navbar-inverse .navbar-inner {
+.navbar-inverse {
box-shadow: none;
+ border-radius: 0px;
background-color: #{{ doc.top_bar_background or "444444"}};
background-repeat: repeat-x;
background-image: none;
@@ -78,9 +79,9 @@
{%- endif %}
}
-.navbar-inverse .brand,
-.navbar-inverse .brand:hover,
-.navbar-inverse .brand:focus,
+.navbar-inverse .navbar-brand,
+.navbar-inverse .navbar-brand:hover,
+.navbar-inverse .navbar-brand:focus,
.navbar-inverse .nav > li > a {
color: #{{ doc.top_bar_foreground or "fffffff"}};
text-shadow: none;
@@ -117,8 +118,8 @@
color: #{{ doc.top_bar_foreground or "fffffff"}};
}
-.navbar-fixed-top .navbar-inner,
-.navbar-static-top .navbar-inner {
+.navbar-fixed-top,
+.navbar-static-top {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
@@ -190,14 +191,6 @@
text-shadow: none;
}
-.breadcrumb > li > .divider {
- color: #{{ doc.page_text }};
-}
-
-.breadcrumb > .active {
- color: #{{ doc.page_text }};
-}
-
.table-striped tbody > tr:nth-child(odd) > td,
.table-striped tbody > tr:nth-child(odd) > th {
diff --git a/website/templates/css/blog_page.css b/website/templates/css/blog_page.css
index 8f56cd2..ffa45b4 100644
--- a/website/templates/css/blog_page.css
+++ b/website/templates/css/blog_page.css
@@ -1,4 +1,8 @@
<style>
+ [itemprop="articleBody"] {
+ font-size: 120%;
+ }
+
.comment-title {
color:#777;
}
diff --git a/website/templates/html/blog_footer.html b/website/templates/html/blog_footer.html
index cab099b..8a84572 100644
--- a/website/templates/html/blog_footer.html
+++ b/website/templates/html/blog_footer.html
@@ -5,8 +5,8 @@
<ul class="breadcrumb" style="background-color: transparent; padding-left: 0px;">
{% for category in categories %}
<li><a href="blog?category={{ category }}">{{ category }}</a>
- {% if not loop.last %}<span class="divider">/</span>{% endif %}</li>
{% endfor %}
+ </ul>
<br><br>
{% endif %}
<p>Show posts by <a href="blog">everyone</a>. Meet the <a href="writers">writers</a> of this blog</p>
diff --git a/website/templates/html/blog_page.html b/website/templates/html/blog_page.html
index c5378dd..ddb61d0 100644
--- a/website/templates/html/blog_page.html
+++ b/website/templates/html/blog_page.html
@@ -37,7 +37,7 @@
{% include 'app/website/templates/html/comment.html' %}
</div>
- <div><button class="btn add-comment">{{ texts.add_comment }}</button></div>
+ <div><button class="btn btn-default add-comment">{{ texts.add_comment }}</button></div>
<div style="display: none; margin-top: 10px;"
id="comment-form">
<div class="alert" style="display:none;"></div>
diff --git a/website/templates/html/footer.html b/website/templates/html/footer.html
index 746b6e9..3161987 100644
--- a/website/templates/html/footer.html
+++ b/website/templates/html/footer.html
@@ -1,71 +1,79 @@
-<footer class="container"><div class="web-footer">
- {% if facebook_share or google_plus_one or twitter_share or linked_in_share %}
- <div class="social-icons" style="">
- <span style="font-size: 11px;">{{ share_text or "Share this page on: "}}</span>
- {% if google_plus_one %}
- <a href="https://plus.google.com/share?url={{ url }}"
- target="_blank"><i class="icon-google-plus"></i></a>
+<footer class="container">
+ <div class="web-footer row">
+ <div class="col col-lg-12">
+ {% if facebook_share or google_plus_one or twitter_share or linked_in_share %}
+ <div class="social-icons" style="">
+ <span style="font-size: 11px;">{{ share_text or "Share this page on: "}}</span>
+ {% if google_plus_one %}
+ <a href="https://plus.google.com/share?url={{ url }}"
+ target="_blank"><i class="icon-google-plus"></i></a>
+ {% endif %}
+ {% if twitter_share %}
+ <a href="https://twitter.com/intent/tweet?url={{ url }}&text={{ encoded_title }}"
+ target="_blank" ><i class="icon-twitter"></i></a>
+ {% endif %}
+ {% if facebook_share %}
+ <a href="https://www.facebook.com/sharer.php?u={{ url }}&t={{ encoded_title }}&via={{ twitter_share_via }}"
+ target="_blank"><i class="icon-facebook"></i></a>
+ {% endif %}
+ {% if linked_in_share %}
+ <a href="http://www.linkedin.com/shareArticle?mini=true&url={{ url }}&title={{ encoded_title }}"
+ target="_blank"><i class="icon-linkedin"></i></a>
+ {% endif %}
+ </div>
{% endif %}
- {% if twitter_share %}
- <a href="https://twitter.com/intent/tweet?url={{ url }}&text={{ encoded_title }}"
- target="_blank" ><i class="icon-twitter"></i></a>
+ <p style="float: right; clear: right;">
+ <a style="font-size: 90%; color: #888;" href="attributions">ERPNext Powered</a>
+ </p>
+ <div class="web-footer-menu">
+ <ul>
+ {% for item in footer_items %}
+ <li><a href="{{ item.url }}" {{ item.target }}
+ data-label="{{ item.label }}">{{ item.label }}</a></li>
+ {% endfor %}
+ </ul>
+ </div>
+ {% if copyright %}
+ <div class="web-footer-copyright">© {{ copyright }}</div>
{% endif %}
- {% if facebook_share %}
- <a href="https://www.facebook.com/sharer.php?u={{ url }}&t={{ encoded_title }}&via={{ twitter_share_via }}"
- target="_blank"><i class="icon-facebook"></i></a>
+ {% if address %}
+ {{ address }}
{% endif %}
- {% if linked_in_share %}
- <a href="http://www.linkedin.com/shareArticle?mini=true&url={{ url }}&title={{ encoded_title }}"
- target="_blank"><i class="icon-linkedin"></i></a>
- {% endif %}
- </div>
- {% endif %}
- <p style="float: right; clear: right;">
- <a style="font-size: 90%; color: #888;" href="attributions">ERPNext Powered</a>
- </p>
- <div class="web-footer-menu">
- <ul>
- {% for item in footer_items %}
- <li><a href="{{ item.url }}" {{ item.target }}
- data-label="{{ item.label }}">{{ item.label }}</a></li>
- {% endfor %}
- </ul>
- </div>
- {% if copyright %}
- <div class="web-footer-copyright">© {{ copyright }}</div>
- {% endif %}
- {% if address %}
- {{ address }}
- {% endif %}
- <p><div class="input-append" style="text-align: center; margin:30px 0px;">
- <input class="col col-lg-3" id="footer-subscribe-email" type="text" placeholder="Your email address...">
- <button class="btn" type="button" id="footer-subscribe-button">Stay Updated</button>
- </div></p>
- <script>
- $("#footer-subscribe-button").click(function() {
+ <br>
+ <div class="input-group col col-lg-6 col-offset-3">
+ <input type="text" id="footer-subscribe-email" placeholder="Your email address...">
+ <span class="input-group-btn">
+ <button class="btn btn-default" type="button" id="footer-subscribe-button">Stay Updated</button>
+ </span>
+ </div>
+ <br>
+ <script>
+ $("#footer-subscribe-button").click(function() {
- $("#footer-subscribe-email").attr('disabled', true);
- $("#footer-subscribe-button").html("Sending...")
- .attr("disabled", true);
+ $("#footer-subscribe-email").attr('disabled', true);
+ $("#footer-subscribe-button").html("Sending...")
+ .attr("disabled", true);
- if($("#footer-subscribe-email").val()) {
- erpnext.send_message({
- subject:"Subscribe me",
- sender: $("#footer-subscribe-email").val(),
- message: "Subscribe to newsletter (via website footer).",
- callback: function(r) {
- if(!r.exc) {
- $("#footer-subscribe-button").html("Thank You :)")
- .addClass("btn-success").attr("disabled", true);
- } else {
- $("#footer-subscribe-button").html("Error :( Not a valid id?")
- .addClass("btn-danger").attr("disabled", false);
- $("#footer-subscribe-email").val("").attr('disabled', false);
+ if($("#footer-subscribe-email").val()) {
+ erpnext.send_message({
+ subject:"Subscribe me",
+ sender: $("#footer-subscribe-email").val(),
+ message: "Subscribe to newsletter (via website footer).",
+ callback: function(r) {
+ if(!r.exc) {
+ $("#footer-subscribe-button").html("Thank You :)")
+ .addClass("btn-success").attr("disabled", true);
+ } else {
+ $("#footer-subscribe-button").html("Error :( Not a valid id?")
+ .addClass("btn-danger").attr("disabled", false);
+ $("#footer-subscribe-email").val("").attr('disabled', false);
+ }
}
- }
- });
- }
- });
- </script>
+ });
+ }
+ });
+ </script>
+ </div>
+ </div>
</div>
</footer>
diff --git a/website/templates/html/navbar.html b/website/templates/html/navbar.html
index 55e8094..635cf34 100644
--- a/website/templates/html/navbar.html
+++ b/website/templates/html/navbar.html
@@ -1,37 +1,36 @@
<div class="navbar navbar-inverse" style="">
- <div class="navbar-inner">
- {%- if brand_html %}<a class="brand" href="index">{{ brand_html }}</a>{% endif -%}
- <div class="container">
- <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- </button>
- <div class="nav-collapse collapse">
- <ul class="nav">
- {%- for page in top_bar_items -%}
- {% if not page.parent_label -%}
- <li data-label="{{ page.label }}" {% if page.child_items %} class="dropdown"{% endif %}>
- <a href="{{ page.url or '#' }}" {% if page.child_items %} class="dropdown-toggle" onclick="return false;" data-toggle="dropdown"{% endif %} {{ page.target or ''}}>
- {{ page.label }}
- {%- if page.child_items -%}
- <b class="caret"></b>
- </a>
- <ul class="dropdown-menu">
- {%- for child in page.child_items -%}
- <li data-label="{{ child.label }}">
- <a {% if child.indent %} style="padding-left: {{(int(child.indent)+1)*15 }}px"{% endif %} href="{{ child.url }}" {{ child.target or '' }}>{{ child.label }}</a>
- </li>
- {%- endfor -%}
- </ul>
- {%- else -%}
- </a>
- {%- endif -%}
- </li>
+ {%- if brand_html %}<a class="navbar-brand" href="index">{{ brand_html }}</a>{% endif -%}
+ <div class="container">
+ <button type="button" class="navbar-toggle" data-toggle="collapse"
+ data-target=".navbar-responsive-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <div class="nav-collapse collapse navbar-responsive-collapse">
+ <ul class="nav navbar-nav">
+ {%- for page in top_bar_items -%}
+ {% if not page.parent_label -%}
+ <li data-label="{{ page.label }}" {% if page.child_items %} class="dropdown"{% endif %}>
+ <a href="{{ page.url or '#' }}" {% if page.child_items %} class="dropdown-toggle" onclick="return false;" data-toggle="dropdown"{% endif %} {{ page.target or ''}}>
+ {{ page.label }}
+ {%- if page.child_items -%}
+ <b class="caret"></b>
+ </a>
+ <ul class="dropdown-menu">
+ {%- for child in page.child_items -%}
+ <li data-label="{{ child.label }}">
+ <a {% if child.indent %} style="padding-left: {{(int(child.indent)+1)*15 }}px"{% endif %} href="{{ child.url }}" {{ child.target or '' }}>{{ child.label }}</a>
+ </li>
+ {%- endfor -%}
+ </ul>
+ {%- else -%}
+ </a>
{%- endif -%}
- {%- endfor %}
- </ul>
- </div>
+ </li>
+ {%- endif -%}
+ {%- endfor %}
+ </ul>
</div>
</div>
</div>
diff --git a/website/templates/html/product_breadcrumbs.html b/website/templates/html/product_breadcrumbs.html
index 3f8c42a..3cd501e 100644
--- a/website/templates/html/product_breadcrumbs.html
+++ b/website/templates/html/product_breadcrumbs.html
@@ -3,7 +3,7 @@
<div class="clearfix">
<ul class="breadcrumb">
{% for ig in obj.parent_groups[:-1] %}
- <li><a href="{{ ig.page_name }}.html">{{ ig.name }}</a> <span class="divider">/</span></li>
+ <li><a href="{{ ig.page_name }}.html">{{ ig.name }}</a></li>
{% endfor %}
<li class="active">{{ obj.parent_groups[-1].name }}</li>
</ul>
diff --git a/website/templates/html/product_group.html b/website/templates/html/product_group.html
index d11e1b0..54a55af 100644
--- a/website/templates/html/product_group.html
+++ b/website/templates/html/product_group.html
@@ -13,8 +13,6 @@
<h3>{{ name }}</h3>
{% endif %}
</div>
-{% include 'app/website/templates/html/product_search_box.html' %}
-{% include 'app/website/templates/html/product_breadcrumbs.html' %}
<div class="col col-lg-12">
{% if sub_groups %}
<hr />
diff --git a/website/templates/html/product_search_box.html b/website/templates/html/product_search_box.html
index 9bce9c5..29564f3 100644
--- a/website/templates/html/product_search_box.html
+++ b/website/templates/html/product_search_box.html
@@ -1,11 +1,12 @@
<div class="col col-lg-12 clearfix">
- <div class="pull-right" style="margin-top: 15px;">
+ <div class="pull-right" style="margin-top: 15px; margin-bottom: 15px;">
<form class="form-search">
- <div class="input-append">
- <input type="text" class="col col-lg-2 search-query"
- id="product-search" placeholder="Product Search..." />
- <button class="btn" id="btn-product-search">
- <i class="icon-search"></i></button>
+ <div class="input-group col col-lg-4 col-offset-8">
+ <input type="text" id="product-search" placeholder="Product Search...">
+ <span class="input-group-btn">
+ <button class="btn btn-default" type="button" id="btn-product-search">
+ <i class="icon-search"></i></button>
+ </span>
</div>
</form>
</div>
diff --git a/website/templates/js/blog.js b/website/templates/js/blog.js
index ec7b83a..2154d47 100644
--- a/website/templates/js/blog.js
+++ b/website/templates/js/blog.js
@@ -87,7 +87,7 @@
if(!data.length || data.length < 20) {
if(blog.start) {
$("#next-page").toggle(false)
- .parent().append("<div class='alert alert-info'>Nothing more to show.</div>");
+ .parent().append("<div class='text-muted'>Nothing more to show.</div>");
} else {
$("#next-page").toggle(false)
.parent().append("<div class='alert'>No blogs written yet.</div>");
diff --git a/website/templates/js/product_list.js b/website/templates/js/product_list.js
index f8f21b3..6873973 100644
--- a/website/templates/js/product_list.js
+++ b/website/templates/js/product_list.js
@@ -40,7 +40,7 @@
.replaceWith("<div class='alert'>No products found.</div>");
} else {
$(".more-btn")
- .replaceWith("<div class='alert'>Nothing more to show.</div>");
+ .replaceWith("<div class='text-muted'>Nothing more to show.</div>");
}
} else {
$(".more-btn").toggle(true)
diff --git a/website/templates/pages/blog.html b/website/templates/pages/blog.html
index ba98f36..fcb542b 100644
--- a/website/templates/pages/blog.html
+++ b/website/templates/pages/blog.html
@@ -25,7 +25,7 @@
<!-- blog list will be generated dynamically -->
</div>
<div style="text-align: center;">
- <button id="next-page" class="btn"
+ <button id="next-page" class="btn btn-default"
style="display:none;">More...</button>
</div>
</div>
diff --git a/website/templates/pages/contact.html b/website/templates/pages/contact.html
index 10576f8..113b627 100644
--- a/website/templates/pages/contact.html
+++ b/website/templates/pages/contact.html
@@ -11,24 +11,28 @@
<h3>{{ obj.doc.heading or "Contact Us"}}</h3>
<div class="row">
<div class="web-form col col-lg-8">
- <div class="row">
- <div class="col col-lg-6">
- <p id="contact-alert" class="alert"
- style="display: none;"> </p>
- </div>
- </div>
- <div class="clearfix"></div>
- <p><select class="col col-lg-6" name="subject">
+ <p id="contact-alert" class="alert"
+ style="display: none;"> </p>
+ <p>
+ <select name="subject">
{% for option in obj.query_options %}
<option value="{{ option }}">{{ option }}</option>
{% endfor %}
- </select></p>
- <p><input class="col col-lg-6" name="email" type="text" placeholder="Your Email Address" /></p>
- <p><textarea class="col col-lg-6" rows="10" name="message"></textarea></p>
- <p><button class="btn btn-primary btn-send">Send</button></p>
+ </select>
+ </p>
+ <p>
+ <input name="email" type="text"
+ placeholder="Your Email Address" />
+ </p>
+ <p>
+ <textarea rows="10" name="message"></textarea>
+ </p>
+ <p>
+ <button class="btn btn-primary btn-send">Send</button>
+ </p>
</div>
{% if obj.doc.address %}
- <div class="col col-lg-3 alert" style="margin-top: 20px;" itemscope itemtype="http://schema.org/PostalAddress">
+ <div class="col col-lg-3 col-offset-1 alert" style="margin-top: 20px;" itemscope itemtype="http://schema.org/PostalAddress">
<h4><i class="icon-map-marker"></i> {{ obj.address.address_title }}</h4>
{% if obj.address.address_line1 %}
<span itemprop="streetAddress">{{ obj.address.address_line1 }}</span><br>