mirror of
https://github.com/neocities/neocities.git
synced 2025-04-28 11:12:30 +02:00
Added press section and plan charts to home page
This commit is contained in:
Victoria Wang
parent
df1b3f86a5
commit
b105d55316
5 changed files with 241 additions and 96 deletions
BIN
public/img/ars-logo.png
Normal file
BIN
public/img/ars-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
public/img/vice-logo.png
Normal file
BIN
public/img/vice-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
BIN
public/img/wired-logo.png
Normal file
BIN
public/img/wired-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
|
|
@ -755,13 +755,14 @@ a.tag:hover {
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
.section {
|
.section {
|
||||||
padding: 50px 8%;
|
padding: 55px 8%;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
.section h2 {
|
.section h2 {
|
||||||
font-size: 1.7em;
|
font-size: 1.7em;
|
||||||
text-align:center;
|
text-align:center;
|
||||||
|
line-height: 150%;
|
||||||
}
|
}
|
||||||
.section h3 {
|
.section h3 {
|
||||||
font-size: 1.4em;
|
font-size: 1.4em;
|
||||||
|
|
@ -785,7 +786,6 @@ a.tag:hover {
|
||||||
background-size: 22px;
|
background-size: 22px;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-position: center center;
|
background-position: center center;
|
||||||
|
|
||||||
margin: auto 0px;
|
margin: auto 0px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0; bottom: 0;
|
top: 0; bottom: 0;
|
||||||
|
|
@ -799,9 +799,10 @@ a.tag:hover {
|
||||||
}
|
}
|
||||||
.section.features {
|
.section.features {
|
||||||
background: #4F7E89;
|
background: #4F7E89;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
.section.features .col {
|
.section.features .col {
|
||||||
padding-left: 35px;
|
padding-left: 40px;
|
||||||
}
|
}
|
||||||
.section.features .col:first-child {
|
.section.features .col:first-child {
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
|
|
@ -810,20 +811,156 @@ a.tag:hover {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
.section.features .fa {
|
.section.features .fa {
|
||||||
margin-right: 9px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
.section.features .fa-wrench {
|
.section.features .fa-wrench {
|
||||||
vertical-align: 2px;
|
vertical-align: 2px;
|
||||||
margin-right: 4px;
|
margin-right: 9px;
|
||||||
}
|
}
|
||||||
.section.features .fa-tachometer {
|
.section.features .fa-tachometer {
|
||||||
margin-right: 11px;
|
margin-right: 11px;
|
||||||
}
|
}
|
||||||
.section.last {
|
.section.features p, .section.features h3 {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
.section .press {
|
||||||
|
display: inline-block;
|
||||||
|
clear: both;
|
||||||
|
margin-top: 30px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.section .logo {
|
||||||
|
float:left;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
margin-right: 30px;
|
||||||
|
}
|
||||||
|
.section .logo.wired {
|
||||||
|
width: 211px;
|
||||||
|
height: 44px;
|
||||||
|
background-image: url(/img/wired-logo.png);
|
||||||
|
background-size: 211px;
|
||||||
|
margin-top: 6px;
|
||||||
|
margin-right: 40px;
|
||||||
|
}
|
||||||
|
.section .logo.vice {
|
||||||
|
width: 160px;
|
||||||
|
height: 50px;
|
||||||
|
background-image: url(/img/vice-logo.png);
|
||||||
|
background-size: 160px;
|
||||||
|
}
|
||||||
|
.section .logo.ars {
|
||||||
|
width: 187px;
|
||||||
|
height: 62px;
|
||||||
|
background-image: url(/img/ars-logo.png);
|
||||||
|
background-size: 187px;
|
||||||
|
margin-top: -4px;
|
||||||
|
}
|
||||||
|
.section .press .more {
|
||||||
|
color: #A0BAC0;
|
||||||
|
float:right;
|
||||||
|
margin-top: 6px;
|
||||||
|
margin-right: 30px;
|
||||||
|
}
|
||||||
|
.section.plans {
|
||||||
background: #fff;
|
background: #fff;
|
||||||
}
|
}
|
||||||
.section.last h2, .section.last blockquote {
|
.section.plans h2 {
|
||||||
|
color:#4F7E89;
|
||||||
|
}
|
||||||
|
.plan-overview {
|
||||||
|
margin-top: 2.5em;
|
||||||
|
margin-bottom: 2em;
|
||||||
|
}
|
||||||
|
.plan-overview .header {
|
||||||
|
display:table;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.plan-overview .header .col {
|
||||||
|
font-size:.8em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
padding: 8px 20px;
|
||||||
|
display:table-cell;
|
||||||
|
}
|
||||||
|
.plan-overview .header .personal {
|
||||||
|
background: #D6D6D6;
|
||||||
|
}
|
||||||
|
.plan-overview .header .professional {
|
||||||
|
background: #DAEEA5;
|
||||||
|
}
|
||||||
|
.plan-overview .body {
|
||||||
|
text-align: center;
|
||||||
|
clear:both;
|
||||||
|
display:table;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.plan-overview .body h3, .plan-chart h4 {
|
||||||
color: black;
|
color: black;
|
||||||
|
font-weight:bold;
|
||||||
|
font-size:1.2em;
|
||||||
|
font-family: "Lucida Grande", verdana, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
|
margin-bottom: -2px;
|
||||||
|
}
|
||||||
|
.plan-overview .price {
|
||||||
|
font-size: 2em;
|
||||||
|
}
|
||||||
|
.plan-overview .interval {
|
||||||
|
font-size: .8em;
|
||||||
|
margin-top: -.6em;
|
||||||
|
}
|
||||||
|
.plan-overview .btn-Action {
|
||||||
|
margin: .9em 0 1.4em 0;
|
||||||
|
}
|
||||||
|
.plan-overview .col {
|
||||||
|
padding-bottom:1.5em;
|
||||||
|
padding-left: 0;
|
||||||
|
display: table-cell;
|
||||||
|
background: #F8F8F8;
|
||||||
|
float:none;
|
||||||
|
}
|
||||||
|
.plan-overview .body .col:nth-of-type(2), .plan-overview .body .col:nth-of-type(4) {
|
||||||
|
background: #F5F5F5;
|
||||||
|
}
|
||||||
|
.plan-overview ul {
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.plan-overview li {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.plan-chart {
|
||||||
|
margin: 2em 0 4em 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.plan-chart th {
|
||||||
|
background: #D6D6D6;
|
||||||
|
padding: 15px 0;
|
||||||
|
}
|
||||||
|
.plan-chart th.professional {
|
||||||
|
background: #DAEEA5;
|
||||||
|
}
|
||||||
|
.plan-chart th p {
|
||||||
|
margin: .3em 0 .6em 0;
|
||||||
|
}
|
||||||
|
.plan-chart td {
|
||||||
|
border: 1px solid #ECECEC;
|
||||||
|
background:#F5F5F5;
|
||||||
|
padding: 7px 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.plan-chart .feature-column {
|
||||||
|
width: 21em;
|
||||||
|
text-align:right;
|
||||||
|
font-size: .9em;
|
||||||
|
font-weight: bold;
|
||||||
|
border: 0;
|
||||||
|
background: 0;
|
||||||
|
padding-right: 15px;
|
||||||
|
}
|
||||||
|
.plan-chart td:nth-child(even) {
|
||||||
|
background: #F8F8F8;
|
||||||
|
}
|
||||||
|
.plan-chart .fa-check {
|
||||||
|
color: #6CCC24;
|
||||||
}
|
}
|
||||||
.selected {
|
.selected {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
|
|
||||||
|
|
@ -253,23 +253,31 @@
|
||||||
<p>Neocities now secures serving all your content with Snowden-grade cryptography, <em>by default</em>, preventing snoops, whether they are hackers or rogue government agencies, from seeing what you browse. And we're working on letting you use your own SSL (HTTPS) certificates for custom domains.
|
<p>Neocities now secures serving all your content with Snowden-grade cryptography, <em>by default</em>, preventing snoops, whether they are hackers or rogue government agencies, from seeing what you browse. And we're working on letting you use your own SSL (HTTPS) certificates for custom domains.
|
||||||
|
|
||||||
Until January, Neocities will donate 5% of all Supporter plan proceeds to the Courage Foundation, an international organization that supports those who risk life or liberty to disclose privacy abuses online.</p>
|
Until January, Neocities will donate 5% of all Supporter plan proceeds to the Courage Foundation, an international organization that supports those who risk life or liberty to disclose privacy abuses online.</p>
|
||||||
</div></div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="press">
|
||||||
|
<a href="http://www.wired.com/2013/07/neocities/" class="logo wired"></a>
|
||||||
|
<a href="http://motherboard.vice.com/blog/neocities-is-recreating-the-garish-web-10-creativity-of-geocities" class="logo vice"></a>
|
||||||
|
<a href="http://arstechnica.com/tech-policy/2014/05/web-host-gives-fcc-a-28-8kbps-slow-lane-in-net-neutrality-protest/" class="logo ars"></a>
|
||||||
|
<a href="/press" class="more">See all press »</a>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="section last">
|
<section class="section plans">
|
||||||
<h2>All Neocities plans include a neocities.org subdomain, WebDAV uploading, one-click backups, and all our social features. We'll never show ads on your site.</h2>
|
<h2>All Neocities plans include a neocities.org subdomain, WebDAV uploading, one-click backups, and all our social features. We'll never show ads on your site.</h2>
|
||||||
|
|
||||||
<div class="plan-overview">
|
<div class="plan-overview">
|
||||||
<div class="row header">
|
<div class="header">
|
||||||
<div class="col col-50">
|
<div class="col col-50 personal">
|
||||||
Personal
|
Personal
|
||||||
</div>
|
</div>
|
||||||
<div class="col col-50">
|
<div class="col col-50 professional">
|
||||||
Professional
|
Professional
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row body">
|
<div class="body">
|
||||||
<div class="col col-25">
|
<div class="col col-25">
|
||||||
<h3>Free</h3>
|
<h3>Free</h3>
|
||||||
<div class="price">$0</div>
|
<div class="price">$0</div>
|
||||||
|
|
@ -339,29 +347,29 @@
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h2><a href="">Compare Plans <i class="fa fa-chevron-down"></i></a></h2>
|
<h2><a href="">Compare Plans <i class="fa fa-caret-down"></i></a></h2>
|
||||||
|
|
||||||
<table class="plan-chart">
|
<table class="plan-chart">
|
||||||
<tr>
|
<tr>
|
||||||
<th class="feature-column"></th>
|
<th class="feature-column"></th>
|
||||||
<th>
|
<th>
|
||||||
<h4>Free</h4>
|
<h4>Free</h4>
|
||||||
<p>$0</p>
|
<p>$0/mo</p>
|
||||||
<a href="/" class="btn-Action">Choose</a>
|
<a href="/" class="btn-Action">Choose</a>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<h4>Supporter</h4>
|
<h4>Supporter</h4>
|
||||||
<p>$5</p>
|
<p>$5/mo</p>
|
||||||
<a href="/" class="btn-Action">Choose</a>
|
<a href="/" class="btn-Action">Choose</a>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th class="professional">
|
||||||
<h4>Cat Bus</h4>
|
<h4>Cat Bus</h4>
|
||||||
<p>$20</p>
|
<p>$20/mo</p>
|
||||||
<a href="/" class="btn-Action">Choose</a>
|
<a href="/" class="btn-Action">Choose</a>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th class="professional">
|
||||||
<h4>Fat Cat</h4>
|
<h4>Fat Cat</h4>
|
||||||
<p>$50</p>
|
<p>$50/mo</p>
|
||||||
<a href="/" class="btn-Action">Choose</a>
|
<a href="/" class="btn-Action">Choose</a>
|
||||||
</th>
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
|
|
@ -374,122 +382,122 @@
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">Bandwidth</td>
|
<td class="feature-column">Bandwidth</td>
|
||||||
<td></td>
|
<td>10 GB</td>
|
||||||
<td></td>
|
<td>100 GB</td>
|
||||||
<td></td>
|
<td>500 GB</td>
|
||||||
<td></td>
|
<td>2 TB</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">No advertising, ever</td>
|
<td class="feature-column">No advertising, ever</td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">WebDAV Uploading</td>
|
<td class="feature-column">WebDAV Uploading</td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">Neocities.org Subdomain</td>
|
<td class="feature-column">Neocities.org Subdomain</td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">One-Click Backups</td>
|
<td class="feature-column">One-Click Backups</td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">Site Tags</td>
|
<td class="feature-column">Site Tags</td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">RSS Feed</td>
|
<td class="feature-column">RSS Feed</td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">Follow Your Favorite Sites</td>
|
<td class="feature-column">Follow Your Favorite Sites</td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">Site Profile</td>
|
<td class="feature-column">Site Profile</td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">Neocities Site Editor</td>
|
<td class="feature-column">Neocities Site Editor</td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="feature-column">Site Tipping (Coming Soon)</td>
|
||||||
|
<td><i class="fa fa-check"></i></td>
|
||||||
|
<td><i class="fa fa-check"></i></td>
|
||||||
|
<td><i class="fa fa-check"></i></td>
|
||||||
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">Custom Domains</td>
|
<td class="feature-column">Custom Domains</td>
|
||||||
<td></td>
|
<td></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">High Performance Global CDN Cache</td>
|
<td class="feature-column">High Performance Global CDN Cache</td>
|
||||||
<td></td>
|
<td></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">DDoS Mitigation</td>
|
<td class="feature-column">DDoS Mitigation</td>
|
||||||
<td></td>
|
<td></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">Unlimited Site Creation (Coming Soon)</td>
|
<td class="feature-column">Unlimited Site Creation (Coming Soon)</td>
|
||||||
<td></td>
|
<td></td>
|
||||||
<td></td>
|
<td></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td class="feature-column">Site Tipping (Coming Soon)</td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">Custom SSL Certificates</td>
|
<td class="feature-column">Custom SSL Certificates</td>
|
||||||
<td></td>
|
<td></td>
|
||||||
<td></td>
|
<td></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="feature-column">No File Upload Type Restrictions</td>
|
<td class="feature-column">No File Upload Type Restrictions</td>
|
||||||
<td></td>
|
<td></td>
|
||||||
<td></td>
|
<td></td>
|
||||||
<td></td>
|
<td></td>
|
||||||
<td></td>
|
<td><i class="fa fa-check"></i></td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue