zydronium/neocities
1
0
Fork 0
mirror of https://github.com/neocities/neocities.git synced 2025-04-24 17:22:35 +02:00
Code Issues Projects Releases Packages Wiki Activity

Initial work on preview section

Browse source
This commit is contained in:
Victoria Wang 2014-10-24 19:19:25 -07:00
parent a2f9c65a3f
commit 2ae81b6624
2 changed files with 77 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
sass/_project-sass/_project-Main.scss
View file

@ -849,6 +849,55 @@ a.tag:hover {
.section p, .section li {
font-size: .85em;
}
.section.previews {
background: #FAF6F1;
h3 {
line-height: 130%;
font-size: 1.6em;
margin-top: 0;
}
h2, h3 {
color: #335062;
}
p {
color: #666;
line-height: 180%;
font-size: .9em;
}
.row {
margin: 5em 10%;
padding: 0;
&:first-of-type {
margin-top: 3.5em;
}
&:last-of-type {
margin-bottom: 2.5em;
}
.col {
padding-left: 0;
padding-right: 30px;
&.text {
padding-top: 2em;
}
}
.screenshot {
width: 100%;
height: 250px;
margin-right: 30px;
background: white;
border: 6px solid white;
@include box-shadow(1px 1px 2px 0px rgba(0, 0, 0, 0.18));
}
&.right {
.col {
padding-right: 0;
&.text {
padding-right: 30px;
}
}
}
}
}
.section.featured-Websites {
background: #971D31;
padding: 30px 0;

28
views/index.erb
View file

@ -240,6 +240,34 @@
<div class="nav next"></div>
</div>
<div class="section previews">
<h2>Forget boring social networks. Let’s make the internet fun again. It’s time to bring back web surfing!</h2>
<div class="row content">
<div class="col col-50"><div class="screenshot"></div></div>
<div class="col col-50 text">
<h3>Follow your favorite Neocities sites</h3>
<p>Find an neat site in our <a href="/browse">website gallery</a>? You can now keep track of new updates by following Neocities sites. Any changes to the sites will show up in your news feed.</p>
</div>
</div>
<div class="row content right">
<div class="col col-50 text">
<h3>Leave comments on Neocities site profiles</h3>
<p>Fate. It protects fools, little children, and ships named "Enterprise." I'll be sure to note that in my log. That might've been one of the shortest assignments in the history of Starfleet. Damage report!</p>
</div>
<div class="col col-50"><div class="screenshot"></div></div>
</div>
<div class="row content">
<div class="col col-50"><div class="screenshot"></div></div>
<div class="col col-50 text">
<h3>Discover new sites related to your interests</h3>
<p>Fate. It protects fools, little children, and ships named "Enterprise." I'll be sure to note that in my log. That might've been one of the shortest assignments in the history of Starfleet. Damage report!</p>
</div>
</div>
</div>
<section class="section features">
<h2 class="delta">Forget boring social networks. Let’s make the internet fun again. It’s time to bring back web surfing!</h2>