neocities/views/newindex_mockup.erb
2014-09-23 13:53:58 -07:00

340 lines
No EOL
13 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.

<!doctype html>
<!--[if IE 8 ]><html lang="en" class="ieAll ie8"><![endif]-->
<!--[if IE 9 ]><html lang="en" class="ieAll ie9"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html lang="en"><!--<![endif]-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Neocities: Create your free website now!</title>
<meta itemprop="name" content="Neocities.org" />
<meta itemprop="description" content="Create your own free home page, and do whatever you want with it." />
<meta name="description" content="Neocities is the new Geocities. Create your own free home page, and do whatever you want with it." />
<meta name="keywords" content="free website, html, css, learn to code, free hosting, build a website, create a web page" />
<link rel="canonical" href="//neocities.org" />
<meta property="og:title" content="Neocities"/>
<meta property="og:site_name" content="Neocities | neocities.org"/>
<meta property="og:type" content="website"/>
<meta property="og:image" content=""/>
<meta property="og:url" content="//www.neocities.org"/>
<meta property="og:description" content="Neocities is the new Geocities. Create your own free home page, and do whatever you want with it."/>
<meta content="pBkqwF1U/KpuF2+f0ZhSf8BnpxYgeU0boCTdnB3joGc=" name="csrf-token" />
<link rel="shortcut icon" type="image/ico" href="/favicon.ico" />
<link rel="apple-touch-icon-precomposed" href="#apple-icon-144.png" />
<link rel="apple-touch-startup-image" href="#startup.png" />
<!-- Mobile Meta -->
<meta name="HandheldFriendly" content="True" />
<meta name="MobileOptimized" content="320" />
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1" />
<link href="/css/neo.css" rel="stylesheet" type="text/css" media="all"/>
<!--[if lt IE 9]>
<script type="text/javascript" src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body class="hp">
<div class="page">
<header class="header-Base">
<nav class="header-Nav clearfix" role="navigation">
<a href="#!" title="show small screen nav" class="small-Nav">
<img src="/img/nav-Icon.png" alt="navigation icon" />
</a>
<ul class="h-Nav constant-Nav">
<li>
<a href="/" title="back to the start">Neocities</a>
</li>
<li>
<a href="/browse" title="Browse Neocities member websites">Websites</a>
</li>
<li>
<a href="/tutorials" title="Learn to code with these tutorials">Tutorials</a>
</li>
<li>
<a href="/api" title="Neocities Developers API">API</a>
</li>
<li>
<a href="/about" title="About Neocities">About</a>
</li>
<li>
<a href="/plan" title="Support Neocities">Support Us</a>
</li>
</ul>
<ul class="status-Nav">
<% if !signed_in? %>
<li>
<a href="/signin" class="sign-In" title="Sign into your account">Sign In</a>
</li>
<% else %>
<li>
<a href="/dashboard" class="sign-In">Dashboard</a>
</li>
<li>
<a href="/settings" class="sign-In">Settings</a>
</li>
<li>
<a href="/signout" class="sign-In">Signout</a>
</li>
<% end %>
</ul>
</nav>
<% if flash.keys.length > 0 %>
<div class="alert txt-Center">
<p style="padding:5px">
<% flash.keys.each do |key| %>
<%= flash[key] %>
<% end %>
</p>
</div>
<% end %>
<div class="int-Logo hp-Logo">
<a href="/" title="back to home">
<span class="hidden">Neocities.org</span>
<img src="/img/cat.png" alt="Neocities.org" />
</a>
</div>
<section class="header-Intro">
<h1 class="logo header-Content content">
<span class="hidden">Neocities.org</span>
<img src="/img/neocities-Logo.png" alt="Neocities.org" />
</h1>
</section>
<div class="header-Outro">
<div class="row header-Content content">
<div class="col col-50">
<h2 class="section-header">Introducing the New Neocities</h2>
<p class="intro-text">Nows a great time to join our community of over <%= @sites_count.to_s.reverse.gsub(/...(?=.)/,'\&,').reverse %> websites!
You get <%= Site::FREE_MAXIMUM_IN_MEGABYTES %> MB of free web space to make whatever youd like. </p>
<ul class="intro-List">
<li class="intro-Tools">
<span class="intro-Icon"></span>
<h2 class="delta">Free web hosting goes social</h2>
<p class="base">
Follow your favorite Neocities sites to keep up with all the latest updates! You can also now discover new websites related to your interests, comment on them, and share them.
</p>
</li>
<li class="intro-Social">
<span class="intro-Icon"></span>
<h2 class="delta">Making the web fun again</h2>
<p class="base">
Weve been working to make it easier to build your website and explore other sites. Neocities now has folders, tag browsing (our take on webrings), WebDAV uploading, RSS subscriptions, and more!
</li>
</ul>
</div>
<div class="col col-50 signup-Area">
<% if signed_in? %>
<div class="signup-Form">
<div class="content">
<h2 class="gamma txt-Center">Build your Website!</h2>
</div>
<p class="txt-Center">
Go to your dashboard to<br> start editing your website!
</p>
<br />
<div class="txt-Center">
<a href="/dashboard" class="btn-Action">Get Started</a>
</div>
</div>
<% else %>
<form action="/new" method="get" class="signup-Form">
<fieldset class="content">
<h2 class="gamma">Sign up for free</h2>
<hr />
<label for="create-Input">Username</label>
<input type="text" class="input-Area" id="create-Input" name="username" placeholder="my-site-name" />
<label for="create-Input" id="domain-name">.neocities.org</label>
<label for="tags-input">Tags (your interests, site topics)</label>
<input type="text" class="input-Area" id="tags-input" name="tags" placeholder="art, videogames, food, music, programming, gardening, cats" />
<div class="col col-50" style="padding-left:0;">
<label for="password-input">Password</label>
<input type="text" class="input-Area" id="password-input" name="password" placeholder="password" />
</div>
<div class="col col-50">
<label for="email-input">Email</label>
<input type="text" class="input-Area" id="email-input" name="email" placeholder="me@example.com" />
</div>
<input type="submit" value="Create My Site" class="btn-Action float-Right" />
</fieldset>
</form>
<% end %>
</div> <!-- end .col-50 -->
</div> <!-- end .row -->
</div> <!-- end .header-Outro -->
</header>
<main class="content-Base">
<div class="section featured-Websites">
<div class="nav prev"></div>
<ul class="website-Gallery hp-Gallery">
<li>
<a href="http://dragonquest.neocities.org/" title="The Quest of Dragons" target="_blank">
<img src="//neocities.org/site_screenshots/dragonquest/index.html.270x162.jpg" class="neo-SS" alt="Thumbnail of The Quest of Dragons" />
</a>
</li>
<li>
<a href="http://codeventurer.neocities.org/" title="codeventurer" target="_blank">
<img src="http://neocities.org/site_screenshots/codeventurer/index.html.270x162.jpg" class="neo-SS" alt="Thumbnail of codeventurer" />
</a>
</li>
<li>
<a href="http://clouds.neocities.org/" title="Cloud Quotes" target="_blank">
<img src="//neocities.org/site_screenshots/clouds/index.html.270x162.jpg" class="neo-SS" alt="Thumbnail of Cloud Quotes" />
</a>
</li>
<li>
<a href="http://manatee.neocities.org/" title="Title of Website" target="_blank">
<img src="//neocities.org/site_screenshots/manatee/index.html.270x162.jpg" class="neo-SS" alt="Thumbnail of TITLE OF WEBSITE" />
</a>
</li>
<li>
<a href="http://suppilulemur.neocities.org/" title="Sokoban" target="_blank">
<img src="//neocities.org/site_screenshots/suppilulemur/index.html.270x162.jpg" class="neo-SS" alt="Thumbnail of Sokoban" />
</a>
</li>
<li>
<a href="http://drawinglair.neocities.org/" title="Tomasz Zawadzki" target="_blank">
<img src="//neocities.org/site_screenshots/drawinglair/index.html.270x162.jpg" class="neo-SS" alt="Thumbnail of Tomasz Zawadzki" />
</a>
</li>
</ul>
<div class="nav next"></div>
</div>
<section class="section features">
<h2 class="delta">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce dapibus semper magna id euismod. Vivamus rutrum ultricies.</h2>
<div class="col col-33">
<h3>You own your own site</h3>
<p>We support custom domains (yoursite.com) for free. This means you always control the content on your site, and you can move it to/from Neocities whenever you want. And of course, all sites still get a subdomain (sitename.neocities.org) for free.</p>
<h3>Developer tools</h3>
<p>We now have powerful APIs for developers building applications, and support for remote file uploading via command line tools. Using WebDAV, you can now mount your site to your computer, just like Dropbox.</p>
</div>
<div class="col col-33">
<h3>More space, more performance</h3>
<p>Neocities now uses a distributed, globally-cached file system in tier-1 datacenters to serve your sites. It's a system that took us a year to build - and it's ready to serve your site with blazing speed, whether it's your personal home page, or your professional site. Go ahead, put your site on Neocities. We can handle it.</p>
</div>
<div class="col col-33">
<h3>Encrypted everything</h3>
<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>
</div>
</section>
<section class="section last">
<aside class="row">
<div class="col col-50">
<div class="content">
<h2>Get Started Today!</h2>
<p>signup</p>
</div>
</div> <!-- end .col-50 -->
<div class="col col-50">
<div class="content">
<ul class="quote-Slider kill-List">
<li class="quote">
<blockquote>
Designed as a 21st century reincarnation of GeoCities, Neocities lets you make your own site for free. And it just might spark a renaissance of creativity online.
</blockquote>
<a href="http://web.appstorm.net/reviews/web-dev/neocities-the-free-place-to-code-your-own-site-from-scratch/" title="App Storm" class="action-Link">Source link</a>
</li>
</ul>
</div>
</div> <!-- end .col-50 -->
</aside> <!-- end .row -->
</section>
</main>
<footer class="footer-Base">
<section class="footer-Intro">
<div class="footer-Content">
<div class="row">
<div class="col col-33">
<div class="f-Col f-Col-1 clearfix">
<span class="footer-icon"></span>
<h2 class="delta">Support Us</h2>
<p class="tiny">
Neocities is funded by donations. If youd like to contribute, you can help us
pay our server costs using Bitcoin or PayPal.
</p>
<a href="/donate" title="Donate to Neocities" class="action-Link">Donate Today</a>
</div>
</div>
<div class="col col-33">
<div class="f-Col f-Col-2 clearfix">
<span class="footer-icon"></span>
<h2 class="delta">About Us</h2>
<p class="tiny">
Neocities is here to bring back the creativity and
free expression to the world wide web that made it great.
</p>
<a href="/about" title="More about Neocities" class="action-Link">More About Us</a>
</div>
</div>
<div class="col col-33">
<div class="f-Col f-Col-3 clearfix">
<span class="footer-icon"></span>
<h2 class="delta">Latest News</h2>
<p class="tiny">
The latest news on Neocities can be found on our blog.
</p>
<a href="/blog" title="Read about Neocities news and updates" class="action-Link">Read More</a>
</div>
</div>
</div>
</div>
</section>
<%== erb :'_footer', layout: false%>
</footer>
</div>
<script src="/js/jquery-1.11.0.min.js"></script>
<script src="/js/app.min.js"></script>
</body>
</html>