neocities/views/plan/_pricing.erb

279 lines
No EOL
11 KiB
Text
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<section class="section plans">
<h2>Need more power? Weve got you covered.<br>Upgrading gives you more space, bandwidth, features, <strong>and helps us keep the free sites free, forever.</strong></h2>
<div class="plan-overview">
<div class="header">
<div class="col col-25 personal">
Free
</div>
<div class="col col-75 professional">
Supporter
</div>
</div>
<div class="body">
<div class="col col-25 free">
<div class="plan-image free" data-original-title="Pick me!">
</div>
<h3>Free</h3>
<div class="price">$<%= Site::PLAN_FEATURES[:free][:price] %></div>
<div class="interval">per month</div>
<a href="/" class="btn-Action">Choose</a>
<ul>
<li><strong><%= Site::PLAN_FEATURES[:free][:space].to_space_pretty %></strong> storage</li>
<li><strong><%= Site::PLAN_FEATURES[:free][:bandwidth].to_space_pretty %></strong> bandwidth</li>
</ul>
<ul>
</ul>
</div>
<div class="col col-25 supporter">
<div class="plan-image" data-original-title="No no, pick me!"></div>
<h3>Supporter</h3>
<div class="price">$<%= Site::PLAN_FEATURES[:supporter][:price] %></div>
<div class="interval">per month, billed annually</div>
<a href="/" class="btn-Action">Choose</a>
<ul>
<li><strong><%= Site::PLAN_FEATURES[:supporter][:space].to_space_pretty %></strong> storage</li>
<li><strong><%= Site::PLAN_FEATURES[:supporter][:bandwidth].to_space_pretty %></strong> bandwidth</li>
</ul>
<ul>
<li>Unlimited Sites</li>
<li>More space</li>
</ul>
</div>
<div class="col col-25 catbus">
<div class="plan-image" data-original-title="VROOOOOOM!"></div>
<h3>Cat Bus</h3>
<div class="price">$<%= Site::PLAN_FEATURES[:catbus][:price] %></div>
<div class="interval">per month</div>
<a href="/" class="btn-Action">Choose</a>
<ul>
<li><strong><%= Site::PLAN_FEATURES[:catbus][:space].to_space_pretty %></strong> storage</li>
<li><strong><%= Site::PLAN_FEATURES[:catbus][:bandwidth].to_space_pretty %></strong> bandwidth</li>
</ul>
<ul>
<li>Unlimited Sites</li>
<li>Custom SSL Certificates</li>
<li>No upload type restrictions</li>
<li>Even more space</li>
</ul>
</div>
<div class="col col-25 fatcat">
<div class="plan-image" data-original-title="Jolly good."></div>
<h3>Fat Cat</h3>
<div class="price">$<%= Site::PLAN_FEATURES[:fatcat][:price] %></div>
<div class="interval">per month</div>
<a href="/" class="btn-Action">Choose</a>
<ul>
<li><strong><%= Site::PLAN_FEATURES[:fatcat][:space].to_space_pretty %></strong> storage</li>
<li><strong><%= Site::PLAN_FEATURES[:fatcat][:bandwidth].to_space_pretty %></strong> bandwidth</li>
</ul>
<ul>
<li>Unlimited Sites</li>
<li>Custom SSL Certificates</li>
<li>No upload type restrictions</li>
<li>A lot more space!</li>
</ul>
</div>
</div>
</div>
<!-- <h2><a href="">Compare Plans <i class="fa fa-caret-down"></i></a></h2> -->
<h2 style="margin-top: 2em">Compare Plans</h2>
<table class="plan-chart">
<tr>
<th class="feature-column"></th>
<th>
<h3>Free</h3>
<p>$<%= Site::PLAN_FEATURES[:free][:price] %>/mo</p>
<a href="/" class="btn-Action">Choose</a>
</th>
<th class="professional">
<h3>Supporter</h3>
<p>$<%= Site::PLAN_FEATURES[:supporter][:price] %>/mo</p>
<a href="/" class="btn-Action">Choose</a>
</th>
<th class="professional">
<h3>Cat Bus</h3>
<p>$<%= Site::PLAN_FEATURES[:catbus][:price] %>/mo</p>
<a href="/" class="btn-Action">Choose</a>
</th>
<th class="professional">
<h3>Fat Cat</h3>
<p>$<%= Site::PLAN_FEATURES[:fatcat][:price] %>/mo</p>
<a href="/" class="btn-Action">Choose</a>
</th>
</tr>
<tr>
<td class="feature-column">
<span data-original-title="How much disk space you can use for your site. More space means you can upload more files.">Storage</span>
</td>
<td><%= Site::PLAN_FEATURES[:free][:space].to_bytes_pretty %></td>
<td><%= Site::PLAN_FEATURES[:supporter][:space].to_bytes_pretty %></td>
<td><%= Site::PLAN_FEATURES[:catbus][:space].to_bytes_pretty %></td>
<td><%= Site::PLAN_FEATURES[:fatcat][:space].to_bytes_pretty %></td>
</tr>
<tr>
<td class="feature-column">
<span data-original-title="How much content you can serve in one month. Dont worry—these are very soft limits, temporary surges are fine, we won't take your site down automatically, and we're very flexible.">Bandwidth</span>
</td>
<td><%= Site::PLAN_FEATURES[:free][:bandwidth].to_bytes_pretty %></td>
<td><%= Site::PLAN_FEATURES[:supporter][:bandwidth].to_bytes_pretty %></td>
<td><%= Site::PLAN_FEATURES[:catbus][:bandwidth].to_bytes_pretty %></td>
<td><%= Site::PLAN_FEATURES[:fatcat][:bandwidth].to_bytes_pretty %></td>
</tr>
<tr>
<td class="feature-column">
<span data-original-title="We will never put ads on your site, or give your data to marketers. In fact, were prohibited from doing it in our own Terms of Service.">No advertising, ever</span>
</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>
<td class="feature-column">
<span data-original-title="Our worldwide network of CDN servers cache your web site regionally, making your site load fast—no matter where your users are. 頑張る, 日本!">Global CDN Site Cache</span>
</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>
<td class="feature-column">
<span data-original-title="Each site comes with a free Neocities address (yoursitename.neocities.org).">Free Site Subdomain</span>
</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>
<td class="feature-column">
<span data-original-title="Add your domain name (yoursite.com) to your site!">Custom Domains</span>
</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>
<td class="feature-column">
<span data-original-title="You can mount your Neocities site to your computer as a hard drive, making it easy to update with your favorite HTML editor.">WebDAV Uploading</span>
</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>
<td class="feature-column">
<span data-original-title="Downloading your neocities site is as easy as clicking a button.">One-Click Backups</span>
</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>
<td class="feature-column">
<span data-original-title="Site tags make it easy to find sites youre interested in, and join communities of sites. Its like a web ring, but even better.">Site Tags</span>
</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>
<td class="feature-column">
<span data-original-title="Each site has its own RSS feed that make it easy to let people know when your site changes.">RSS Feed</span>
</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>
<td class="feature-column">
<span data-original-title="Like a site on Neocities? Now you can follow it, and see when they update!">Follow Your Favorite Sites</span>
</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>
<td class="feature-column">
<span data-original-title="Each site now has its own profile page, allowing users to see when your site updates, follow your site, and leave feedback.">Site Profile</span>
</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>
<td class="feature-column">
<span data-original-title="Our HTML5 site editor makes it easy to make quick changes to your site, even if youre on the run.">Neocities Site Editor</span>
</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>
<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>
<td class="feature-column">
<span data-original-title="Make as many sites as you want, with one account.">Unlimited Site Creation</span>
</td>
<td></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>
<td class="feature-column">
<span data-original-title="Upload your SSL certificate for your domain name, preventing snoops from seeing your users traffic.">Custom SSL Certificates</span>
</td>
<td></td>
<td></td>
<td><i class="fa fa-check"></i></td>
<td><i class="fa fa-check"></i></td>
</tr>
<tr>
<td class="feature-column">
<span data-original-title="No whitelists—you can upload anything you want (no copyrighted content, trojans, or w4r3z, please).">No File Upload Type Restrictions</span>
</td>
<td></td>
<td></td>
<td><i class="fa fa-check"></i></td>
<td><i class="fa fa-check"></i></td>
</tr>
</table>
</section>
<script>
$(function() {
$('.feature-column span').tooltip({
placement: 'right'
})
$('.plan-image').tooltip({
placement: 'top'
})
})
</script>