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

markup & accessibility updates

Browse source 
quick pass through some files to get some low hanging accessibility & markup semantic updates.
This commit is contained in:
Scott 2015-02-02 20:54:35 -05:00
parent 963bb29d9d
commit 42820c848b
11 changed files with 180 additions and 157 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
views/about.erb
View file

@ -1,12 +1,12 @@
<div class="header-Outro">
<div class="row content single-Col">
<h1>About Neocities</h1>
<h3 class="subtitle">Your free web page is waiting&#8230; once again.</h3>
<h2 class="subtitle">Your free web page is waiting&#8230; once again.</h2>
</div>
</div>
<div class="content single-Col misc-page">
<article>
<article role="article">
<h1>Neocities is bringing back the fun, creativity and independence that made the web great.</h1>
<p>

2
views/admin.erb
View file

@ -1,7 +1,7 @@
<div class="header-Outro">
<div class="row content single-Col">
<h1>Administration</h1>
<h3 class="subtitle">Freedom Ain't Free</h3>
<h2 class="subtitle">Freedom Ain't Free</h2>
</div>
</div>

2
views/browse.erb
View file

@ -44,7 +44,7 @@
<form method="GET" action="browse">
<fieldset class="grouping">
<label class="text-Label" for="tag">Search by tag:</label>
<input class="input-Area typeahead" name="tag" type="text" placeholder="pokemon" value="<%= params[:tag] %>" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" dir="auto">
<input class="input-Area typeahead" id="tag" name="tag" type="text" placeholder="pokemon" value="<%= params[:tag] %>" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" dir="auto">
<input style="vertical-align: -4px;margin-left: 4px;" type="submit" class="btn-Action" value="Search">
</fieldset>
</div>

13
views/contact.erb
View file

@ -7,7 +7,6 @@
<div class="header-Outro">
<div class="row content single-Col">
<h1>Contact Us</h1>
<h3 class="subtitle"></h3>
</div>
</div>
@ -34,14 +33,14 @@
<form action="/contact" method="POST" class="content">
<input name="csrf_token" type="hidden" value="<%= csrf_token %>">
<fieldset>
<label>Email address</label>
<input type="email" name="email" placeholder="Your Email" style="width: 300px" value="<%= params[:email] %>">
<label for="your_email">Email address</label>
<input type="email" id="your_email" name="email" placeholder="Your Email" style="width: 300px" value="<%= params[:email] %>">
<label>Subject</label>
<input type="text" name="subject" placeholder="Subject" style="width: 400px" value="<%= params[:subject] %>">
<label for="email_subject">Subject</label>
<input type="text" id="email_subject" name="subject" placeholder="Subject" style="width: 400px" value="<%= params[:subject] %>">
<label>Comments</label>
<textarea name="body" style="width: 600px" rows="10"><%= params[:body] %></textarea>
<label for="your_comments">Comments</label>
<textarea name="body" id="your_comments" style="width: 600px" rows="10"><%= params[:body] %></textarea>
<label>Fill out captcha so we know you're not a robot:</label>
<div class="recaptcha">

16
views/dashboard.erb
View file

