Merge branch 'mrV/master'

* mrV/master:
  update page added content and fixes
  added update page
  popups and merges

_i18n/en.yml

@@ -2,6 +2,64 @@
 # For multiple paragraph content add two line breaks
 pages:
 
+  update:
+    title: Dash Official Website | Dash Crypto Currency
+    description: Dash is Digital Cash
+
+    hero-image:
+    hero-heading: 12.1 Update
+    hero-text: Launching a new software release on the network requires that all budget proposals be re-submitted into the system.
+    hero-btn: >
+      Launch date: February 5th, 2017
+
+    video-heading: CORE DEVELOPMENT
+    video-text: The first area of progress is Dash Core. In addition to running the network at present, Dash Core also serves as the backbone of the Evolution engine.
+    video-btn: Overview Video
+
+    merchants-heading: WooCommerce Integration
+    merchants-text: Download Plugin for WooCommerce Wordpress and start using Digital Cash!
+    merchants-btn: Get Plugin
+
+    integrate-heading: 12.1 Updates
+    integrate-text: Sentinel can also be re-geared and deployed to operate digital companies that have a built-in workforce, infrastructure to deploy again, and as an engine for storage and retrieval of information.
+
+    slack-btn: Slack Chanel
+    forum-btn: Dash Forums
+
+    execution-heading: STRATEGIC EXECUTION
+    execution-text:
+      Ryan Taylor, Dash’s CFO, has coordinated a deal with Arizona State University’s SkySong incubator, allowing us access to their top tier facility in Tempe, Arizona.
+
+
+      There are 29 fast-growing, innovative startups sharing this location, and we look forward to talking with many of them. We also look forward to hiring exceptional talent from the University.
+
+    execution-btn: Learn More
+    execution-link: https://www.dash.org/forum/threads/january-2017-budget-report.12601/
+
+    update-heading: EVOLUTION UPDATE
+    update-text:
+      Lead evolution developer Andy Freer has been locked away producing huge amounts of documentation for the various concepts of Evolution. This comes after months of conversations between Andy and myself about how each component of Evolution works, then reimagining it and improving the components and designs systematically.
+
+      Since the original research phase, documentation, specifications, plans and diagrams have been being drafted, growing into a collection of documents that will be put into a wiki with full documentation for Evolution’s end-to-end design and implementation.
+    proposal-btn: Proposals
+    proposal-submit-btn: Submit a Proposal
+
+    evolution-research-heading: EVOLUTION RESEARCH
+    evolution-research-text:
+      In January 2016 we released an early Evolution prototype based on Electrum which enabled basic functions such as registering a username and paying friends by name.
+
+      The prototype was pretty basic, with user interaction limited to just paying a few friends and user data stored on a dev server, but at least it proved the concept.
+      What we set out to do then was to design and prototype all the key technologies that would make these functions work in a purely P2P way, with data secured on the Dash blockchain and accessible from anywhere on any device, with integrated SPV based security and no centralized intermediary services required, and using the most common and censorship resistant protocol available – HTTP(S)
+    evolution-research-btn: Network Stats
+
+    launching-heading: LAUNCHING DATES
+    launching-text: >
+      Launching a new software release on the network requires that all budget proposals be re-submitted into the system.
+
+      Due to the timing of superblocks, we have a short window to launch, near the beginning of the month. In order to ensure we launch the most stable possible version of the software without interfering with the budget system, we would like to hold off until early February to launch 12.1. Launch date: February 5th, 2017.
+    launching-btn: Budgets
+    launching-link: https://www.dashcentral.org/budget
+
   wallets:
     title: Dash Wallets
     description: Get the right Dash wallet for your platform

_includes/footer.html

@@ -59,7 +59,7 @@
         <li><a href="https://www.reddit.com/r/dashpay" target="_blank">{% t nav.reddit %}</a></li>
         <li><a href="https://twitter.com/dashpay" target="_blank">{% t nav.twitter %}</a></li>
         <li><a href="https://www.youtube.com/channel/UCAzD2v9Yx4a4iS2_-unODkA" target="_blank">{% t nav.youtube %}</a></li>
