add get-started page

foundation/public/build.json

@@ -0,0 +1,5 @@
+{
+    "foundation/css/erpnext-org-theme.css": [
+        "public/less/erpnext-org-theme.less"
+    ]
+}

foundation/public/css/base.css

@@ -10,9 +10,15 @@
 .top-zero {
   margin-top: 0;
 }
+.bottom-zero {
+  margin-bottom: 0;
+}
 .top-spacer {
   margin-top: 2.5rem;
 }
+.bottom-spacer {
+  margin-bottom: 2.5rem;
+}
 .bottom-spacer-4 {
   margin-bottom: 4rem;
 }

foundation/public/css/erpnext-org-theme.css

@@ -12,9 +12,15 @@
 .top-zero {
   margin-top: 0;
 }
+.bottom-zero {
+  margin-bottom: 0;
+}
 .top-spacer {
   margin-top: 2.5rem;
 }
+.bottom-spacer {
+  margin-bottom: 2.5rem;
+}
 .bottom-spacer-4 {
   margin-bottom: 4rem;
 }
@@ -42,6 +48,12 @@
 .text-white {
   color: #fff;
 }
+.text-medium {
+  font-size: 1.5rem;
+}
+.text-small {
+  font-size: 0.5rem;
+}
 .centered {
   margin: 0 auto;
 }
@@ -57,6 +69,15 @@
 .list-circle {
   list-style: circle;
 }
