adds contacts page and hero, begins work on forms

This commit is contained in:
hunterlester 2016-11-29 22:51:48 -08:00
parent 6380578f26
commit 2f0bca4d72
4 changed files with 487 additions and 1 deletions

View file

@ -1,6 +1,15 @@
# For multiple paragraph content add two line breaks # For multiple paragraph content add two line breaks
pages: pages:
contact:
title: Contact Dash
description: Contact Dash
hero-image:
hero-heading: Contacts
hero-text: Feedback text
form-pretext: For technical support or troubleshooting with wallets, mining, or other general questions, please visit DashTalk or one of the many other community resources.
form-pretext-2: For other inquiries, use this form.
home: home:
title: Dash Official Website | Dash Crypto Currency title: Dash Official Website | Dash Crypto Currency
description: Dash is Digital Cash description: Dash is Digital Cash

View file

@ -0,0 +1,61 @@
<div class="hero" id="hero">
<div class="hero__background">
</div>
<!-- Navigation -->
{% include nav-desktop.html %}
<!-- Hero content -->
<div class="hero__content">
<h1 class="hero__title">{% t pages.contact.hero-heading %}</h1>
<p class="hero__lead">{% t pages.contact.hero-text %}</p>
<div class="row">
<div class="col-sm-3">
{% t pages.contact.form-pretext %} <br/>
{% t pages.contact.form-pretext-2 %}
</div>
<div class="col-sm-7">
<form>
<div class="row">
<div class="col-xs-12">
<input placeholder="Name" type="text" class="input-block">
</div>
</div>
<div class="row">
<div class="col-xs-6">
<input class="input-block" placeholder="Email" type="text">
</div>
<div class="col-xs-6">
<select class="form-control" placeholder="category">
<option value="feedback">Feedback</option>
</select>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<textarea placeholder="Message" class="input-block"></textarea>
</div>
</div>
</form>
</div>
</div>
<div class="hero__buttons">
<a href="https://www.dash.org/forum/" class="btn-blue-solid">{% t pages.community.hero-forum-btn %}</a>
</div>
<div class="hero__buttons">
<a href="#community-discussion" class="btn-white-solid">{% t pages.community.hero-discussion-btn %}</a>
<a href="#community-social" class="btn-white-solid">{% t pages.community.hero-social-btn %}</a>
<a href="#community-news" class="btn-white-solid">{% t pages.community.hero-news-btn %}</a>
<a href="#community-development" class="btn-white-solid">{% t pages.community.hero-development-btn %}</a>
<a href="#community-masternode" class="btn-white-solid">{% t pages.community.hero-masternodes-btn %}</a>
<!--<a href="#community-media" class="btn-white-solid">{% t pages.community.hero-video-btn %}</a>-->
</div>
</div>
<!-- Hero stripe -->
<div class="hero__stripe"></div>
</div>

View file