-        <li><a href="https://plus.google.com/115080614177201373926/posts" target="_blank">{% t nav.google %}</a></li>
+        <li><a href="https://plus.google.com/u/0/communities/101869723775111070721/stream/03b94d84-f61a-49f2-bb7d-9ac82e1ed7f2" target="_blank">{% t nav.google %}</a></li>
         <li><a href="https://www.linkedin.com/groups?home=&gid=8179817&trk=groups_most_recent-h-logo&goback=%2Egmp_8179817" target="_blank">{% t nav.linkedin %}</a></li>
         <li><a href="https://facebook.com/dashpay" target="_blank">{% t nav.facebook %}</a></li>
         <li><a href="https://github.com/dashpay/dash" target="_blank">{% t nav.github %}</a></li>

_includes/hero/update.html

@@ -0,0 +1,25 @@
+<div class="hero" id="hero">
+	<div class="hero__background">
+		{% srcset hero/home.jpg ppi:1,2 class="hero__background-image" %}
+			{% srcset_source width:1920 %}
+			{% srcset_source width:1280 %}
+			{% srcset_source width:1024 %}
+			{% srcset_source width:800 %}
+		{% endsrcset %}
+	</div>
+
+	<!-- Navigation -->
+	{% include nav-desktop.html %}
+
+	<!-- Hero content -->
+	<div class="hero__content">
+		<h1 class="hero__title">{% t pages.update.hero-heading %}</h1>
+		<p class="hero__lead">{% t pages.update.hero-text %}</p>
+		<div class="hero__buttons">
+			<a href="get-dash/" class="btn-blue-solid btn-large">{% t pages.update.hero-btn %}</a>
+		</div>
+	</div>
+
+	<!-- Hero stripe -->
+	<div class="hero__stripe"></div>
+</div>

_includes/modals/win-core.html

@@ -3,32 +3,35 @@
   <div class="modal-dialog modal-lg" role="document">
 
     <!-- Modal content-->
-    <div class="modal-content">
+    <div class="modal-content b-modal__content">
-      <div class="modal-header">
+      <div class="modal-header b-modal__header">
-        <button type="button" class="close text-right" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+        <span class="close b-modal__close pull-right" data-dismiss="modal" aria-hidden="true"></span>
-        <h4 class="modal-title text-center">{% t pages.wallets.modal-core-header %}</h4>
+        <h4 class="modal-title text-left b-modal__title">{% t pages.wallets.modal-core-header %}</h4>
       </div>
-      <div class="modal-body">
+      <div class="modal-body b-modal__body">
         <div class="row">
           <div class="col-xs-8">
             <div class="row">
               <div class="col-xs-12">
-                <p class="bottom-space">{% t pages.wallets.modal-win-core-description %}</p>
+                <p class="bottom-space b-modal__descr">{% t pages.wallets.modal-win-core-description %}</p>
               </div>
             </div>
             <div class="row">
               <div class="col-xs-12">
-                <p class="bottom-space"><u>{% t pages.wallets.modal-win-core-security-key %}: </u>{% t pages.wallets.modal-win-core-security-value %} <a href="#" data-toggle="tooltip" title="security tooltip">?</a></p>
+                <p class="bottom-space">
+                <span class="b-modal__accent">{% t pages.wallets.modal-win-core-security-key %}: </span>{% t pages.wallets.modal-win-core-security-value %} <a href="#" data-toggle="tooltip" title="security tooltip">?</a></p>
               </div>
             </div>
             <div class="row">
               <div class="col-xs-12">
-                <p class="bottom-space"><u>{% t pages.wallets.modal-win-core-source-code-key %}: </u>{% t pages.wallets.modal-win-core-source-code-value %} <a href="#" data-toggle="tooltip" title="source code tooltip">?</a></p>
+                <p class="bottom-space">
+                     <span class="b-modal__accent">{% t pages.wallets.modal-win-core-source-code-key %}: </span>
+                    {% t pages.wallets.modal-win-core-source-code-value %} <a href="#" data-toggle="tooltip" title="source code tooltip">?</a></p>
               </div>
             </div>
             <div class="row">
               <div class="col-xs-12">
