mirror of
https://github.com/seigler/dash-website
synced 2025-07-27 07:16:10 +00:00
Contacts page pull request (#53)
* adds contacts page and hero, begins work on forms * social icons * replace some logos, clean up form and spacing
This commit is contained in:
Hunter Lester
Perry Woodin
parent
01b3a74cc9
commit
08ba582317
15 changed files with 403 additions and 1 deletions
16
_i18n/en.yml
16
_i18n/en.yml
|
|
@ -1,6 +1,22 @@
|
|||
|
||||
# For multiple paragraph content add two line breaks
|
||||
pages:
|
||||
|
||||
contact:
|
||||
title: Contact Dash
|
||||
description: Contact Dash
|
||||
hero-image:
|
||||
hero-heading: Contacts
|
||||
hero-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.
|
||||
social-heading: Forums & Social Media
|
||||
mail-list-heading: Mailing List
|
||||
mail-list-text: Have trouble keeping up-to-date? Join our mailing list.
|
||||
social-text-heading: Visit DashTalk
|
||||
social-text: For technical support or troubleshooting with wallets, mining, or other general questions, please visit DashTalk or one of the many other community resources.
|
||||
volunteer-heading: Volunteer
|
||||
|
||||
home:
|
||||
title: Dash Official Website | Dash Crypto Currency
|
||||
description: Dash is Digital Cash
|
||||
|
|
|
|||
62
_includes/hero/contact.html
Normal file
62
_includes/hero/contact.html
Normal file
|
|
@ -0,0 +1,62 @@
|
|||
<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-4">
|
||||
{% t pages.contact.form-pretext %} <br/>
|
||||
{% t pages.contact.form-pretext-2 %}
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<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="">Category</option>
|
||||
<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>
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<input class="submit" type="submit" value="Send Message">
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="hero__content">
|
||||
<section class="section section--cta">
|
||||
<h5>{% t pages.contact.mail-list-heading %}</h5>
|
||||
{% t pages.contact.mail-list-text %}
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<!-- Hero stripe -->
|
||||
<div class="hero__stripe"></div>
|
||||
</div>
|
||||
BIN
assets/img/community/atlassian-logo.png
Normal file
BIN
assets/img/community/atlassian-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 11 KiB |
BIN
assets/img/community/bitcointalk-logo.png
Normal file
BIN
assets/img/community/bitcointalk-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
assets/img/community/google-plus-logo.png
Normal file
BIN
assets/img/community/google-plus-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 45 KiB |
BIN
assets/img/community/instagram-logo.png
Normal file
BIN
assets/img/community/instagram-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 130 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 12 KiB |
BIN
assets/img/community/twitter-logo.png
Normal file
BIN
assets/img/community/twitter-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB |
|
|
@ -1 +1,279 @@
|
|||
Placeholder for Contact page.
|
||||
---
|
||||
layout: default
|
||||
title: pages.contact.title
|
||||
description: pages.contact.description
|
||||
---
|
||||
|
||||
{% include hero/contact.html %}
|
||||
|
||||
<div class="page-contact">
|
||||
|
||||
<section class="section section--cta">
|
||||
<div class="section__content">
|
||||
<h3>{% t pages.contact.social-text-heading %}</h3>
|
||||
{% tmd pages.contact.social-text %}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!--
|
||||
CTA sections
|
||||
-->
|
||||
<section id="contact-social" class="section section--cta">
|
||||
<div class="section__content">
|
||||
<div>
|
||||
<h2>{% t pages.contact.social-heading %}<a class="permalink" title="Permalink" id="contact"></a></h2>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<a href="https://www.dash.org/forum" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/dashforum_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="https://www.reddit.com/r/dashpay/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/reddit_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="https://bitcointalk.org/index.php?topic=421615.0" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/bitcointalk-logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="https://forum.bitcoin.com/dash/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/bitcoindotcom_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<a href="http://dash-nation-invite.herokuapp.com/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/slack_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="https://www.dashcentral.org/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/dashcentral_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="https://twitter.com/dashpay" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/twitter-logo.png" class="large-social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="https://www.facebook.com/DashPay" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/facebook_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<a href="https://plus.google.com/communities/101869723775111070721" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/google-plus-logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="https://www.linkedin.com/company/dash---digitalcash-cryptocurrency-?trk=company_logo" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/linkedin_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="https://www.instagram.com/dashpay/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/instagram-logo.png" class="large-social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="https://www.youtube.com/dashorg" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/youtube_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<a href="http://www.dashnation.com/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/dashnation_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="http://thedashtimes.com/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/dashtimes_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="http://dashndrink.com/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/dashndrink_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="http://whatisdash.org/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/dash_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section section--cta">
|
||||
<div class="section__content">
|
||||
<div>
|
||||
<h2>{% t pages.contact.volunteer-heading %}<a class="permalink" title="Permalink" id="volunteer"></a></h2>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<a href="https://github.com/dashpay/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/github_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="https://dashpay.atlassian.net/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/jira_logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<a href="https://dashpay.atlassian.net/wiki/" target="_blank" class="ctabox__link">
|
||||
<div class="">
|
||||
<img src="/assets/img/community/atlassian-logo.png" class="social-image">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-sm-3"></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>
|
||||
|
|
|
|||
|
|
@ -6,6 +6,37 @@ form {
|
|||
box-sizing: border-box;
|
||||
appearance: none;
|
||||
}
|
||||
select {
|
||||
border: 2px solid $color-black;
|
||||
border-radius: 0px;
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
textarea {
|
||||
border: 2px solid $color-black;
|
||||
font-size: 15px;
|
||||
}
|
||||
.input-block {
|
||||
width: 100%;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.form-control {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 41px;
|
||||
padding: 6px 12px;
|
||||
font-size: 15px;
|
||||
line-height: 1.42857143;
|
||||
color: #999;
|
||||
background-color: #fff;
|
||||
background-image: none;
|
||||
border: 2px solid $color-black;
|
||||
border-radius: 2px;
|
||||
-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 {
|
||||
background-image: url(../images/icon-username.png);
|
||||
background-repeat: no-repeat;
|
||||
|
|
@ -22,4 +53,11 @@ form {
|
|||
padding-left: 40px;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.submit {
|
||||
color: #ffffff;
|
||||
background-color: $color-red;
|
||||
border-radius: 2px;
|
||||
padding: 1.5% 2%;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
7
src/scss/_social_icons.scss
Normal file
7
src/scss/_social_icons.scss
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
.social-image {
|
||||
width: 44%;
|
||||
}
|
||||
|
||||
.large-social-image {
|
||||
width: 20%;
|
||||
}
|
||||
|
|
@ -45,3 +45,4 @@
|
|||
@import "pages/styleguide";
|
||||
@import "code-highlight";
|
||||
@import "pages/currency";
|
||||
@import "social_icons";
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue