new framework link, remove some useless code, whitespace killer

Add new CSS framework to the tutorials page

Remove some unused code from the neocities index file and default template index file

Killed lots of white space in the files i touched...
This commit is contained in:
Scott O'Hara 2014-04-13 20:29:02 -04:00
parent c9332ad648
commit b1de628450
3 changed files with 84 additions and 85 deletions

View file

@ -4,15 +4,15 @@
<!--[if (gt IE 9)|!(IE)]><!--><html lang="en"><!--<![endif]-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Neocities.org: Create a Free website today</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"/>
@ -20,37 +20,33 @@
<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" />
<!-- Styles -->
<link href="assets/css/neo.min.css" rel="stylesheet" type="text/css" media="all"/>
<!-- If exists, brings over style blocks from child pages -->
<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" />
<!-- Tile icon for Win8 (144x144 + tile color) __doesn't validate__
<meta name="msapplication-TileImage" content="#apple-icon-144.png" />
<meta name="msapplication-TileColor" content="#222222" />
-->
<!-- 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" />
<!-- oh vanity. -->
<link rel="author" type="text/plain" href="humans.txt" />
<!--[if lt IE 9]>
<!--[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">
@ -73,9 +69,9 @@
<a href="/about" title="About NeoCities">About</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>
@ -91,10 +87,10 @@
<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">
@ -104,8 +100,8 @@
</p>
</div>
<% end %>
<div class="int-Logo hp-Logo">
<a href="/" title="back to home">
@ -124,13 +120,13 @@
<div class="header-Outro">
<div class="row header-Content content">
<ul class="col col-50 intro-List">
<li class="intro-Tools">
<span class="intro-Icon"></span>
<h2 class="eps">Create your own free website</h2>
<p class="tiny">
You get 10 MB of space to make whatever youd like with HTML, CSS, JS, IMG, TXT, and MD files.
You get 10 MB of space to make whatever youd like with HTML, CSS, JS, IMG, TXT, and MD files.
</p>
</li>
<li class="intro-Question">
@ -141,11 +137,11 @@
</p>
</li>
</ul>
<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>
@ -158,7 +154,7 @@
<a href="/dashboard" class="btn-Action">Get Started</a>
</div>
</div>
<% else %>
<form action="/new" method="get" class="signup-Form">
<fieldset class="content">
@ -169,11 +165,11 @@
<input type="submit" value="Create My Website" class="btn-Action float-Right" />
</fieldset>
</form>
<% end %>
</div> <!-- end .col-50 -->
</div> <!-- end .row -->
</div> <!-- end .header-Outro -->
@ -181,13 +177,13 @@
</header>
<main class="content-Base">
<div class="content">
<section class="featured-Websites clearfix">
<h2 class="delta">Featured Websites</h2>
<ul class="row website-Gallery hp-Gallery">
<li>
<a href="http://dragonquest.neocities.org/" title="The Quest of Dragons" target="_blank">
@ -234,37 +230,37 @@
<div class="txt-Center" style="margin-top: 15px">
<a href="/browse" title="Browse all Neocities websites" class="btn-Action btn-Large">Browse All Websites</a>
</div>
</section> <!-- end .featured-Websites -->
<hr />
<aside class="row">
<div class="col col-50">
<div class="content">
<h3 class="delta">Learn to Code</h3>
<p>
Don't know how to code a website? No problem!
Don't know how to code a website? No problem!
We're working on a batch of tutorials that will show you the way.
</p>
<code>
<span class="code-Tag">&lt;h1&gt;</span>Welcome to my website!<span class="code-Tag">&lt;/h1&gt;</span><br />
<span class="code-Tag">&lt;a</span> href="<span class="code-Value">about.html</span>">About Me<span class="code-Tag">&lt;/a&gt;</span><br />
<span class="code-Tag">&lt;img</span> src="<span class="code-Value">me.jpg</span>" alt="<span class="code-Value">photo of me</span>" <span class="code-Tag">/&gt;</span>
</code>
</div>
</div> <!-- end .col-50 -->
<div class="col col-50">
<div class="content">
<h3 class="delta">What People Are Saying</h3>
<ul class="quote-Slider kill-List">
<li class="quote">
<blockquote>
@ -273,16 +269,16 @@
<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 -->
</div> <!-- end .content -->
</main>
<footer class="footer-Base">
<section class="footer-Intro">
<div class="footer-Content">
@ -292,7 +288,7 @@
<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
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>
@ -303,7 +299,7 @@
<span class="footer-icon"></span>
<h2 class="delta">About Us</h2>
<p class="tiny">
NeoCities is here to bring back the creativity and
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>
@ -329,7 +325,7 @@
<p class="tiny col col-60 credits">
<a href="http://neocities.org" title="NeoCities.org">Neocities.org</a> is an <a href="https://github.com/neocities" title="Neocities on GitHub">open source</a> company.
</p>
<nav class="footer-Nav col col-40">
<ul class="tiny h-Nav">
<!-- <li><a href="api" title="NeoCities API">API</a></li> -->
@ -343,22 +339,22 @@
</aside>
</footer>
</div> <!-- end .page -->
<!-- scripts -->
<script src="assets/scripts/jquery-1.10.1.min.js"></script>
<script src="assets/scripts/app.min.js"></script> <!-- Script block allowing child pages to inject their own scripts -->
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID.
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID.
<script type="text/javascript>
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
g.src='//www.google-analytics.com/ga.js';
s.parentNode.insertBefore(g,s)}(document,'script'));
</script>
-->
-->
</body>
</html>

View file

@ -1,31 +1,31 @@
doctype html
html
head
meta http-equiv="Content-Type" content="text/html; charset=UTF-8"
meta charset=UTF-8"
title #{username}
meta name="description" content=""
meta name="keywords" content=""
link href="//groundfloor.neocities.org/default.css" rel="stylesheet" type="text/css" media="all"
<!--[if lt IE 9]>
link href="//groundfloor.neocities.org/default.css" rel="stylesheet" media="all"
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
<![endif]-->
body
header
h1 Welcome to my Website!
nav
ul
li
<a href="/">Home</a>
main
p This is a new page! Coming soon.
p This page uses <strong>Ground Floor</strong> to style the page, <a href="//groundfloor.neocities.org" target="_blank">click here</a> to see some code examples. You can opt-out of this style and make your own design by removing the "default.css" link in the HTML.
footer
p Copyright 2013
p Copyright 2014

View file

@ -3,19 +3,19 @@
<h2 class="alpha">
Learn to Code!
</h2>
<p class="delta">
We are currently building out our library of tutorials.
</p>
<p>
Until then, please check out the following links to get you started:
</p>
<h3>HTML</h3>
<p>HTML is short for "HyperText Markup Language", and is the basic building block used to build all web sites.</p>
<ul>
<li>
<a href="http://www.htmldog.com/guides/html/beginner" title="Learn beginner HTML">HTML Beginner Tutorial</a>
@ -30,17 +30,17 @@
<a href="http://www.codecademy.com/tracks/web" title="online lessons">Online lessons at Codecademy.com</a>
</li>
</ul>
<h3>CSS</h3>
<p>CSS is short for "Cascading Style Sheets", which is the code used to set the style of your web pages. It is embedded in your HTML, and directs how your web site should look. If HTML was your house, CSS would be what allows you to decorate the way it looks.</p>
<ul>
<li>
<a href="https://developer.mozilla.org/en-US/learn/css" title="Learn beginner CSS from Mozilla">Mozilla Learn CSS Resources</a>
</li>
</ul>
<h3>CSS Frameworks</h3>
<p>CSS frameworks are pre-built CSS styles that make it easy to quickly build a nice looking web page, without having to "roll your own" set of styles. NeoCities itself uses one as the basis for our design (Brass Tacks). They are very useful, and definitely worth checking out once you have an understanding of how CSS works.</p>
@ -52,15 +52,18 @@
<a href="http://purecss.io/" title="Yahoo!'s Pure CSS" target="_blank">Pure</a>
</li>
<li>
<a href="https://github.com/bleachedgraphics/Brass-Tacks" title="Brass Tacks (currently in Alpha. More updates to come)" target="_blank">Brass Tacks</a>
<a href="https://github.com/scottaohara/Brass-Tacks" title="Brass Tacks Sass Framework" target="_blank">Brass Tacks</a>
</li>
<li>
<a href="https://github.com/owenversteeg/min" title="Min: the world's smallest (995 bytes) CSS framework" target="_blank">Min</a>
</li>
</ul>
<h3>JavaScript</h3>
<p>JavaScript is the programming language that comes standard with all web browsers. You can embed JavaScript code into your HTML to allow you to program your web sites to do things. JavaScript was once a weak language with a lot of problems, but it is now a very fast and powerful language that is used for both web browsers and for complicated server backends (with Node.js). It is a great beginners language if you want to learn how to program, and can be used to perform almost any kind of program.</p>
<ul>
<li><a href="https://developer.mozilla.org/en-US/learn/javascript">Mozilla Learn JavaScript Resources</a></li>
</ul>
</div> <!-- end .content -->