more style / copy changes

app.rb

@@ -250,7 +250,7 @@ end
 
 get '/signin' do
   dashboard_if_signed_in
-  slim :'signin'
+  erb :'signin'
 end
 
 get '/settings' do
@@ -565,7 +565,7 @@ post '/admin/mark_nsfw' do
 end
 
 get '/password_reset' do
-  slim :'password_reset'
+  erb :'password_reset'
 end
 
 post '/send_password_reset' do

views/about.erb

@@ -1,7 +1,7 @@
 <div class="header-Outro">
   <div class="row content single-Col">
   <h1>About Neocities</h1>
-  <h3 class="subtitle">Neocities wants to make the web creative and fun again.</h3>
+  <h3 class="subtitle">Your free web page is waiting.. once again.</h3>
   </div>
 </div>
 
@@ -14,51 +14,63 @@
   <script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
 
   <article>
-    <h6>Neocities is bringing back the creativity and free expression that made the web great.</h6>
+    <h6>Neocities is bringing back the fun, creativity and free expression that made the web great.</h6>
 
     <p>
-      We are tired of living in an online world where people are isolated from each other in
+      We are tired of living in an online world where people are isolated from each other on boring web sites with generic templates defining what people are
-      boring social networks, generic templates which define what people are
       supposed to know or communicate with each other. It's time we took back our personalities from these sterilized, lifeless,
-      monetized, monitored entities and let our creativity flourish again.
+      monetized, data mined, monitored entities and let our creativity flourish again.
     </p>
 
     <p>
       That's where Neocities comes in. We provide a canvas for people to make any web site they want.
       Whether it be a web site about something they're good at, something they love, something they hate, or
-      their own custom "Profile" where they can introduce themselves in a way that actually matters to them. 
+      their own completely customized profile where they can introduce themselves in a way that actually matters to them. 
-      And we can do this without selling out to the marketing industry.
+      We can do this without selling out to the marketing industry, and we're going to prove it.
     </p>
     <p>
-      It's a big project (to make small sites), and we have a lot of work to do.
+      It's a tough project. We've got big problems to solve, and big ambitions (restrained by our big principles). We have a lot of work to do. <strong>But our goal is clear: to enable you to harness the creativity, beauty, and power of creating your own web site. To rebuild the web we lost to monotony, and make it fun again.</strong>
     </p>
     <p>
-      Neocities is just getting started, and we've got a lot of amazing things in store. Thanks for believing in us. We'll try very hard to not let you down.
+      Neocities is just getting started, and we've got a lot of amazing things in store. I strongly believe that, with your help, we're going to really shake things up on the web. Thank you for believing in us (and yourselves).
     </p>
     <p>
-      Love,
+      Long Live the Web!
     </p>
     <p>
       -Kyle
     </p>
     <p>
-      PS: What are you waiting for? <a href="/new">Go make your web site!</a>
+      PS: What are you waiting for? <strong><a href="/new">Go make your web site!</a></strong>
+    </p>
+    <h2>Neocities is:</h2>
+    <ul>
+      <li><strong>Helping the web.</strong> We are here to empower people to develop independent, creative sites.</li>
+      <li><strong>Free.</strong> We will always have a free web site option.</li>
+      <li><strong>Open source.</strong> Neocities.org is <a href="https://github.com/neocities">completely open source</a>, and we share code back with the community.</li>
+      <li><strong>A no-ad zone.</strong> We'll never put ads or watermarks on sites, and we don't sell user data to marketers.</li>
+      <li><strong>Anti lock-in.</strong> Redirecting to new sites, easy site downloading, and support for custom domains.</li>
+      <li><strong>Sustainable.</strong> We want to grow, but that growth cannot risk the site (or compromise our principles).</li>
+    </ul>
+    
+    <p style="margin-top:20px">
+      If you share our values, we would love your support. Spread the word! We also have a <a href="/plan">supporter plan</a> to help pay for the site, and we accept <a href="/donate">donations</a> through multiple options (including Bitcoin... and Dogecoin).
     </p>
   </article>
   <hr />
   <section>
