pyc-website
main website for pyc inc.
git clone https://9o.is/git/pyc-website.git
commit 86b003ced314b61679652a1b4c1733ebe6b3c590 parent 14417dbd8c3ce652f3a2e29676e06c42d6cb139a Author: Jul <jul@9o.is> Date: Fri, 7 Mar 2014 21:51:51 -0500 enhanced ui for apply-atm and about Diffstat:
| M | src/main/scala/com/pyd/config/Site.scala | | | 2 | +- |
| M | src/main/webapp/about.html | | | 27 | ++++++++++++++++----------- |
| M | src/main/webapp/apply-atm.html | | | 47 | ++++++++++++++++++++++++++++++++++++++++++----- |
| A | src/main/webapp/img/mybg.png | | | 0 | |
| M | src/main/webapp/less/custom.less | | | 95 | ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++- |
| M | src/main/webapp/less/overrides.less | | | 31 | +++++++++++++++++++++++++++++-- |
| M | src/main/webapp/less/variables.less | | | 12 | +++++++----- |
7 files changed, 189 insertions(+), 25 deletions(-)
diff --git a/src/main/scala/com/pyd/config/Site.scala b/src/main/scala/com/pyd/config/Site.scala @@ -26,7 +26,7 @@ object Site extends Locs { import MenuGroups._ // locations (for top group) - val home = MenuLoc(Menu.i("Home") / "index" >> EarlyResponse(() => Full(RedirectResponse(applyATM.url)))) + val home = MenuLoc(Menu.i("Home") / "index" /*>> EarlyResponse(() => Full(RedirectResponse(applyATM.url)))*/) val applyATM = MenuLoc(Menu.i("Apply for Bitcoin ATM") / "apply-atm" >> TopBarGroup) val about = MenuLoc(Menu.i("About") / "about" >> TopBarGroup) val blog = MenuLoc(Menu.i("Blog") / "blog" >> TopBarGroup >> EarlyResponse(() => Full(RedirectResponse("http://blog."+S.hostName)))) diff --git a/src/main/webapp/about.html b/src/main/webapp/about.html @@ -1,14 +1,17 @@ <div data-lift="surround?with=default;at=content"> - <p class="lg-text"> - PYD is an innovative, C-Type corporation on the forefront of the cryptocurrency: Bitcoin. Our company, - along with our business associates, provides the convenient distribution of Bitcoin in an environment - and manner that is safe and complaint for both legal and legitimate applications. We are dedicated to - helping our customers not only increase their personal wealth, but secure it by utilizing our unique cash - to Bitcoin services. PYD aspires to not only provide a state of the art service in which helps circulate and - establish reputable value in Bitcoin, but to help the everyday man or woman achieve more economically - than he or she ever thought possible. - </p> + <div class="multi-column"> + <p class="lg-text"> + PYD is an innovative, C-Type corporation on the forefront of the cryptocurrency: Bitcoin. Our company, + along with our business associates, provides the convenient distribution of Bitcoin in an environment + and manner that is safe and complaint for both legal and legitimate applications. We are dedicated to + helping our customers not only increase their personal wealth, but secure it by utilizing our unique cash + to Bitcoin services. PYD aspires to not only provide a state of the art service in which helps circulate and + establish reputable value in Bitcoin, but to help the everyday man or woman achieve more economically + than he or she ever thought possible. + </p> + </div> + <div class="row ourstory"> <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6"> @@ -26,7 +29,8 @@ <div id="ourteam"> <div class="row ourstory"> <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> - <p class="lg-text"> + <div class="multi-column"> + <p class="lg-text"> PYD is an acronym that takes the names of its founders; Emilio Pagan-Yourno of Schenectady, NY and Andrew Desbiens of Clifton Park, NY. In the later months of the year 2013, the increasingly popular cryptocurrency, Bitcoin, had demonstrated vast future potential and stability but there was just one @@ -35,7 +39,8 @@ 20 years of age respectively. With their eyes set on providing a unique service initially to their homes in Upstate New York, the two had a plan to help everyone get their very own part of what certainly seems like the future of finance and technology. - </p> + </p> + </div> </div> </div> diff --git a/src/main/webapp/apply-atm.html b/src/main/webapp/apply-atm.html @@ -1,14 +1,51 @@ <div data-lift="surround?with=base-wrap;at=content"> <div data-lift="Notices"></div> - <div class="row"> - <div class="col-xs-12 col-sm-6 col-md-8 col-lg-8"> + <div id="apply-atm" class="row no-gutter"> + + <div class="col-xs-12 col-sm-7 col-md-8 col-lg-8"> + <div class="row bg-primary-gradient"> + <div id="atm-intro" class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> + <div class="big-text-cinzel text-white">Cash to <i class="fa fa-btc"></i>itcoin</div> + </div> + </div> + + <div class="row bg-white" style="border-radius:3px"> + <div id="atm-sub-intro" class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> + <h1 class="semibig-text text-primary"> + Are you a merchant? Apply for a Bitcoin ATM! <br/> + <small>Fill out the form to the right and we'll contact you shortly.</small> + </h1> + </div> + </div> + <div class="row"> + <div id="atm-benefits" class="col-xs-12 col-sm-12 col-md-12 col-lg-12 text-primary"> + <table> + <tr> + <td><i class="fa fa-wrench fa-4x"></i></td> + <td><h1>Free installation and maintenance</h1></td> + </tr> + <tr> + <td><i class="fa fa-bitcoin fa-4x pull-left"></i></td> + <td><h1>Hot and new emerging technology</h1></td> + </tr> + <tr> + <td><i class="fa fa-thumbs-up fa-4x pull-left"></i></td> + <td><h1>Increase business exposure</h1></td> + </tr> + <tr> + <td><i class="fa fa-shield fa-4x pull-left"></i></td> + <td><h1>Safe and reliable way for customers to purchase Bitcoin</h1></td> + </tr> + </table> + </div> + </div> </div> - <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4"> + <div id="atm-application" class="col-xs-12 col-sm-5 col-md-4 col-lg-4 bg-primary-gradient" > <div class="well well-lg"> - <div data-lift="ApplyAtmScreen"></div> - </div> + <div data-lift="ApplyAtmScreen"></div> + </div> </div> </div> </div> \ No newline at end of file diff --git a/src/main/webapp/img/mybg.png b/src/main/webapp/img/mybg.png Binary files differ. diff --git a/src/main/webapp/less/custom.less b/src/main/webapp/less/custom.less @@ -1,6 +1,7 @@ // Add anything custm here -- mixins, variable overrides -// by adding things here instead of overriding existing .LESS files, it makes merging changes on product updates easier +// by adding things here instead of overriding existing .LESS files, it makes merging changes on product updates easier +@import url(http://fonts.googleapis.com/css?family=Cinzel:900); @import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,300,400,700); .background-size(@size) { @@ -10,7 +11,99 @@ background-size: @size; } +.column-count(@count) { + column-count: @count; + -moz-column-count: @count; + -webkit-column-count: @count; +} + +.column-rule(@rule) { + column-rule: @rule; + -moz-column-rule: @rule; + -webkit-column-rule: @rule; +} + +.column-span(@span) { + column-span: @span; + -webkit-column-span: @span; +} + +.multi-column { + > p { + .column-count(2); + br { .column-span(all); } + } +} + .lg-text { font-size:15px; margin: 40px; +} + +.semibig-text { + font-size: @font-size-h1 * 1.5; + margin: 20px 0; +} + +.big-text { + font-size: @font-size-h1 * 2; + margin: 20px 0; +} + +.big-text-cinzel { + //font-family: @font-family-big-base; + font-weight: 900; + .big-text(); +} + +.no-gutter { + overflow: hidden; + + div[class^="col-"] { + padding-left: 0; + padding-right: 0; + } + + @media (min-width: 768px){ + .row { + margin-right: 0; + margin-left: 0; + } + } +} + +.offset-0 { + padding-left: 0; + padding-right: 0; +} + +.bg-white { + background-color: @white; +} + +.bg-primary { + background-color: @brand-primary; +} + +.bg-primary-gradient { + // gradient from bootswatch spacelab inverse + //background-image: linear-gradient(@brand-primary, rgb(68, 110, 155) 50%, rgb(109, 148, 191)) + + #gradient > .radial(rgb(68, 110, 155), @brand-primary) +} + +.bg-secondary { + background-color: @brand-secondary; +} + +.text-secondary { + color: @brand-secondary; +} + +.text-white { + color: @white !important; +} + +.bg-tertiary { + background-color: @brand-tertiary; } \ No newline at end of file diff --git a/src/main/webapp/less/overrides.less b/src/main/webapp/less/overrides.less @@ -2,6 +2,11 @@ body { overflow: auto; + #content { + background: @white; + padding-top: 0; + padding-bottom: 0; + } } @navbar-toprow: 0.40; @@ -12,9 +17,9 @@ body { margin-bottom: 0; .navbar-brand { - padding: (@navbar-padding-vertical * 0.33333) @navbar-padding-horizontal; + padding: (@navbar-padding-vertical * 0.22222) @navbar-padding-horizontal; img { - height: @navbar-height * 0.66667; + height: @navbar-height * 0.9; } } @@ -301,6 +306,28 @@ body { padding-right: 5px; } + +body { + //background: url("http://subtlepatterns.com/patterns/fresh_snow.png") repeat scroll 0% 0% transparent; + background: url("/img/mybg.png") repeat scroll 0% 0% transparent; + //background: url("https://bitpay.com/img/bg.png") repeat scroll 0% 0% transparent; +} + +#apply-atm { + div[id^="atm-"] { + padding: 30px; + } + + #atm-intro, #atm-sub-intro { + padding-top: 0; + padding-bottom: 0; + } + + #atm-benefits { + td { height: 70px; } + } +} + .alert ul { .list-unstyled(); } diff --git a/src/main/webapp/less/variables.less b/src/main/webapp/less/variables.less @@ -36,7 +36,7 @@ @greenBright: #40AC2B; @red: #a90329; @yellow: #b09b5b; -@orange: #F7931E; //#f7921d; //#C79121; +@orange: #F79220; //#f7921d; //#C79121; @orangeDark: #A57225; @pink: #ac5287; @pinkDark: #a8829f; @@ -55,6 +55,7 @@ //@brand-primary: #446E9B; @brand-primary: #3E648D; @brand-secondary: @orange; +@brand-tertiary: #95A9C1; @brand-success: #739E73; @brand-warning: @orange; @brand-danger: @red; @@ -79,6 +80,7 @@ @font-family-serif: Georgia, "Times New Roman", Times, serif; @font-family-monospace: Monaco, Menlo, Consolas, "Courier New", monospace; @font-family-base: @font-family-sans-serif; +@font-family-big-base: "Cinzel", "Open Sans", Arial, Helvetica, Sans-Serif; @font-size-base: 13px; @font-size-large: ceil(@font-size-base * 1.24); // ~16px @@ -297,8 +299,8 @@ // ------------------------- // Basics of a navbar -@navbar-height: 120px; -@navbar-margin-bottom: @line-height-computed; +@navbar-height: 80px; +@navbar-margin-bottom: @line-height-computed /2; @navbar-default-color: #777; @navbar-default-bg: #f8f8f8; @navbar-default-border: darken(@navbar-default-bg, 6.5%); @@ -696,10 +698,10 @@ //urage: background-image: url("@{base-url}/images/bg.png"); @html-background-image: "mybg.png"; -@html-background-color: @white; +@html-background-color: @body-bg; @body-background-image: "mybg.png"; -@body-background-color: @white; +@body-background-color: @body-bg; // HEADER