@ -44,7 +44,7 @@
</div> <!-- end .row -->
</div> <!-- end .header-Outro -->
<main class="content-Base">
<main class="content-Base" role="main">
<div class="content wide">
@ -115,12 +115,12 @@
<div class="file filehover">
<% if file[:is_html] && current_site.screenshot_exists?(file[:path], '210x158') %>
<div class="html-thumbnail html fileimagehover">
<img src="<%= current_site.screenshot_url(file[:path], '210x158') %>">
<img src="<%= current_site.screenshot_url(file[:path], '210x158') %>" alt="">
<div class="overlay"></div>
</div>
<% elsif file[:is_image] && current_site.thumbnail_exists?(file[:path], '210x158') %>
<div class="html-thumbnail image fileimagehover">
<img src="<%= current_site.thumbnail_url(file[:path], '210x158') %>">
<img src="<%= current_site.thumbnail_url(file[:path], '210x158') %>" alt="">
<div class="overlay"></div>
</div>
<% elsif file[:is_directory] %>
@ -178,8 +178,8 @@
<p>You are about to delete <strong><span id="deleteFileName"></span></strong>. Are you sure?</p>
</div>
<div class="modal-footer">
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button class="btn btn-Action btn-danger" onclick="fileDelete()"><i class="fa fa-trash" title="Delete"></i>Delete</button>
<button class="btn cancel" data-dismiss="modal" aria-hidden="true" type="button">Cancel</button>
<button class="btn btn-Action btn-danger" type="button" onclick="fileDelete()"><i class="fa fa-trash" title="Delete"></i>Delete</button>
</div>
</div>
@ -202,7 +202,7 @@
</form>
<script src="/js/dropzone.min.js"></script>
<script type="text/javascript">
<script>
function confirmFileDelete(name) {
$('#deleteFileName').html(name.replace('/',''));
@ -255,7 +255,7 @@
</script>
<div class="modal hide fade" id="createDir" tabindex="-1" role="dialog" aria-labelledby="createDirLabel" aria-hidden="true">
<form method="POST" action="/site/create_directory">
<form method="post" action="/site/create_directory">
<input type="hidden" value="<%= csrf_token %>" name="csrf_token">
<input type="hidden" value="<%= @dir %>" name="dir">
<div class="modal-header">
@ -266,7 +266,7 @@
<input name="name" type="text" placeholder="folder_name">
</div>
<div class="modal-footer">
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button type="button" class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button type="submit" class="btn btn-Action">Create</button>
</div>
</form>

6
views/donate.erb
View file

@ -5,13 +5,12 @@
<div class="header-Outro">
<div class="row content single-Col">
<h1>Donate to Neocities</h1>
<h3 class="subtitle">Help us keep the creative, independent internet alive!</h3>
<h2 class="subtitle">Help us keep the creative, independent internet alive!</h2>
</div>
</div>
<div class="content single-Col misc-page txt-Center">
<article>
<section>
<article role="article">
<h2>How to Donate</h2>
<p>If you send a donation and want to become a supporter, send us an email and we'll take care of it. Thanks!</p>
@ -40,6 +39,5 @@
<h3>Flattr</h3>
<script id='flattrbtn'>(function(i){var f,s=document.getElementById(i);f=document.createElement('iframe');f.src='//api.flattr.com/button/view/?uid=kyledrake&url='+encodeURIComponent(document.URL);f.title='Flattr';f.height=100;f.width=100;f.style.borderWidth=0;s.parentNode.insertBefore(f,s);})('flattrbtn');</script>
<h4 style="margin-top: 30px; margin-bottom: 30px">Thanks. You are great! <a href="/#new">Now go and make an awesome web site!</a></h4>
</section>
</article>
</div> <!-- end .content -->

2
views/error.erb
View file

@ -6,7 +6,7 @@
</div>
<div class="content single-Col misc-page">
<article>
<article role="article">
<h3>We have automatically been notified of the problem.</h3>
<p>
If you need to add any special information or if this error has not been resolved after a few days, <a href="/contact" title="contact us">contact us</a> and report the problem. Thank you, and our apologies for the inconvenience.

12
views/home_mockup.erb
View file

@ -23,7 +23,7 @@
<div class="site-suggestion">
<div class="site-portrait">
<a href="http://dragonquest.neocities.org">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg" alt="">
<span class="caption">dragonquest</span>
</a>
</div>
@ -36,7 +36,7 @@
<div class="site-suggestion">
<div class="site-portrait">
<a href="http://dragonquest.neocities.org">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg" alt="">
<span class="caption">dragonquest</span>
</a>
</div>
@ -48,7 +48,7 @@
<div class="site-suggestion">
<div class="site-portrait">
<a href="http://dragonquest.neocities.org">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg" alt="">
<span class="caption">dragonquest</span>
</a>
</div>
@ -59,7 +59,7 @@
<div class="site-suggestion">
<div class="site-portrait">
<a href="http://dragonquest.neocities.org">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg" alt="">
<span class="caption">dragonquest</span>
</a>
</div>
@ -69,7 +69,7 @@
<div class="site-suggestion">
<div class="site-portrait">
<a href="http://dragonquest.neocities.org">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg" alt="">
<span class="caption">dragonquest</span>
</a>
</div>
@ -80,7 +80,7 @@
<div class="site-suggestion">
<div class="site-portrait">
<a href="http://dragonquest.neocities.org">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg">
<img src="http://neocities.org/site_screenshots/dragonquest.jpg" alt="">
<span class="caption">dragonquest</span>
</a>
</div>

69
views/index.erb
View file

@ -40,16 +40,17 @@
<script src='https://www.google.com/recaptcha/api.js'></script>
</head>
<body class="hp"><a id="new"></a>
<body class="hp">
<a id="new"></a>
<div class="page">
<header class="header-Base">
<header class="header-Base" role="banner">
<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">
<ul class="h-Nav constant-Nav" role="presentation">
<li>
<a href="/">Neocities</a>
</li>
@ -84,7 +85,7 @@
<a href="/settings" class="sign-In">Settings</a>
</li>
<li>
<a href="/signout" class="sign-In">Signout</a>
<a href="/signout" class="sign-In">Sign Out</a>
</li>
<% end %>
</ul>
@ -124,14 +125,14 @@
<ul class="intro-List">
<li class="intro-Social">
<span class="intro-Icon"></span>
<h2 class="delta">Share your web creation with the world</h2>
<h3 class="delta">Share your web creation with the world</h3>
<p class="base">
Follow your favorite Neocities sites to keep up with all their latest updates. Discover new websites related to your interests using tags, comment on them, and share them. Unlimited creativity, zero ads.
</p>
</li>
<li class="intro-Tools">
<span class="intro-Icon"></span>
<h2 class="delta">Powerful new features to help you build</h2>
<h3 class="delta">Powerful new features to help you build</h3>
<p class="base">
We’ve made it easier to build your website and explore other sites. Neocities features an in-browser HTML editor, custom domain support, faster site loading, easy file uploading, RSS feeds, folder support, and much more.
</li>
@ -143,7 +144,7 @@
<div class="signup-Form">
<div class="content">
<h2 class="gamma txt-Center">Build your Website!</h2>
<h3 class="gamma txt-Center">Build your Website!</h3>
</div>
<p class="txt-Center">
Go to your dashboard to<br> start editing your website!
@ -160,7 +161,7 @@
<h2 class="gamma">Sign up for free</h2>
<hr />
<div class="siteCreateInputs">
<label for="create-Input">Username</label>
<label for="create-Input">User Name</label>
<input type="text" name="prevent_autofill_username" id="prevent_autofill_username" value="" style="position:absolute; top:-2000px; left:-2000px;" />
<input type="password" name="prevent_autofill_password" id="prevent_autofill_password" value="" style="position:absolute; top:-2000px; left:-2000px;" />
<input type="text" class="input-Area" id="create-Input" name="username" placeholder="my-site-name" data-placement="left" data-trigger="manual" autocapitalize="off" autocorrect="off" autocomplete="off" />
@ -170,18 +171,34 @@
<input type="text" class="input-Area" id="tags-input" name="new_tags_string" placeholder="art, videogames, food, music, programming, gardening, cats" data-placement="left" data-trigger="manual" autocapitalize="off" autocorrect="off" autocomplete="off" />
<div class="col col-50" style="padding-left:0;">
<label for="password-input">Password</label>
<input type="password" class="input-Area" id="password-input" name="password" placeholder="password" data-placement="left" data-trigger="manual" autocapitalize="off" autocorrect="off" autocomplete="off" />
<label for="password-input">
Password
</label>
<input type="password" class="input-Area" id="password-input"
name="password" placeholder="password"
data-placement="left" data-trigger="manual"
autocapitalize="off" autocorrect="off" autocomplete="off" />
</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" data-placement="left" data-trigger="manual" autocapitalize="off" autocorrect="off" autocomplete="off" />
<label for="email-input">
Email
</label>
<input type="email" class="input-Area"
id="email-input" name="email"
placeholder="me@example.com" data-placement="left"
data-trigger="manual" autocapitalize="off"
autocorrect="off" autocomplete="off" />
</div>
<div class="col col-50" style="padding-left:0;">
<label for="g-recaptcha">Confirm you are human</label>
<div id="captcha-input" class="g-recaptcha" data-sitekey="<%= $config['recaptcha_public_key'] %>" data-theme="dark" data-placement="left" data-trigger="manual"></div>
<label>
Confirm you are human
</label>
<div id="captcha-input" class="g-recaptcha"
data-sitekey="<%= $config['recaptcha_public_key'] %>"
data-theme="dark" data-placement="left" data-trigger="manual">
</div>
</div>
<div class="col col-50">
@ -278,12 +295,20 @@
-->
<section class="section features">
<h2 class="delta">Our mission: To make the web fun again by giving you back control of how you express yourself online.</h2>
<h2 class="delta"><img style="margin-top: .5em;" src="/img/front-editor-screenshot.png"></h2>
<h2 class="delta">
Our mission: To make the web fun again by giving you back control of how you express yourself online.
</h2>
<img style="margin-top: .5em; max-width: 80%;" src="/img/front-editor-screenshot.png" alt="screen shot of neocities code editor" />
<div class="row">
<div class="col col-50">
<h3><i class="fa fa-eye-slash"></i>Zero advertising</h3>
<p>Neocities will never sell your personal data or embed advertising on your site. Instead, we are funded directly by our community through <a href="/plan">supporter plans</a> and <a href="/donate">donations</a>. This allows us to base all our decisions on making the best possible web building experience for you, rather than on appeasing ad companies.</p>
<h3>
<i class="fa fa-eye-slash"></i>Zero advertising
</h3>
<p>
Neocities will never sell your personal data or embed advertising on your site. Instead, we are funded directly by our community through <a href="/plan">supporter plans</a> and <a href="/donate">donations</a>. This allows us to base all our decisions on making the best possible web building experience for you, rather than on appeasing ad companies.
</p>
</div>
@ -319,7 +344,7 @@
<h3>
"Designed as a 21st century reincarnation of GeoCities, Neocities lets you make your own site for free. <strong>And it just might spark a renaissance of creativity online.</strong>"
<br />
—Matthew Guay, <a href="http://web.appstorm.net/reviews/web-dev/neocities-the-free-place-to-code-your-own-site-from-scratch" target="_blank">AppStorm</a>. <a href="/press">View All Press »</a>
<cite>— Matthew Guay, <a href="http://web.appstorm.net/reviews/web-dev/neocities-the-free-place-to-code-your-own-site-from-scratch" target="_blank">AppStorm</a>. <a href="/press">View All Press »</a></cite>
</h3>
</div>
</div>
@ -332,8 +357,8 @@
</section>
</main>
<footer class="footer-Base">
<section class="footer-Intro">
<footer class="footer-Base" role="contentinfo">
<div class="footer-Intro">
<div class="footer-Content">
<div class="row">
<div class="col col-33">
@ -369,7 +394,7 @@
</div>
</div>
</div>
</section>
</div>
<%== erb :'_footer', layout: false%>
</footer>

7
views/not_found.erb
View file

@ -1,13 +1,14 @@
<div class="header-Outro">
<div class="row content single-Col">
<h1>Page Not Found (404)</h1>
<h3 class="subtitle"></h3>
</div>
</div>
<div class="content single-Col misc-page">
<article>
<div class="txt-Center"><img src="/img/cat-larger.png"></div>
<article role="article">
<div class="txt-Center">
<img src="/img/cat-larger.png" alt="the neocities cat" />
</div>
<p>
Penelope the Neocities Cat tried very hard to locate the page you were looking for, but she couldn't find it. She's an awesome sysadmin. If she couldn't find it, it's probably not there.
</p>

2
views/password_reset.erb
View file

@ -10,7 +10,7 @@
Note: If you provided your e-mail, you can reset your password. If you didn't, you will not be able to reset your password, and instead should create a new account. We cannot change a password without an entered email for security reasons.
</p>
<form method="POST" action="/send_password_reset" class="content">
<form method="post" action="/send_password_reset" class="content">
<fieldset>
<input name="csrf_token" type="hidden" value="<%= csrf_token %>">
<input name="email" type="email" class="input-Area" placeholder="Your email" style="width: 300px">