-                <select name="" id="" class="bottom-space">
+                <select name="" id="" class="bottom-space b-modal__select">
                   <option value="win32">Windows 32-bit</option>
                   <option value="win64">Windows 64-bit</option>
                 </select>
@@ -51,20 +54,26 @@
             </div>
           </div>
           <div class="col-xs-4">
+            <div class="b-modal__sidebar">
                 <div class="row">
                   <div class="col-xs-12">
+                    <div class="b-modal__accent bottom-space">
                         <h5>{% t pages.wallets.modal-core-users-text %}</h5>
                         <p class="bottom-space">{% t pages.wallets.modal-core-users-value %}</p>
                     </div>
                   </div>
+                </div>
                 <div class="row">
                   <div class="col-xs-12">
+                    <div class="b-modal__accent bottom-space">
                         <h5>{% t pages.wallets.modal-core-masternode-text %}</h5>
                         <p class="bottom-space">{% t pages.wallets.modal-core-masternode-value %}</p>
                     </div>
                   </div>
+                </div>
                 <div class="row">
                   <div class="col-xs-12">
+                    <div class="b-modal__accent bottom-space">
                         <h5>{% t pages.wallets.modal-core-pool-text %}</h5>
                         <p class="bottom-space">{% t pages.wallets.modal-core-pool-value %}</p>
                     </div>
@@ -74,4 +83,6 @@
           </div>
         </div>
       </div>
+    </div>
+  </div>
 </div>

src/scss/_junk-drawer.scss

@@ -23,6 +23,10 @@ you're in a hurry or lost or you just need to Make It Work©
 	text-align: center;
 }
 
+.text-left {
+	text-align: left;
+}
+
 $wallet-tile-min-height: 20em;
 $wallet-tile-max-width: 25em;
 $wallet-tile-logo-container-height: 5.5em;
@@ -80,7 +84,7 @@ $wallet-tile-hover-background-base-color: lighten($color-blue-light,9);
 				padding: 0 0 $wallet-tile-spacing 0;
 			}
 			& .fine-print {
-				overflow: scroll;
+				overflow-y: auto;
 				min-height: $wallet-tile-caption-fine-print-height;
 				max-height: $wallet-tile-caption-fine-print-height*2;
 				margin: 0 0 $wallet-tile-spacing 0;
@@ -158,3 +162,130 @@ a.blog_link {
 	margin-top: 30px;
 	margin-bottom: 0;
 }
+.b-modal{
+	&__close {
+		position: absolute;
+		right: 32px;
+		top: 32px;
+		width: 32px;
+		height: 32px;
+		cursor: pointer;
+		&:hover{
+			&:before, &:after {
+				background-color: #000;
+			}
+		}
+		&:before, &:after {
+			position: absolute;
+			left: 15px;
+			content: ' ';
+			height: 33px;
+			width: 2px;
+			background-color: #fff;
+			transition:.5s;
+		}
+		&:before {
+			transform: rotate(45deg);
+		}
+		&:after {
+			transform: rotate(-45deg);
+		}
+	}
+	&__title {
+		color: #fff;
+		font-size: 2.6em;
+	}
+	&__content{
+		background-color: #1c75bc;
+	}
+	&__header{
+		padding-left: 44px;
+		border: none;
+	}
+	&__body{
+		border: 0;
+		padding-left: 44px;
+	}
+	&__descr{
+		color: #fff;
+		font-size: 1.5em;
+	}
+	&__accent{
+		color: #fff;
+		font-size: 0.9em;
+	}
+	&__sidebar{
+		padding: 3px 0 0 42px;
+		border-left: 1px solid rgba(255,255,255, .22);
+	}
+	&__select{
+		position: relative;
+		padding: 14px 50px 12px 10px;
+		background: #1c75bc;
+		border-radius: 2px;
+		border: 1px solid #6aaee6;
+		color:#fff;
+		font-size: 1em;
+		box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.5);
+		-webkit-appearance:none;
+		-moz-appearance:none;
+		appearance:none;
+		cursor:pointer;
+		&:after{
+			content: '';
+			position: absolute;
+			top: 50%;
+			right: 12px;
+			margin-top: -2px;
+			vertical-align: middle;width: 0;
+			height: 0;
+			margin-left: 2px;
+			vertical-align: middle;
+			border-top: 4px solid #000;
+			border-right: 4px solid transparent;
+			border-bottom: 0 dotted;
+			border-left: 4px solid transparent;
+		}
+	}
+}
+
+
+
+.b-get-section {
+	background-image: url(../../assets/img/update/bg2.png);
+	color: white;
+	padding: 40px 0;
+    overflow: hidden;
+    position: relative;
+    text-align: center;
+	h1, h2, h3 {
+		color: white;
+	}
+	h2 {
+	    margin-top: 0px;
+	}
+	.page--home>section:not(.section) p {
+	    max-width: 50em;
+	    margin: 20px auto;
+	}
+	img {
+		margin-top: 30px;
+		vertical-align: text-top;
+	}
+
+	.btn-white-solid {
+		color: $color-blue;
+	}
+}
+.ctabox_small-font{
+	p{
+		padding-left: 20px;
+	    padding-right: 20px;
+	    font-size: 0.8em;
+	    height: 100%;
+	    word-wrap: normal;
+	    white-space: normal;
+	    line-height: 1.3;
+	    text-align: left;
+	}
+}