-  <h3 class="beta">Contributors:</h3>
+  <h2 class="beta txt-Center">The Neocities Team</h2>
 
   <div class="row txt-Center">
     <div class="col col-33">
-      <a href="http://t.co/vmyU09oYC7" title="Visit Kyle's Website">
+      <a href="https://twitter.com/kyledrake" title="Kyle Drake">
         <img src="https://0.gravatar.com/avatar/62a43048a3c2c688654274abdc0ecb9c?d=https%3A%2F%2Fidenticons.github.com%2Ffde07ba82b25f95afa9d080819f95717.png&amp;r=x&amp;s=440" alt="kyle drake" class="pic-Rounded" />
       </a>
       <br />
-      <a href="https://twitter.com/kyledrake" title="Follow me on Twitter" class="eps">Kyle Drake</a>
+      <a href="https://twitter.com/kyledrake" title="Kyle Drake" class="eps">Kyle Drake</a>
     </div>
     <div class="col col-33">
-      <a href="http://t.co/e1x1XoD2qi" title="Visit Victoria's Website">
+      <a href="https://twitter.com/violasong" title="Visit Victoria's Website">
         <img src="https://1.gravatar.com/avatar/2b577f8b3e5ab79bc927ed5185c0eae0?d=https%3A%2F%2Fidenticons.github.com%2Fe03006819f4a835afa237716f6701c95.png&amp;r=x&amp;s=440" alt="Victoria Wang" class="pic-Rounded" />
       </a>
       <br />
@@ -75,4 +87,4 @@
 
   </section>
 
-</div> <!-- end .content -->
+</div>

views/donate.erb

@@ -1,28 +1,32 @@
 <style>
   h3 { margin-top: 20px; }
 </style>
-<div class="content single-Col">
+
+<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>
+  </div>
+</div>
+
+<div class="content single-Col misc-page txt-Center">
   <article>
-    <h2 class="txt-Center">
-      Help us keep the creative,<br />independent internet alive!
-    </h2>
-    <hr />
-
-
     <section>
-      <h2>Where your Money Goes</h2>
-      <p><b>$150</b> provides hosting for <b>2 million</b> Neocities sites for 1 month, and helps cover unplanned costs.</p>
-      <p><b>$100</b> buys a backup server for that machine for one month.</p>
-
-
         <h2>How to Donate</h2>
         
         <h3>Gittip:</h3>
         <script data-gittip-username="kyledrake" src="https://www.gittip.com/assets/widgets/0002.js"></script>
 
         <h3>Bitcoin:</h3>
+        <p><img src="/img/bitcoin.png"></p>
         <p><b>1MPYyfoWK8CkAzhLzLLtZGa9dwEGT5dm2T</b></p>
         
+        <h3>Dogecoin:</h3>
+        <p><img src="/img/dogecoin.png"></p>
+        <p>
+        <div><span style="color:#ff0000;">D</span><span style="color:#ff1500;">C</span><span style="color:#ff2a00;">X</span><span style="color:#ff4000;">c</span><span style="color:#ff5500;">J</span><span style="color:#ff6a00;">7</span><span style="color:#ff7f00;">u</span><span style="color:#ff9900;">Q</span><span style="color:#ffb200;">Q</span><span style="color:#ffcc00;">c</span><span style="color:#ffe500;">v</span><span style="color:#ffff00;">X</span><span style="color:#d5ff00;">R</span><span style="color:#aaff00;">8</span><span style="color:#80ff00;">q</span><span style="color:#55ff00;">7</span><span style="color:#2bff00;">A</span><span style="color:#00ff00;">N</span><span style="color:#00ff33;">7</span><span style="color:#00ff66;">2</span><span style="color:#00ff99;">6</span><span style="color:#00ffcc;">g</span><span style="color:#00ffff;">J</span><span style="color:#00d5ff;">L</span><span style="color:#00aaff;">x</span><span style="color:#0080ff;">7</span><span style="color:#0055ff;">t</span><span style="color:#002bff;">g</span><span style="color:#0000ff;">u</span><span style="color:#1c00ff;">q</span><span style="color:#3800ff;">w</span><span style="color:#5300ff;">n</span><span style="color:#6f00ff;">D</span><span style="color:#8b00ff;">5</span></div>
+        </p>
+        
         <h3>PayPal:</h3>
         
         <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