+.border {
+  border: 1px solid #d1d8dd;
+}
+.saturate {
+  filter: grayscale(100%);
+}
+.saturate:hover {
+  filter: grayscale(0%);
+}
 a {
   color: #7575ff;
   text-decoration: none;
@@ -157,10 +178,6 @@ a:visited {
 .hero-illustration {
   width: 100%;
   max-width: 800px;
-  margin-bottom: 2.5rem;
-}
-.about-img {
-  margin-bottom: 2.5rem;
 }
 .list-items {
   text-align: center;
@@ -258,13 +275,12 @@ a:visited {
   justify-content: flex-start;
 }
 .intro-copy {
-  font-size: 1.5rem;
   max-width: 599.5px;
   margin: 0 auto 1.5rem auto;
 }
 .primary-links {
   color: #6c7680;
-  transition: color 0.3s ease-out;
+  transition: all 0.3s ease-out;
 }
 .primary-links:hover {
   color: #2E3338;
@@ -314,9 +330,6 @@ a:visited {
 .secondary-link:hover {
   color: #2E3338;
 }
-.active {
-  color: #2E3338;
-}
 .bulleted-list {
   margin: 0;
   padding-left: 1em;
@@ -383,6 +396,7 @@ a:visited {
 @media screen and (min-width: 767px) {
   .sidebar-block {
     border-right: 1px solid #EBEFF2;
+    border-top: 0;
   }
 }
 .blog-page {
@@ -405,19 +419,21 @@ hr {
   border-top: 1px solid #EBEFF2;
 }
 .footer-end {
-  border-top: 1px solid #EBEFF2;
+  border-top: 1px solid #354047;
-  padding: 2rem 1rem;
+  padding-top: 1rem;
+  margin-top: 1rem;
   font-size: 0.75rem;
 }
 @media screen and (min-width: 767px) {
   .footer-end {
-    padding: 2rem 2.5rem;
+    padding-top: 1.5rem;
+    margin-top: 1.5rem;
   }
 }
-.footer-end a {
+.footer a {
   color: #8D99A6;
 }
-.footer-end a:hover {
+.footer a:hover {
   color: #fff;
 }
 .footer-icon {
@@ -450,7 +466,7 @@ hr {
 }
 /*progress bar*/
 .clickable a {
-  color: #36414c;
+  color: #36414C;
 }
 .clickable a:focus {
   outline: 0;
@@ -461,47 +477,42 @@ hr {
 caption {
   padding-top: 8px;
   padding-bottom: 8px;
-  color: #8d99a6;
+  color: #8D99A6;
   text-align: left;
 }
 th {
   text-align: left;
 }
-.note-popover .popover-content > .btn-group,
-.panel-heading.note-toolbar > .btn-group {
-  margin-top: 5px;
-  margin-right: 5px;
-  margin-left: 0;
-}
 .btn-group,
 .btn-group-vertical {
   position: relative;
   display: inline-block;
   vertical-align: middle;
 }
+.note-popover .popover-content > .btn-group,
+.panel-heading.note-toolbar > .btn-group {
+  margin-top: 5px;
+  margin-right: 5px;
+  margin-left: 0;
+}
 .note-popover .popover-content,
 .panel-heading.note-toolbar {
   padding: 0 0 5px 5px;
   margin: 0;
 }
-.panel-default > .panel-heading {
-  color: #333;
-  background-color: #f7fafc;
-  border-color: #d1d8dd;
-}
-.panel-heading,
-.panel-body {
-  padding-left: 1rem;
-}
 .panel-heading {
   padding: 0.5rem 1rem;
   border-bottom: 1px solid transparent;
   border-top-left-radius: 0.25em;
   border-top-right-radius: 0.25em;
 }
-.modal-open .modal {
+.panel-default > .panel-heading {
-  overflow-x: hidden;
+  color: #333;
-  overflow-y: auto;
+  background-color: #f7fafc;
+  border-color: #d1d8dd;
+}
+.panel-body {
+  padding-left: 1rem;
 }
 .modal {
   position: fixed;
@@ -514,6 +525,10 @@ th {
   overflow: hidden;
   outline: 0;
 }
+.modal-open .modal {
+  overflow-x: hidden;
+  overflow-y: auto;
+}
 .modal-backdrop.in {
   filter: alpha(opacity=50);
   opacity: 0.5;
@@ -525,13 +540,13 @@ th {
   left: 0;
   background-color: #334143;
 }
-.modal.in .modal-dialog {
-  transform: translate(0, 0);
-}
 .modal-dialog {
   width: 600px;
   margin: 2rem auto;
 }
+.modal.in .modal-dialog {
+  transform: translate(0, 0);
+}
 .modal-content {
   position: relative;
   background-color: #fff;
@@ -554,9 +569,6 @@ th {
   position: relative;
   padding: 1rem;
 }
-.modal-header .close {
-  margin-top: -2px;
-}
 .close {
   float: right;
   font-size: 1.5rem;
@@ -567,6 +579,9 @@ th {
   filter: alpha(opacity=20);
   opacity: 0.2;
 }
+.modal-header .close {
+  margin-top: -2px;
+}
 .close:hover,
 .close:focus {
   color: #000;
@@ -602,15 +617,6 @@ th {
   display: block;
   width: 100%;
 }
-.form-signin .form-control {
-  position: relative;
-  height: auto;
-  -webkit-box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
-  padding: 0.5rem;
-  margin-bottom: 0.5rem;
-}
 .form-control {
   display: block;
   width: 100%;
@@ -624,6 +630,15 @@ th {
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
   transition: border-color ease-out 0.15s, box-shadow ease-out 0.15s;
 }
+.form-signin .form-control {
+  position: relative;
+  height: auto;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  padding: 0.5rem;
+  margin-bottom: 0.5rem;
+}
 code {
   color: #fc4f51;
   background: #fff5f5;
@@ -716,6 +731,7 @@ img.blog-cover-image,
   margin-top: 4rem;
 }
 /*blog*/
+/*TODO Needs refactor in frappe to use utilities.less*/
 .blog-list-content {
   border: 0;
   background: transparent;
@@ -830,22 +846,6 @@ img.blog-cover-image,
   background-color: #fafbfc;
 }
 /* individual elements */
-/*.row.page-head {
-    display: flex;
-    align-items: center;
-    flex-direction: column;
-    @media screen and (min-width: @screen-xs) {
-        flex-direction: row;
-    }
-}
-
-.item-search .input-wrapper {
-    margin-right: 1.5rem;
-}
-.item-search i {
-    margin-right: -1.5rem;
-    margin-top: .5rem;
-}*/
 .gold-member {
   display: flex;
   padding: 2.5rem 0;
@@ -868,18 +868,18 @@ img.blog-cover-image,
 .box:hover {
   background-color: #fafbfc;
 }
-.domain-links {
+.grid-boxes {
   font-size: 1.5rem;
   display: block;
   padding: 1.5rem;
 }
-.domain-links span {
+.grid-boxes span {
   display: block;
 }
 .thumb-small {
   width: 100px;
 }
-.domain-image {
+.grid-images {
   width: 150px;
   padding-bottom: 1.5rem;
 }

foundation/public/less/base.less

@@ -63,6 +63,14 @@
   color: #fff;
 }
 
+.text-medium {
+  font-size: 1.5rem;
+}
+
+.text-small {
+  font-size: 0.5rem;
+}
+
 .centered {
   margin: 0 auto;
 }
@@ -83,3 +91,14 @@
   list-style: circle;
 }
 
+.border {
+  border: 1px solid @border-color;
+}
+
+.saturate {
+  filter: grayscale(100%);
+
+  &:hover {
+    filter: grayscale(0%);
+  }
+}

foundation/public/less/erpnext-org-theme.less

@@ -214,14 +214,13 @@ a {
 }
 
 .intro-copy {
-  font-size: 1.5rem;
   max-width: @screen-md/2;
   margin: 0 auto 1.5rem auto;
 }
 
 .primary-links {
   color: @text-light;
-  transition: color @transition;
+  transition: all @transition;
 
   &:hover {
     color: @text-dark;
@@ -384,16 +383,18 @@ hr {
 }
 
 .footer-end {
-  border-top: 1px solid @light-border-color;
+  border-top: 1px solid @dark-border-color;
-  padding: 2rem 1rem;
+  padding-top: 1rem;
+  margin-top: 1rem;
   font-size: 0.75rem;
 
   @media screen and (min-width: @screen-xs) {
-    padding: 2rem 2.5rem;
+    padding-top: 1.5rem;
+    margin-top: 1.5rem;
   }
 }
 
-.footer-end a {
+.footer a {
   color: @text-muted;
 
   &:hover {
@@ -895,22 +896,6 @@ img.blog-cover-image,
 
 /* individual elements */
 
-.row.page-head {
-  display: flex;
-  align-items: center;
-  flex-direction: column;
-  flex-wrap: wrap;
-}
-
-.item-search .input-wrapper {
-  margin-right: 1.5rem;
-}
-
-.item-search i {
-  margin-right: -1.5rem;
-  margin-top: 0.5rem;
-}
-
 .gold-member {
   display: flex;
   padding: 2.5rem 0;
@@ -938,7 +923,7 @@ img.blog-cover-image,
   }
 }
 
-.domain-links {
+.grid-boxes {
   font-size: 1.5rem;
   display: block;
   padding: 1.5rem;
@@ -952,7 +937,7 @@ img.blog-cover-image,
   width: 100px;
 }
 
-.domain-image {
+.grid-images {
   width: 150px;
   padding-bottom: 1.5rem;
 }

foundation/public/less/variables.less

@@ -7,5 +7,6 @@
 @button-secondary-hover:    lighten(@light-bg, 15%);
 @primary-link-color:        lighten(@brand-primary, 5%);
 @border:                    1px solid @border-color;
-@transition:				.3s ease-out;
+@transition:				0.3s ease-out;
 @screen-palm:				500px;
+@dark-border-color:         darken(@border-color, 60%);

foundation/templates/includes/footer/footer.html

@@ -1,9 +1,9 @@
-<footer class="gray-bg">
+<footer class="dark-bg">
 <div class="footer">
  <div class="container">
 	<div class="four-column left-aligned clearfix">
 		<div class="columns">
-			<h3 class="footer-title">Domains</h3>
+			<h3 class="footer-title text-white">Domains</h3>
 			<ul class="list-unstyled footer-list">
 				<li>
 					<a class="secondary-link" href="/docs/user/manual/en/manufacturing">Manufacturing</a>
@@ -32,7 +32,7 @@
 			</ul>
 		</div>
 		<div class="columns">
-			<h3 class="footer-title">Foundation</h3>
+			<h3 class="footer-title text-white">Foundation</h3>
 			<ul class="list-unstyled footer-list">
 				<li>
 					<a class="secondary-link" href="/about">About</a>
@@ -61,7 +61,7 @@
 			</ul>
 		</div>
 		<div class="columns">
-			<h3 class="footer-title">Community</h3>
+			<h3 class="footer-title text-white">Community</h3>
 			<ul class="list-unstyled footer-list">
 				<li>
 					<a class="secondary-link" href="/chapters">Chapters</a>
@@ -91,7 +91,7 @@
 			</ul>
 		</div>
 		<div class="columns">
-			<h3 class="footer-title">Documentation</h3>
+			<h3 class="footer-title text-white">Documentation</h3>
 			<ul class="list-unstyled footer-list">
 				<li>
 					<a class="secondary-link" href="/docs/user/manual">Manual</a>
@@ -103,7 +103,7 @@
 					<a class="secondary-link" href="/docs/current">ERPNext Model & API</a>
 				</li>
 			</ul>
-            <!--<h3 class="footer-title top-spacer">Localisation</h3>
+            <!--<h3 class="footer-title text-white top-spacer">Localisation</h3>
             <ul class="list-unstyled footer-list">
                 <li>
                     <a class="secondary-link" href="https://erpnext.com/uae-ksa-vat" target="_blank">UAE/KSA VAT</a>
@@ -114,8 +114,6 @@
             </ul>-->
         </div>
     </div>
-    </div>
-    </div>
     <div class="footer-end dark-bg text-muted">
         <div class="container">
             <div class="align-iten-center three-column">
@@ -144,4 +142,6 @@
         $("#year").text(currentYear);
         });
     </script>
+ </div>
+</div>
 </footer>

foundation/www/about.html

@@ -10,7 +10,8 @@
             <div class="container">
                 <img class="about-img bottom-spacer" src="/assets/foundation/img/community-colored.jpg">
                 <h1 class="header1">ERPNext Foundation</h1>
-                <p class="intro-copy">We are a Non Profit Foundation representing a community of ERPNext Users, Developers and Service Providers. Our goal is to provide a platform for the ERPNext Community to come together, join hands and build assets to help build and enhance ERPNext around the world.</p><p class="intro-copy"> ERPNext Foundation aims to be a community driven organization and run in a transparent manner. If you want to be more involved in the ERPNext Community, read the <a href="/faq" class="secondary-link" target="_blank">FAQ</a>.
+                <p class="intro-copy text-medium">We are a Non Profit Foundation representing a community of ERPNext Users, Developers and Service Providers. Our goal is to provide a platform for the ERPNext Community to
+                come together, join hands and build assets to help build and enhance ERPNext around the world.</p><p class="intro-copy text-medium"> ERPNext Foundation aims to be a community driven organization and run in a transparent manner. If you want to be more involved in the ERPNext Community, read the <a href="/faq" class="secondary-link" target="_blank">FAQ</a>.
             </div>
         </section>
         <div class="page-content">

foundation/www/get-started.html

@@ -0,0 +1,35 @@
+{% extends "foundation/templates/base.html" %}
+{% block title %} Get Started - ERPNext Foundation{% endblock %}
+{% block content %}
+<section class="feature text-center">
+    <div class="container">
+        <h1 class="header1">Virtual Machine Images</h1>
+        <p class='text-medium text-light bottom-spacer-4'>Download a pre-installed Virtual Box Images</p>
+        <ul class="list-unstyled grid-of-three">
+            <li class="list-items border grid-items">
+                <a class="primary-links grid-boxes saturate" href="http://build.erpnext.com/ERPNext-Production.ova">
+                    <img class="grid-images" src="/assets/foundation/img/vm-production.png" alt="Download ERPNext Production Image">
+                </a>
+                <h2 class="header3">Download Production Image</h2>
+                <p class="text-muted">Stable build for Production use<br>(approx 1.5GB) | <a href="http://build.erpnext.com/ERPNext-Production.ova.md5">MD5</a></p>
+            </li>
+            <li class="list-items border grid-items">
+                <a class="primary-links grid-boxes saturate" href="http://build.erpnext.com/ERPNext-Dev.ova">
+                    <img class="grid-images" src="/assets/foundation/img/vm-development.png" alt="Download ERPNext Development Image">
+                </a>
+                <h2 class="header3">Download Development Image</h2>
+                <p class="text-muted">Bleeding edge build for development only<br>(approx 1.5GB) | <a href="http://build.erpnext.com/ERPNext-Dev.ova.md5">MD5</a>
+                </p>
+            </li>
+            <li class="list-items border grid-items">
+                <a class="primary-links grid-boxes saturate" href="http://build.erpnext.com/ERPNext-Vagrant.box">
+                    <img class="grid-images" src="/assets/foundation/img/vm-dev-vagrant.png" alt="Download ERPNext Vagrant Box">
+                </a>
+                <h2 class="header3">Download Vagrant Box</h2>
+                <p class="text-muted">Bleeding edge Vagrant box for development only<br>(approx 1.5GB) | <a href="http://build.erpnext.com/ERPNext-Vagrant.box.md5">MD5</a>
+                </p>
+            </li>
+        </ul>
+    </div>
+</section>
+{% endblock %}

foundation/www/index.html

@@ -5,8 +5,8 @@
     <div class="container">
         <img class="hero-illustration bottom-spacer" src='/assets/foundation/img/hero-illustration-erpnext.png' alt="ERP software for Everybody">
         <h1 class="header1">ERP for Everybody</h1>
-        <p class='intro-copy text-light'>Worlds Leading Fully Opensource ERP Software That Helps You Stay In Control Of Your Business</p>
+        <p class='intro-copy text-medium text-light'>Worlds Leading Fully Opensource ERP Software That Helps You Stay In Control Of Your Business</p>
-        <a class="button button-primary" href="https://erpnext.com/pricing">Get Started</a>
+        <a class="button button-primary" href="/get-started.html">Get Started</a>
     </div>
 </section>
 <section class="feature gray-bg left-aligned">
@@ -14,38 +14,38 @@
         <h2 class="header1 bottom-spacer-4 text-center">One App Many Domains</h1>
           <ul class="list-unstyled grid-of-four">
             <li class="list-items grid-items">
-				<a class="primary-links domain-links" href="/docs/user/manual/en/manufacturing">
+				<a class="primary-links grid-boxes" href="/docs/user/manual/en/manufacturing">
-					<img class="domain-image" src="/assets/foundation/img/manufacturing-domain.png" alt="ERP software for manufacturing"><span>Manufacturing</span>
+					<img class="grid-images" src="/assets/foundation/img/manufacturing-domain.png" alt="ERP software for manufacturing"><span>Manufacturing</span>
                 </a>
             </li>
             <li class="list-items">
-				<a class="primary-links domain-links" href="/docs/user/manual/en/manufacturing">
+				<a class="primary-links grid-boxes" href="/docs/user/manual/en/manufacturing">
-					<img class="domain-image" src="/assets/foundation/img/services.png" alt="ERP software for Services"><span>Services</span>
+					<img class="grid-images" src="/assets/foundation/img/services.png" alt="ERP software for Services"><span>Services</span>
 				</a>
             </li>
             <li class="list-items">
-				<a class="primary-links domain-links" href="/docs/user/manual/en/accounts/point-of-sale-pos-invoice">
+				<a class="primary-links grid-boxes" href="/docs/user/manual/en/accounts/point-of-sale-pos-invoice">
-					<img class="domain-image" src="/assets/foundation/img/retail.png" alt="ERP software for retail"><span>Retail</span></a>
+					<img class="grid-images" src="/assets/foundation/img/retail.png" alt="ERP software for retail"><span>Retail</span></a>
             </li>
             <li class="list-items">
-				<a class="primary-links domain-links"  href="/docs/user/manual/en/stock">
+				<a class="primary-links grid-boxes"  href="/docs/user/manual/en/stock">
-					<img class="domain-image" src="/assets/foundation/img/distribution.png" alt="ERP software for Distribution"><span>Distribution</span></a>
+					<img class="grid-images" src="/assets/foundation/img/distribution.png" alt="ERP software for Distribution"><span>Distribution</span></a>
             </li>
             <li class="list-items">
-				<a class="primary-links domain-links" href="/docs/user/manual/en/education">
+				<a class="primary-links grid-boxes" href="/docs/user/manual/en/education">
-					<img class="domain-image" src="/assets/foundation/img/education.png" alt="ERP software for Education"><span>Education</span></a>
+					<img class="grid-images" src="/assets/foundation/img/education.png" alt="ERP software for Education"><span>Education</span></a>
             </li>
             <li class="list-items">
-				<a class="primary-links domain-links" href="/docs/user/manual/en/agriculture">
+				<a class="primary-links grid-boxes" href="/docs/user/manual/en/agriculture">
-					<img class="domain-image" src="/assets/foundation/img/agriculture.png" alt="ERP software for Agriculture"><span>Agriculture</span></a>
+					<img class="grid-images" src="/assets/foundation/img/agriculture.png" alt="ERP software for Agriculture"><span>Agriculture</span></a>
             </li>
             <li class="list-items">
-				<a class="primary-links domain-links" href="/docs/user/manual/en/healthcare">
+				<a class="primary-links grid-boxes" href="/docs/user/manual/en/healthcare">
-					<img class="domain-image" src="/assets/foundation/img/healthcare.png" alt="ERP software for Healthcare"><span>Healthcare</span></a>
+					<img class="grid-images" src="/assets/foundation/img/healthcare.png" alt="ERP software for Healthcare"><span>Healthcare</span></a>
             </li>
             <li class="list-items">
-				<a class="primary-links domain-links" href="/docs/user/manual/en/non_profit">
+				<a class="primary-links grid-boxes" href="/docs/user/manual/en/non_profit">
-                <img class="domain-image" src="/assets/foundation/img/non-profit.png" alt="ERP software for Non-Profits"><span>Non Profit</span></a>
+                <img class="grid-images" src="/assets/foundation/img/non-profit.png" alt="ERP software for Non-Profits"><span>Non Profit</span></a>
             </li>
         </ul>
 	</div>