@ -1 +1,394 @@
Placeholder for Contact page. ---
layout: default
title: pages.contact.title
description: pages.contact.description
---
{% include hero/contact.html %}
<div class="page-contact">
<!--
CTA sections
-->
<section id="community-discussion" class="section section--cta">
<div class="section__content">
<div>
<h2>{% t pages.community.discussion-heading %}<a class="permalink" title="Permalink" id="discussion"></a></h2>
{% tmd pages.community.discussion-text %}
</div>
<div class="ctabox" data-js-ctabox>
<div class="ctabox__inner">
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://www.dash.org/forum" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/dashforum_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Dash Forum</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://www.reddit.com/r/dashpay/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/reddit_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Reddit</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://bitcointalk.org/index.php?topic=421615.0" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/bitcointalk_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">BitcoinTalk</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://forum.bitcoin.com/dash/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/bitcoindotcom_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Bitcoin.com Forum</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="http://dash-nation-invite.herokuapp.com/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/slack_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Dash Nation</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://digitalcash24.herokuapp.com/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/slack_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">DigitalCash24</h4>
</div>
</a>
</article>
</div>
</div>
</div>
</section>
<section id="community-social" class="section section--cta section--gray-light-bg">
<div class="section__content">
<div>
<h2>{% t pages.community.social-heading %}<a class="permalink" title="Permalink" id="social"></a></h2>
{% tmd pages.community.social-text %}
</div>
<div class="ctabox ctabox--gray-light-bg" data-js-ctabox>
<div class="ctabox__inner">
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://twitter.com/dashpay" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/twitter_logo.png" class="ctabox__image">
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://www.facebook.com/DashPay" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/facebook_logo.png" class="ctabox__image">
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://plus.google.com/communities/101869723775111070721" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/googleplus_logo.png" class="ctabox__image">
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://www.linkedin.com/company/dash---digitalcash-cryptocurrency-?trk=company_logo" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/linkedin_logo.png" class="ctabox__image">
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://www.instagram.com/dashpay/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/instagram_logo.png" class="ctabox__image">
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://www.youtube.com/dashorg" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/youtube_logo.png" class="ctabox__image">
</div>
</a>
</article>
</div>
</div>
</div>
</section>
<section id="community-news" class="section section--cta">
<div class="section__content">
<div>
<h2>{% t pages.community.news-heading %}<a class="permalink" title="Permalink" id="news"></a></h2>
{% tmd pages.community.news-text %}
</div>
<div class="ctabox" data-js-ctabox>
<div class="ctabox__inner">
<article class="ctabox__cta" data-js-ctabox-item>
<a href="http://www.dashnation.com/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/dashnation_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Dash Nation</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="http://thedashtimes.com/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/dashtimes_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Dash Times</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://dashdot.io/alpha/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/dashdotalpha_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">DashDot Alpha</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="http://whatisdash.org/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/dash_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">What Is Dash?</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="http://dashndrink.com/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/dashndrink_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Dash N Drink</h4>
</div>
</a>
</article>
</div>
</div>
</div>
</section>
<section id="community-development" class="section section--cta section--gray-light-bg">
<div class="section__content">
<div>
<h2>{% t pages.community.development-heading %}<a class="permalink" title="Permalink" id="development"></a></h2>
{% tmd pages.community.development-text %}
</div>
<div class="ctabox ctabox--gray-light-bg" data-js-ctabox>
<div class="ctabox__inner">
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://github.com/dashpay/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/github_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Github</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://dashpay.atlassian.net/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/jira_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">JIRA</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://dashpay.atlassian.net/wiki/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/atlassian_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Dash Wiki</h4>
</div>
</a>
</article>
</div>
</div>
</div>
</section>
<section id="community-masternode" class="section section--cta">
<div class="section__content">
<div>
<h2>{% t pages.community.masternode-heading %}<a class="permalink" title="Permalink" id="masternodes"></a></h2>
{% tmd pages.community.masternode-text %}
</div>
<div class="ctabox" data-js-ctabox>
<div class="ctabox__inner">
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://www.dashcentral.org/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/dashcentral_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Dash Central</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="hhttps://www.dashninja.pl/" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/dashninja_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">DashNinja</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://dashpay.atlassian.net/wiki/pages/viewpage.action?pageId=1867885" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/dash_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Hosting Services</h4>
</div>
</a>
</article>
<article class="ctabox__cta" data-js-ctabox-item>
<a href="https://dashpay.atlassian.net/wiki/pages/viewpage.action?pageId=8880153" target="_blank" class="ctabox__link">
<div class="ctabox__imagewrapper">
<img src="/assets/img/community/dash_logo.png" class="ctabox__image">
</div>
<div class="ctabox__text">
<h4 class="ctabox__title">Tools</h4>
</div>
</a>
</article>
</div>
</div>
</div>
</section>
<!--
MEDIA | CONFERENCES | TECHNOLOGY | YOUTUBE
similiar layout to news posts on home page.
.community-post
.community-image
.community-body
.community-title
<section id="community-media">
<div class="content">
<div class="row">
<div class="col-sm-6 col-md-3">
<div class="community-post">
<div class="community-image">
</div>
<div class="community-body">
<h3 class="community-title">{% t pages.community.media-heading %}</h3>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="community-post">
<div class="community-image">
</div>
<div class="community-body">
<h3 class="community-title">{% t pages.community.conferences-heading %}</h3>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="community-post">
<div class="community-image">
</div>
<div class="community-body">
<h3 class="community-title">{% t pages.community.technology-heading %}</h3>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="community-post">
<div class="community-image">
</div>
<div class="community-body">
<h3 class="community-title">{% t pages.community.community-heading %}</h3>
<a href="#" class="btn-blue">{% t pages.community.youtube-btn %}</a>
</div>
</div>
</div>
</div>
</div>
</section>
-->
<!--
NEED SOME DASH
Repeat info from the GET-DASH page
.getdash-need-graphic
<section>
<div class="content">
<div class="row">
<div class="col-sm-6">
<h2>{% t pages.get-dash.need-heading %}</h2>
{% tmd pages.get-dash.need-text %}
<a href="#" class="btn-blue">{% t pages.get-dash.need-btn %}</a>
{% tmd pages.get-dash.need-input %}
</div>
<div class="col-sm-6 getdash-need-graphic">
</div>
</div>
</div>
</section>
-->
</div>

View file

@ -5,6 +5,29 @@ form {
border: 2px solid $color-black; border: 2px solid $color-black;
box-sizing: border-box; box-sizing: border-box;
appearance: none; appearance: none;
}
.input-block {
width: 100%;
margin-bottom: 12px;
}
.form-control {
display: block;
width: 100%;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
} }
.username { .username {
background-image: url(../images/icon-username.png); background-image: url(../images/icon-username.png);