@@ -34,12 +38,7 @@
         
         <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=62;f.width=55;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>
-        <h4>Sponsorships, press, speaking invites, general inquiries:</h4>
-        <h3><a href="/contact">Contact</a></h3>
-        <h4 style="margin-top: 30px; margin-bottom: 30px">Thanks. You are great! Now go and make an awesome web site!</h4>
       </section>
   </article>
-	<hr />
-	
 </div> <!-- end .content -->

views/new.erb

@@ -3,74 +3,76 @@
   Stripe.setPublishableKey('<%= $config['stripe_publishable_key'] %>');
 </script>
 
-<main class="content-Base">
+<div class="header-Outro">
-  <div class="row content">
+  <div class="row content single-Col">
-    <div class="col col-100">
+  <h1>Create a New Web Page</h1>
+  <h3 class="subtitle">Your free web page is only a few minutes away!</h3>
+  </div>
+</div>
+
+<div class="content single-Col misc-page">
+  <h3></h3>
   <form method="POST" action="/create" id="signupform">
     <input name="csrf_token" type="hidden" value="<%= csrf_token %>">
 
-        <h2 class="txt-Center">Create a New Home Page</h2>
-        
-        <div class="col col-50" style="margin:0 auto; float:none">
     <% if !@site.errors.empty? %>
       <div class="row content">
         <div class="col col-100 txt-Center">
           <div class="alert alert-block alert-error">
             <p>There were errors creating your home page:</p>
             <% @site.errors.each do |error| %>
-                    <p class="tiny"><%= error.last.first %></p>
+              <p><%= error.last.first %></p>
             <% end %>
           </div>
         </div>
       </div>
     <% end %>
     
-          <hr>
+    <p>
-          <p class="tiny">
       First, enter a username. This will also be used as your site name.<br><b>Do not forget this, it will be used to sign in to and manage your home page.</b> It can only contain letters, numbers, underscores and hyphens, and can only be 32 characters long.
     </p>
     <h5>Username</h5>
-          <p class="tiny">
+    <p>
-            <input class="input-Area" name="username" type="text" placeholder="yourusername" value="<%= @site.username %>" autocapitalize="off" autocorrect="off">.neocities.org
+      <input class="input-Area" name="username" type="text" placeholder="yourusername" value="<%= @site.username %>" autocapitalize="off" autocorrect="off" style="width: 200px">.neocities.org
     </p>
     
     <hr>
 
-          <p class="tiny">
+    <p>
       Next, enter a password. This will be used to allow you to login. Minimum 5 characters. If you don't make it a good password, Dade Murphy from the movie Hackers will come in and steal your "garbage files".
     </p>
     <h5>Password</h5>
-          <input class="input-Area" name="password" type="password">
+    <input class="input-Area" name="password" type="password" style="width: 200px" placeholder="your password">
 
     <hr>
 
-          <p class="tiny">
+    <p>
       Now you can enter an e-mail address. Your e-mail address is private and we will not show it to anyone for any reason. You don't have to provide one, but <b>we will not be able to reset your password without it, so don't lose your username and password if you leave this blank!</b>
     </p>
     <h5>Email</h5>
-          <input class="input-Area" name="email" type="email" placeholder="youremail@example.com" value="<%= @site.email %>">
+    <input class="input-Area" name="email" type="email" placeholder="youremail@example.com" value="<%= @site.email %>" style="width: 300px">
 
     <hr>
 
     <input name="is_nsfw" type="hidden" value="false">
-          <p class="tiny">
+    <p>
       If your page will contain objectionable (adult) content, check this box:&nbsp;&nbsp;&nbsp;<input name="is_nsfw" type="checkbox" value="true" style="margin-top:0" <%= params[:is_nsfw].to_s == 'true' ? 'checked' : '' %>>
     </p>
 
     <hr>
 