update/index.html

@@ -0,0 +1,271 @@
+---
+layout: default
+title: pages.update.title
+description: pages.update.description
+---
+
+
+{% include hero/update.html %}
+
+<div class="page page--home">
+
+	<!--
+		WHAT IS DASH?
+		LINK TO VIDEO.
+	-->
+	<section class="section section--home-cta">
+		<div class="section__content">
+				<h2 class="section__title">{% t pages.home.video-heading %}</h2>
+				<div class="section__lead">{% tmd pages.home.video-text %}</div>
+
+				<div class="section__btn-grp">
+					<a href="https://www.youtube.com/watch?v=rcHC40YmS0g" class="btn-blue btn-large" target="_blank" data-js-popup="video">{% t pages.home.video-btn %}</a>
+					<a href="{{ basenav }}/get-dash/" class="btn-blue-solid btn-large">{% t nav.download %}</a>
+				</div>
+		</div>
+	</section>
+
+	<!--
+		MERCHANTS
+	-->
+	<section class="b-get-section">
+		<div class="content">
+			<img src="/assets/img/update/woocommerce.png" alt="">
+			<h2>{% t pages.update.merchants-heading %}</h2>
+
+			<p>{% tmd pages.update.merchants-text %}</p>
+
+			<a href="{{ basenav }}/get-dash/" class="btn-white-solid">{% t pages.update.merchants-btn%}</a>
+
+		</div>
+	</section>
+
+	<!--
+		INTEGRATION
+	-->
+	<section>
+		<div class="content">
+			<div>
+				<h2>{% t pages.update.integrate-heading %}</h2>
+
+				{% tmd pages.update.integrate-text %}
+			</div>
+
+			<div class="ctabox ctabox_small-font ctabox--gray-light-bg" data-js-ctabox>
+				<div class="ctabox__inner">
+					<article class="ctabox__cta" data-js-ctabox-item>
+						<a href="https://shakepay.co" target="_blank" class="ctabox__link">
+							<div class="ctabox__imagewrapper">
+								<img src="/assets/img/update/network.png" class="ctabox__image">
+							</div>
+							<div class="ctabox__text">
+								<h4 class="ctabox__title">EVOLUTION</h4>
+								<p class="ctabox__description">Lead evolution developer Andy Freer has been locked away producing huge amounts of documentation for the various concepts of Evolution.</p>
+							</div>
+						</a>
+					</article>
+					<article class="ctabox__cta" data-js-ctabox-item>
+						<a href="https://www.livingroomofsatoshi.com/" target="_blank" class="ctabox__link">
+							<div class="ctabox__imagewrapper">
+								<img src="/assets/img/update/update.png" class="ctabox__image">
+							</div>
+							<div class="ctabox__text">
+								<h4 class="ctabox__title">RESEARCH</h4>
+								<p class="ctabox__description">In January 2016 we released an early Evolution prototype based on Electrum which enabled basic functions such as registering a username and paying friends by name.</p>
+							</div>
+						</a>
+					</article>
+					<article class="ctabox__cta" data-js-ctabox-item>
+						<a href="https://www.bolehvpn.net/" target="_blank" class="ctabox__link">
+							<div class="ctabox__imagewrapper">
+								<img src="/assets/img/update/frontend.png" class="ctabox__image">
+							</div>
+							<div class="ctabox__text">
+							<h4 class="ctabox__title">FRONTEND</h4>
+							<p class="ctabox__description">The 3 main areas of frontend design and development have been to design a secure, SPV based Web Wallet, merchant tools to enable drag-and-drop checkout on a website, and an SDK that connects web clients to DAPI.</p>
+							</div>
+						</a>
+					</article>
+					<article class="ctabox__cta" data-js-ctabox-item>
+						<a href="https://node40.com" target="_blank" class="ctabox__link">
+							<div class="ctabox__imagewrapper">
+								<img src="/assets/img/update/backend.png" class="ctabox__image">
+							</div>
+							<div class="ctabox__text">
+								<h4 class="ctabox__title">BACKEND</h4>
+								<p class="ctabox__description">The first has been to port BitPay’s Bitcore Platform to Dash including merging Bitcore Node to DashCore 12.1 for native API support.</p>
+							</div>
+						</a>
+					</article>
+					<article class="ctabox__cta" data-js-ctabox-item>
+						<a href="https://shapeshift.io" target="_blank" class="ctabox__link">
+							<div class="ctabox__imagewrapper">
+								<img src="/assets/img/update/code.png" class="ctabox__image">
+							</div>
+							<div class="ctabox__text">
+								<h4 class="ctabox__title"> CORE</h4>
+								<p class="ctabox__description">Evolution Core work has been focused on first providing a basis to the new system in the form of Sentinel and improving DashCore to be implementation-agnostic to governance functions and objects.</p>
+							</div>
+						</a>
+					</article>
+					<article class="ctabox__cta" data-js-ctabox-item>
+						<a href="https://misconductwineco.com/" target="_blank" class="ctabox__link">
+							<div class="ctabox__imagewrapper">
+								<img src="/assets/img/update/strategic.jpg" class="ctabox__image">
+							</div>
+							<div class="ctabox__text">
+								<h4 class="ctabox__title">NETWORK</h4>
+								<p class="ctabox__description">Enforcement will be turned off for this network upgrade, meaning nodes running the old version of the Dash software (12.0) will quickly stop being paid (contingent on miners upgrading).</p>
+							</div>
+						</a>
+					</article>
+				</div>
+			</div>
+
+			<div>
+				<a href="/merchants/" target="_blank" class="btn-blue">{% t pages.update.slack-btn %}</a>
+				<a href="{% t pages.home.merchants-link %}" target="_blank" class="btn-blue">{% t pages.update.forum-btn %}</a>
+			</div>
+		</div>
+	</section>
+
+	<!--
+		DASH FEATURES
+		PRIVATE | INSTANT | SECURE
+	-->
+	<section>
+		<div class="content">
+			<div class="row features-collection">
+				<div class="col-sm-4">
+					<img src="/assets/img/home/instant.svg" height="100" alt="{% t pages.home.feature-instant-heading %}">
+					<h2>{% t pages.home.feature-instant-heading %}</h2>
+					{% tmd pages.home.feature-instant-text %}
+				</div>
+				<div class="col-sm-4">
+					<img src="/assets/img/home/private.svg" height="100" alt="{% t pages.home.feature-private-heading %}">
+					<h2>{% t pages.home.feature-private-heading %}</h2>
+					{% tmd pages.home.feature-private-text %}
+				</div>
+				<div class="col-sm-4">
+					<img src="/assets/img/home/secure.svg" height="100" alt="{% t pages.home.feature-secure-heading %}">
+					<h2>{% t pages.home.feature-secure-heading %}</h2>
+					{% tmd pages.home.feature-secure-text %}
+				</div>
+			</div>
+		</div>
+	</section>
+
+	<!--
+		NETWORK ARCHITECTURE
+	-->
+	<section class="section--masternode">
+		<div class="content">
+			<div class="row">
+				<div class="col-sm-6">
+					<h2>{% t pages.update.execution-heading %}</h2>
+
+					{% tmd pages.update.execution-text %}
+
+					<a href="{% t pages.update.execution-link %}" target="_blank" class="btn-blue">{% t pages.update.execution-btn %}</a>
+				</div>
+				<div class="col-sm-6 home-architecture-graphic">
+					<img src="/assets/img/update/execution.png" alt="{% t pages.home.execution-heading %}">
+				</div>
+			</div>
+		</div>
+	</section>
+
+	<!--
+		SELF GOVERNING | SELF FUNDING
+	-->
+	<section>
+		<div class="content">
+			<div class="row">
+				<div class="col-sm-6 col-sm-push-6">
+					<h2>{% t pages.update.update-heading %}</h2>
+
+					{% tmd pages.update.update-text %}
+
+				</div>
+				<div class="col-sm-6 col-sm-pull-6 ">
+					<img src="/assets/img/update/updateevo.png" alt="{% t pages.update.update-heading %}">
+				</div>
+			</div>
+		</div>
+	</section>
+
+	<!--
+		FASTEST GROWING NETWORK
+	-->
+	<section>
+		<div class="content">
+			<div class="row">
+				<div class="col-sm-6">
+					<h2>{% t pages.update.evolution-research-heading %}</h2>
+
+					{% tmd pages.update.evolution-research-text %}
+
+					<a href="{{ basenav }}/currency" class="btn-blue">{% t pages.update.evolution-research-btn %}</a>
+				</div>
+				<div class="col-sm-6 home-network-graphic-live">
+					<img src="/assets/img/update/research.png" alt="{% t pages.update.research-heading %}">
+				</div>
+			</div>
+		</div>
+	</section>
+
+	<!--
+		EVOLUTION
+	-->
+	<section>
+		<div class="content">
+			<div class="row">
+				<div class="col-sm-6 col-sm-push-6">
+					<h2>{% t pages.update.launching-heading %}</h2>
+
+					{% tmd pages.update.launching-text %}
+
+					<a href="{% t pages.home.launching-link %}" target="_blank" class="btn-blue">{% t pages.update.launching-btn %}</a>
+				</div>
+				<div class="col-sm-6 col-sm-pull-6 home-evolution-graphic">
+					<img src="/assets/img/update/budget.png" alt="Dash Evolution">
+				</div>
+			</div>
+		</div>
+	</section>
+
+	<!--
+		LATEST NEWS
+	-->
+	<section class="home-latest-news">
+		<div class="content">
+			<h2>{% t pages.home.news-heading %}</h2>
+
+			<div class="row">
+				{% for post in site.posts limit:4 %}
+				<div class="col-sm-6 col-md-3">
+					<div class="news-post">
+						<div class="news-image">
+							{% if post.image %}
+								<img src="{{ basenav }}/assets/img/blog/{{ post.image }}">
+							{% endif %}
+						</div>
+						<div class="news-body">
+							<h3 class="news-title">{{ post.title }}</h3>
+							<div class="date">{{ post.date | date: "%b %d, %Y" }}</div>
+							<p>{{ post.excerpt | strip_html | truncate: 250 }}</p>
+							<a class="read-more" href="{{ basenav }}{{ post.url }}">Read More...</a>
+						</div>
+					</div>
+				</div>
+				{% endfor %}
+			</div>
+
+			<div>
+				<a href="{{ basenav }}/blog/" class="btn-blue">{% t pages.home.news-btn %}</a>
+			</div>
+		</div>
+	</section>
+
+
+</div>