Lots of little homepage style tweaks

This commit is contained in:
Victoria Wang 2014-10-17 18:20:11 -07:00
parent 5f7821accf
commit 36c7186637
3 changed files with 25 additions and 14 deletions

View file

@ -47,8 +47,11 @@
} }
.hp { .hp {
.header-Outro { .header-Outro {
.col-50.signup-Area { .col.intro {
width: 48%; width: 53%;
}
.col.signup-Area {
width: 45%;
} }
.signup-Area { .signup-Area {
float: right; float: right;
@ -56,7 +59,7 @@
.intro-text { .intro-text {
color: #B8D375; color: #B8D375;
font-size: .9em; font-size: .9em;
margin-bottom: 1.8em; margin-bottom: 1.6em;
a { a {
color: #B8D375; color: #B8D375;
@ -68,8 +71,8 @@
} }
h2.section-header { h2.section-header {
font-size: 2.2em; font-size: 2.2em;
margin-top: .5em; margin-top: .4em;
margin-bottom: 0.1em; margin-bottom: 0.2em;
} }
} }
} }
@ -88,11 +91,13 @@
} }
h2{ h2{
margin-bottom:2px; margin-bottom: 0px;
font-size: 1.525em;
} }
p { p {
color:#B2BCC1; color:#B2BCC1;
line-height: 170%;
} }
} }
@ -127,11 +132,11 @@
position:relative position:relative
} }
.signup-Form{ .header-Outro .signup-Form{
background:#354751; background:#354751;
border-radius:4px 4px 0 0; border-radius:4px 4px 0 0;
@include box-shadow($signupShadow); @include box-shadow($signupShadow);
height:600%; height:700%;
overflow:hidden; overflow:hidden;
position:absolute; position:absolute;
top: -40px; top: -40px;
@ -160,7 +165,7 @@
fieldset{ fieldset{
background:url(/img/sign-up-bg.png) repeat-x center top; background:url(/img/sign-up-bg.png) repeat-x center top;
padding: 20px 33px; padding: 22px 33px;
} }
label{ label{
@ -181,7 +186,7 @@
border:0 solid black; border:0 solid black;
@include box-shadow($inputAreaShadow); @include box-shadow($inputAreaShadow);
color:#C2CFD4; color:#C2CFD4;
margin-bottom:$spacing*7; margin-bottom:30px;
margin-right:$spacing; margin-right:$spacing;
padding: 10px 10px 7px 10px; padding: 10px 10px 7px 10px;
width:100%; width:100%;
@ -196,6 +201,8 @@
} }
.btn-Action{ .btn-Action{
padding:10px 25px; padding:10px 25px;
margin-top: 6px;
font-size: 1em;
} }
} }

View file

@ -13,7 +13,7 @@
} }
} }
.content, .footer-Content { .content, .footer-Content {
padding: 20px 3%; padding: 20px 2.5%;
} }
.single-Col{ .single-Col{
max-width:800px; max-width:800px;
@ -913,6 +913,10 @@ a.tag:hover {
.section.plans { .section.plans {
background: #fff; background: #fff;
width: 100%; width: 100%;
@media(max-device-width:480px), screen and (max-width:550px) {
padding: 55px 3%;
}
} }
.section.plans h2 { .section.plans h2 {
color:#4F7E89; color:#4F7E89;

View file

@ -117,7 +117,7 @@
<div class="header-Outro"> <div class="header-Outro">
<div class="row header-Content content"> <div class="row header-Content content">
<div class="col col-50"> <div class="col intro">
<h2 class="section-header">Make your own web site, and discover new ones.</h2> <h2 class="section-header">Make your own web site, and discover new ones.</h2>
<p class="intro-text"> <p class="intro-text">
Neocities is a community of <a href="/browse"><%= @sites_count.to_s.reverse.gsub(/...(?=.)/,'\&,').reverse %> websites</a> that are bringing back creative expression on the web. Anyone can make a site, only your imagination is required. We provide the space, you provide the creativity. Join us! Neocities is a community of <a href="/browse"><%= @sites_count.to_s.reverse.gsub(/...(?=.)/,'\&,').reverse %> websites</a> that are bringing back creative expression on the web. Anyone can make a site, only your imagination is required. We provide the space, you provide the creativity. Join us!
@ -125,7 +125,7 @@
<ul class="intro-List"> <ul class="intro-List">
<li class="intro-Social"> <li class="intro-Social">
<span class="intro-Icon"></span> <span class="intro-Icon"></span>
<h2 class="delta">Share your web site creation with the world</h2> <h2 class="delta">Share your web creation with the world</h2>
<p class="base"> <p class="base">
Follow your favorite Neocities sites to keep up with all the latest updates. Discover new websites related to your interests, comment on them, and share them. Unlimited creativity - and zero ads. Follow your favorite Neocities sites to keep up with all the latest updates. Discover new websites related to your interests, comment on them, and share them. Unlimited creativity - and zero ads.
</p> </p>
@ -139,7 +139,7 @@
</ul> </ul>
</div> </div>
<div class="col col-50 signup-Area"> <div class="col signup-Area">
<% if signed_in? %> <% if signed_in? %>
<div class="signup-Form"> <div class="signup-Form">