-          <p class="tiny">You can optionally enter some tags! Tags will allow others to find your site based on your interests, or your site's theme. <b>Separate multiple tags with commas</b>. Don't think too hard about this, you can change them later. You can have a maximum of ten tags, and there is a two word per tag maximum (extra words in a tag will be removed).</p>
+    <p>You can optionally enter some tags! Tags will allow others to find your site based on your interests, or your site's theme. <b>Separate multiple tags with commas</b>. Don't think too hard about this, you can change them later. You can have a maximum of ten tags, and there is a two word per tag maximum (extra words in a tag will be removed).</p>
     
     <h5>Tags</h5>
     <input class="input-Area" name="tags" type="text" style="width: 400px; max-width:100%" placeholder="pokemon, video games, bulbasaur" value="<%= params[:tags] %>" autocapitalize="off" autocorrect="off">
     
     <hr>
     
-          <p class="tiny"><strong>The site you are creating will be free, forever.</strong> We will never charge you for your web site.</p>
+    <p><strong>The site you are creating will be free, forever.</strong> We will never charge you for your web site.</p>
-          <p class="tiny"><a href="/donate" target="_blank">Neocities has to pay the bills though</a>, and we like the idea of being able to work on the site full-time someday. So if you would like to help us reach this goal, we have created the <strong>Supporter Plan</strong>!
+    <p><a href="/donate" target="_blank">Neocities has to pay the bills though</a>, and we like the idea of being able to work on the site full-time someday. So if you would like to help us reach this goal, we have created the <strong>Supporter Plan</strong>!
     
-          <p class="tiny">Right now, the <strong>Supporter Plan</strong> is the same as the free plan, except that <strong>Supporter Plan members get 200MB</strong> of web space. You will also be listed as a supporter on our contributors page, and on your site profile page.</p>
+    <p>Right now, the <strong>Supporter Plan</strong> is the same as the free plan, except that <strong>Supporter Plan members get 200MB</strong> of web space. You will also be listed as a supporter on our contributors page, and on your site profile page.</p>
-          <p class="tiny">The base plan is $12 ($1/month) billed once per year, which is the cost of <a href="/img/yafagrillmenu.jpg" target="_blank">a delicious Yafa Combo with a lousy tip</a>. If you ever decide to cancel, you get to keep the extra space. Thanks for helping us run this site!</p>
+    <p>The base plan is $12 ($1/month) billed once per year, which is the cost of <a href="/img/yafagrillmenu.jpg" target="_blank">a delicious Yafa Combo with a lousy tip</a>. If you ever decide to cancel, you get to keep the extra space. Thanks for helping us run this site!</p>
     
     <div>
       <input type="radio" name="plan" value="free" <%= params[:plan].nil? || params[:plan] == 'free' ? 'checked' : '' %>>
@@ -87,7 +89,7 @@
 
       <div id="plan_error" class="alert alert-block alert-error" style="display:none"></div>
 
-            <p class="tiny">
+      <p>
         Plan type:
         <select name="selected_plan" style="width: 200px">
           <option value="plan_one">$12/year ($1/month)</option>
@@ -99,25 +101,25 @@
       </p>
       
       <% if params[:stripe_token] %>
-              <p class="tiny">Billing information has been saved, thank you!</p>
+        <p>Billing information has been saved, thank you!</p>
       <% else %>
-              <p class="tiny">
+        <p>
           Card Number: <input type="text" size="20" data-stripe="number">
           CVC: <input type="text" size="4" maxlength="4" data-stripe="cvc" style="width: 60px">
         </p>
-              <p class="tiny">
+        <p>
           Expiration: 
           <input type="text" size="2" data-stripe="exp-month" placeholder="MM" maxlength="2" style="width: 50px">
           <input type="text" size="4" data-stripe="exp-year" placeholder="YYYY" maxlength="4" style="width: 60px">
         </p>
       <% end %>
       
-            <p class="tiny"><strong>We accept Bitcoin!</strong> If you would prefer to use Bitcoin, choose the <strong>Free Plan</strong>, and then upgrade in the <strong>Settings</strong> page once your account is created.</p>
+      <p><strong>We accept Bitcoin!</strong> If you would prefer to use Bitcoin, choose the <strong>Free Plan</strong>, and then upgrade in the <strong>Settings</strong> page once your account is created.</p>
     </div>
     
     <hr>
     
-          <p class="tiny"><b>Last thing!</b> Enter these two words correctly (with spaces) so we know you're not a robot (don't worry robots, we still love you).</p>
+    <p><b>Last thing!</b> Enter these two words correctly (with spaces) so we know you're not a robot (don't worry robots, we still love you).</p>
     
     <div class="recaptcha">
       <%== recaptcha_tag :challenge, ssl: request.ssl? %>
@@ -129,8 +131,6 @@
     <input class="btn-Action" type="submit" value="Create Home Page">
   </form>
 </div>
-  </div>
-</main>
   
 <script>
   window.onload = function() {

views/password_reset.erb

@@ -0,0 +1,21 @@
+<div class="header-Outro">
+  <div class="row content single-Col">
+  <h1>Reset Password</h1>
+  </div>
+</div>
+
+<div class="content single-Col misc-page">
+  <h3></h3>
+
+  <p>
+    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">
+    <fieldset>
+      <input name="csrf_token" type="hidden" value="<%= csrf_token %>">
+      <input name="email" type="email" class="input-Area" placeholder="Your email" style="width: 300px">
+    </fieldset>
+    <input class="btn-Action" type="submit" value="Send Reset Token">
+  </form>
+</div>

views/plan/index.erb

@@ -55,7 +55,7 @@
       <li>
         <strong>No lock-in.</strong> Redirecting your site is easy, free site downloads, and support for custom domains.
       </li>
-      <li><strong>No ads, ever.</strong> We'll don't put ads or watermarks on sites, and we don't sell user data.</li>
+      <li><strong>No ads, ever.</strong> We'll never put ads or watermarks on sites, and we don't sell user data.</li>
       <li>
         <strong>It's safe.</strong> We use <a href="https://stripe.com" target="_blank">Stripe</a> for payments, and never store your credit card information directly.
       </li>

views/signin.erb

@@ -0,0 +1,39 @@
+<div class="header-Outro">
+  <div class="row content single-Col txt-Center">
+  <h1>Welcome Back!</h1>
+  <h3 class="subtitle"></h3>
+  </div>
+</div>
+
+<div class="content txt-Center single-Col misc-page">
+  <h3></h3>
+  
+  <% if flash.keys.length > 0 %>
+    <div class="alert alert-block">
+      <p>
+        <% flash.keys.each do |key| %>
+          <%= flash[key] %>
+        <% end %>
+      </p>
+    </div>
+  <% end %>
+  
+  <form method="POST" action="/signin" class="content">
+    <input name="csrf_token" type="hidden" value="<%= csrf_token %>">
+    <fieldset>
+      <label for="username">Username</label>
+      <input name="username" type="text" placeholder="sitename" class="input-Area" autocapitalize="off" autocorrect="off" value="<%= flash[:username] %>" style="width: 290px">.neocities.org
+      <label for="password">Password</label>
+      <input name="password" type="password" class="input-Area" placeholder="Your password" style="width: 400px">
+    </fieldset>
+    <input class="btn-Action" type="submit" value="Sign In">
+  </form>
+
+  <hr>
+  <p>
+    <a href="/new" title="Sign me up!">I don't have an account yet.</a>
+  </p>
+  <p>
+    <a href="/password_reset" title="What did I huh?">I forgot my password.</a>
+  </p>
+</div>

views/signin.slim

@@ -1,20 +0,0 @@
-.page
-  .content.single-Col.txt-Center
-    h1 Welcome back!
-    
-    form method="POST" action="/signin" class="content"
-      input name="csrf_token" type="hidden" value="#{csrf_token}"
-
-      fieldset.col-60 style="margin:0 auto"
-        input name="username" type="text" placeholder="Your username" class="input-Area" autocapitalize="off" autocorrect="off" value="#{flash[:username]}"
-        br
-        input name="password" type="password" class="input-Area" placeholder="Your password"
-        br
-        button class="btn-Action" Sign in
-        
-        hr
-        
-        p
-          a href="/new" title="Sign me up!" I don't have an account yet.
-        p
-          a href="/password_reset" title="What did I huh?" I forgot my password.