First major stab at the integration of Courtland's CSS into
author<mako@atdot.cc> <>
Tue, 28 Aug 2007 15:12:59 +0000 (11:12 -0400)
committer<mako@atdot.cc> <>
Tue, 28 Aug 2007 15:12:59 +0000 (11:12 -0400)
Selectricity. It looks good!

So far, I've only really finished the front page.

20 files changed:
app/controllers/site_controller.rb
app/views/layouts/_footer.rhtml [new file with mode: 0644]
app/views/layouts/frontpage.rhtml [new file with mode: 0644]
app/views/layouts/main.rhtml
app/views/site/_basic_login.rhtml
app/views/site/_user_summary.rhtml
app/views/site/index.rhtml
public/images/bg_controlroom.png [new file with mode: 0644]
public/images/bg_index.png [new file with mode: 0644]
public/images/bg_quickvotes.png [new file with mode: 0644]
public/images/bg_resultblock.png [new file with mode: 0644]
public/images/bg_results.png [new file with mode: 0644]
public/images/bg_voters.png [new file with mode: 0644]
public/images/rails.png [deleted file]
public/images/title.png [new file with mode: 0644]
public/images/title_main.png [new file with mode: 0644]
public/images/top_bar_1.png [new file with mode: 0644]
public/images/top_bar_2.png [new file with mode: 0644]
public/stylesheets/common.css [new file with mode: 0644]
public/stylesheets/front.css [new file with mode: 0644]

index 80fdfc406c3247b16651ae5c6b0bada8c2d35625..522bbb2cf4dbe3b5e26145a9040b233ac3732187 100644 (file)
@@ -1,5 +1,5 @@
 class SiteController < ApplicationController
-  layout 'main'
+  layout 'frontpage'
   require_dependency "user"
   require_dependency "election"
   require_dependency "account"
diff --git a/app/views/layouts/_footer.rhtml b/app/views/layouts/_footer.rhtml
new file mode 100644 (file)
index 0000000..b23900f
--- /dev/null
@@ -0,0 +1,4 @@
+  <div id="footer">
+       <a href="http://code.selectricity.org/">Copyleft</a> 2006, 2007 &nbsp;&nbsp; || &nbsp;&nbsp; 
+       <a href="http://www.media.mit.edu">MIT Media Lab</a>
+  </div>
diff --git a/app/views/layouts/frontpage.rhtml b/app/views/layouts/frontpage.rhtml
new file mode 100644 (file)
index 0000000..8f14c3a
--- /dev/null
@@ -0,0 +1,25 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <title>Selectricity</title>
+    <%= stylesheet_link_tag "common", :media => "all" %>
+    <%= stylesheet_link_tag "front", :media => "all" %>
+  </head>
+
+  <body>
+    <div id="page-wrapper">
+
+    <div id="header">
+         <a href="index.html"><h1>selectricity: voting machinery for the masses</h1></a>
+    </div>
+  
+  <div id="body">
+    <%= @content_for_layout %>
+  </div>
+  
+  <%= render_partial 'layouts/footer' %>
+</div>
+</body>
+
+</html>
index 0ed60829eaf3bdf3b8967325af4dda583c7baa8a..c6a14a31a1eebdb22fcce5263a1e09337a0a2718 100644 (file)
@@ -1,52 +1,44 @@
-<% %>
 <html>
-    <head>
-        <title><%= @page_title || "Selectricity" %></title>
-        <%= stylesheet_link_tag "main", :media => "all" %>
-        <%= javascript_include_tag "prototype", "effects", "dragdrop", "controls" %>
-    </head>
-    <body>
-        <div id="top">
-           <% if @page_title %>
-              <h3><%= @page_title %></h3>  
-           <% else %>
-             <span id="headertext"><%= link_to('<h3>Selectricity<br />
-             <font size="-1">Voting Machinery for the Masses</font></h3>', :controller => 
-             'site', :action => 'index')%></span>
-          <% end %>
+  <head>
+    <title><%= @page_title || "Selectricity" %></title>
+    <%= stylesheet_link_tag "main", :media => "all" %>
+    <%= javascript_include_tag "prototype", "effects", "dragdrop", "controls" %>
+  </head>
 
-           <div id="links">
-             <% if session[:user] %>
-               Welcome <strong><%= User.find(session[:user]).login.capitalize %></strong>
-               <%= link_to("Profile", :controller => "account",
-                   :action => "summary", :id => session[:user][:id] )%>
-               <%= link_to("Logout", :controller => "account",
-                                     :action => "logout") %>  |
-             <% else %>
-               <%= link_to("Login", :controller => "account", :action => "login")
-                %>/<%= link_to("Sign up", :controller => "account", :action => "signup")%>
-             <% end %> |
-             
-            <%= link_to("Help/About", :controller => "site", :action => "about") %>
-           </div>
-        </div>
-        
-        <% if flash[:notice]%>
-          <div id="notice"><%= flash[:notice] %></div>
-        <% end%>
+  <body>
+    <div id="top">
+    <% if @page_title %>
+      <h3><%= @page_title %></h3>  
+    <% else %>
+      <span id="headertext"><%= link_to('<h3>Selectricity<br />
+      <font size="-1">Voting Machinery for the Masses</font></h3>', :controller => 
+      'site', :action => 'index')%></span>
+   <% end %>
 
-        <div id="main">
-          <%= @content_for_layout %>
-        </div>
+     <div id="links">
+     <% if session[:user] %>
+       Welcome <strong><%= User.find(session[:user]).login.capitalize %></strong>
+       <%= link_to("Profile", :controller => "account",
+           :action => "summary", :id => session[:user][:id] )%>
+       <%= link_to("Logout", :controller => "account",
+                             :action => "logout") %>  |
+     <% else %>
+       <%= link_to("Login", :controller => "account", :action => "login")
+       %>/<%= link_to("Sign up", :controller => "account", :action => "signup")%>
+     <% end %> |
+       
+     <%= link_to("Help/About", :controller => "site", :action => "about") %>
+  </div>
+</div>
+      
+      <% if flash[:notice]%>
+        <div id="notice"><%= flash[:notice] %></div>
+      <% end%>
 
-        <div id="footer">
-          <hr />
-         <%= link_to "Copyleft", "http://code.selectricity.org/"
-         %> 2006, 2007 || 
-         <%= link_to "MIT Media Lab", "http://www.media.mit.edu" %> and the
-         <a href="http://code.selectricity.org/team">Selectricity Team</a>
-       </div>
+      <div id="main">
+        <%= @content_for_layout %>
+      </div>
 
-    </body>
+  <%= render_partial 'layouts/footer' %>
+  </body>
 </html>
index 689a3f56a231ac88e526cdaf52991dfa2cd2eecf..9c689fcb55f084236dedd595a2c7f95065a11fe5 100644 (file)
@@ -1,19 +1,13 @@
-<% -%>
- <% form_tag :controller => 'account', :action => 'login'  do %>
-    <table>
-         <label for="login">Login</label>
-      <%= text_field "Login", "login", :size => 30 %><br />
-      <label for="password">Password</label>
-      <%= password_field "Password", "password", :size => 30 %><br />
-    </table>
+<% form_tag :controller => 'account', :action => 'login'  do %>
 
-    <div class="button-bar">
-      <p><%= submit_tag 'Login' %></p>
-<% end %>
-     <p><%= link_to 'Register for an account', :controller =>
-'account', :action => 'signup' %></p>
+  <p><label for="login">Login</label></p>
+  <p><%= text_field "Login", "login", :size => 30 %></p>
+  <p><label for="password">Password</label></p>
+  <p><%= password_field "Password", "password", :size => 30 %></p>
 
-      <p><%= link_to 'Lost or forgot your password?', :controller => 'account', :action => 'forgot_password' %></p>
+  <p><%= submit_tag 'Login' %></p>
+<% end %>
 
-    </div>
+<p><%= link_to 'Register for an account', :controller => 'account', :action => 'signup' %></p>
 
+<p><%= link_to 'Lost or forgot your password?', :controller => 'account', :action => 'forgot_password' %></p>
index 310d98cb6fe37a3f5701e85e3595d35902e2b3c1..e37cafb60a0b9f1792313749b5c5465ef0623c02 100644 (file)
@@ -1,7 +1,3 @@
-<% %>
-
-<h2>Activity Summary</h2>
-
 <% if @current_elections.length < 1 %>
   <em>You have not created any elections.</em>
 <% else %>
index 9b0b1fec8e8a672a3594a983cf55e6ab086fcef4..bb74bba558278331eb15c27b640e9121bd016cf9 100644 (file)
@@ -1,31 +1,65 @@
-<% %>
+<div id="voters" class="main-section">
+  <div id="voters-content">
+  <h2>Voters</h2>
 
-<table width="auto" padding="5px">
-<tr>
-<td width="47%" valign="top">
+  <p>If you have received an email with a token inviting you to vote in
+  an ongoing election, you can log in to vote using your token below.</p>
 
-<h2>QuickVotes</h2>
+  <%= form_tag :controller => 'voter', :action => 'index' %>
+  <p><%= text_field :vote, :password %></p>
+  <p><%= submit_tag "Log In" %></p>
+  <%= end_form_tag %>
 
-<p><em>QuickVotes</em> are like polls: unstructured, non-anonymous and
-without the complex features of <em>Selectricity</em>. They are the
-quickest way to make a decision or to compare between voting
-methods.</p>
+  <p><%= link_to 'Lost or forgot your token?', :controller => 'voter', :action => 'forgot_password' %></p>
 
-<p><%= link_to( "Create a QuickVote", :controller => 'quickvote',
-                :action => 'create') %></p>
+  <h3>SMS Interface</h3>
+  <p>For information on accessing Selectricity over email or via SMS/text messages from your mobile phone, email <%= link_to "vote\@mako.cc", "mailto:vote@mako.cc" %> with "help" in the body or read the <%= link_to "Selectricity Anywhere documentation", "selectricity-anywhere.html"%>.</p>
 
-<p>Take a look at the QuickVotes you've made recently: <br />
-<%= link_to( "My Recent QuickVotes", :controller => 'quickvote',
-                :action => 'my_quickvotes')%></p>
-<p>Recent <em>QuickVotes</em> include:</p>
+  </div>
+</div>
 
-<ul>
-<% for quickvote in @quickvotes %>
-<li><%= link_to (h(quickvote.shortdesc) || "Unnamed"), quickvote_url(:ident => quickvote.name) %></li>
-<% end %>
-</ul>
+<div id="control-room" class="main-section">
+  <div id="control-room-content">
+  <h2>Control Room</h2>
+
+  <% if session[:user] %>
+    <%= render :partial => 'user_summary' %> 
+  <% else %>
+    
+    <p>You must have an account to start a new vote or to administer an
+    existing vote. You can log in or create a new account below.</p>
+
+    <%= render_partial 'basic_login' %>
+  <% end %>
+
+  </div>
+</div>
+
+<div id="quickvotes" class="main-section">
+  <div id="quickvotes-content">
+
+  <h2>QuickVotes</h2>
+  <p><em>QuickVotes</em> are like polls: unstructured, non-anonymous and
+  without the complex features of <em>Selectricity</em>. They are the
+  quickest way to make a decision or to compare between voting
+  methods.</p>
+
+  <ul>
+   <li><%= link_to( "Create a QuickVote", :controller => 'quickvote', :action => 'create') %></li>
+   <li><%= link_to( "Recent QuickVotes", :controller => 'quickvote', :action => 'my_quickvotes')%></li>
+  </ul>
+
+  <p>Recently created <em>QuickVotes</em> include:</p>
+  <ul>
+  <% for quickvote in @quickvotes %>
+    <li><%= link_to (h(quickvote.shortdesc) || "Unnamed"), quickvote_url(:ident => quickvote.name) %></li>
+  <% end %>
+  </ul>
 
+  </div>
+</div>
 
+<!--
 
 <h2>Selectricity <em>Anywhere</em></h2>
 
@@ -64,3 +98,4 @@ ongoing election, you can log in to vote using your token here.</p>
 </td>
 </tr>
 </table>
+-->
diff --git a/public/images/bg_controlroom.png b/public/images/bg_controlroom.png
new file mode 100644 (file)
index 0000000..5629933
Binary files /dev/null and b/public/images/bg_controlroom.png differ
diff --git a/public/images/bg_index.png b/public/images/bg_index.png
new file mode 100644 (file)
index 0000000..52ac075
Binary files /dev/null and b/public/images/bg_index.png differ
diff --git a/public/images/bg_quickvotes.png b/public/images/bg_quickvotes.png
new file mode 100644 (file)
index 0000000..fd844ec
Binary files /dev/null and b/public/images/bg_quickvotes.png differ
diff --git a/public/images/bg_resultblock.png b/public/images/bg_resultblock.png
new file mode 100644 (file)
index 0000000..21a05bd
Binary files /dev/null and b/public/images/bg_resultblock.png differ
diff --git a/public/images/bg_results.png b/public/images/bg_results.png
new file mode 100644 (file)
index 0000000..a94d556
Binary files /dev/null and b/public/images/bg_results.png differ
diff --git a/public/images/bg_voters.png b/public/images/bg_voters.png
new file mode 100644 (file)
index 0000000..8901917
Binary files /dev/null and b/public/images/bg_voters.png differ
diff --git a/public/images/rails.png b/public/images/rails.png
deleted file mode 100644 (file)
index b8441f1..0000000
Binary files a/public/images/rails.png and /dev/null differ
diff --git a/public/images/title.png b/public/images/title.png
new file mode 100644 (file)
index 0000000..acf328f
Binary files /dev/null and b/public/images/title.png differ
diff --git a/public/images/title_main.png b/public/images/title_main.png
new file mode 100644 (file)
index 0000000..f3dd02d
Binary files /dev/null and b/public/images/title_main.png differ
diff --git a/public/images/top_bar_1.png b/public/images/top_bar_1.png
new file mode 100644 (file)
index 0000000..3be6999
Binary files /dev/null and b/public/images/top_bar_1.png differ
diff --git a/public/images/top_bar_2.png b/public/images/top_bar_2.png
new file mode 100644 (file)
index 0000000..7242913
Binary files /dev/null and b/public/images/top_bar_2.png differ
diff --git a/public/stylesheets/common.css b/public/stylesheets/common.css
new file mode 100644 (file)
index 0000000..4b53f59
--- /dev/null
@@ -0,0 +1,77 @@
+@charset "UTF-8";
+/* CSS Document */
+
+/****************************************************************
+   Selectricity || selectricity.org
+   Design by Courtland Allen
+  
+   "Reset Reloaded"
+   Thanks to Eric Meyer
+   http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
+*****************************************************************/
+
+/* common css files */
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, font, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+dl, dt, dd,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td {
+       margin: 0;
+       padding: 0;
+       border: 0;
+       font-size: 100%; 
+       font-family: inherit;
+       vertical-align: baseline;
+}
+
+
+#body {
+       font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
+       color: white;
+       font-size: 12px;
+       text-align: left;
+       line-height: 1.5em;
+}
+
+#body a {
+       text-decoration: underline;
+       color: inherit;
+       display: inline;
+       opacity: 0.8;
+}
+
+#body a:hover {
+       opacity: .5;
+}
+
+strong, h2, h3 {
+    font-weight: bold;
+}
+
+h2, h3 {
+       text-transform: uppercase;
+    margin-bottom: 0.5em;
+}
+
+
+/* footer */
+
+#footer {
+       font-size: 11px;
+       font-family: "Trebuchet MS", Trebuchet, Verdana, Arial, Helvetica, sans-serif;
+       margin-top: 40px;
+       text-align: center;
+}
+
+#footer a {
+       text-decoration: none;
+       color: #dc0d13;
+}
+
+#footer a:hover {
+       text-decoration: underline;
+}
diff --git a/public/stylesheets/front.css b/public/stylesheets/front.css
new file mode 100644 (file)
index 0000000..af714b8
--- /dev/null
@@ -0,0 +1,121 @@
+@charset "UTF-8";
+/* CSS Document */
+
+/****************************************************************
+   Selectricity || selectricity.org
+   Design by Courtland Allen
+*****************************************************************/
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, font, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+dl, dt, dd,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td {
+       margin: 0;
+       padding: 0;
+       border: 0;
+       font-size: 100%; 
+       font-family: inherit;
+       vertical-align: baseline;
+}
+
+body {
+       line-height: 1;
+       color: black;
+       background: #ffffff url(/images/bg_index.png) repeat-x top center;
+}
+
+/* tables still need 'cellspacing="0"' in the markup */
+table {
+       border-collapse: separate;
+}
+
+caption, th, td {
+       text-align: left;
+       font-weight: normal;
+}
+
+#page-wrapper {
+       width: 960px;
+       margin: 0 auto 0 auto;
+       text-align: center;
+}
+
+
+/* Header */
+#header h1 {
+       background: url(/images/title.png) center top no-repeat;
+       overflow: hidden;
+       padding-top: 189px;
+       height: 0px;
+       margin-top: 10px;
+}
+
+
+/* Body */
+
+#body {
+       margin-top: 9px;
+       height: 609px;
+}
+
+h2 {
+    margin-top: 0.3em;
+       font-size: 24px;
+}
+
+h3 {
+    margin-top: 1em;
+       font-size: 16px;
+}
+
+.main-section {
+       float: left;
+       padding-left: 120px;
+       padding-right: 15px;
+}
+
+.main-section p {
+       font-size: 12px;
+       overflow: hidden;
+       line-height: 2em;
+    margin-bottom: 1em;
+}
+
+#voters {
+       padding-top: 50px;
+       height: 559px;
+       width: 185px;
+       background: url(/images/bg_voters.png) top left no-repeat;
+}
+
+#voters-content {
+       height: 516px;
+}
+
+#control-room {
+       padding-top: 139px;
+       height: 470px;
+       width: 185px;
+       background: url(/images/bg_controlroom.png) top left no-repeat;
+       
+}
+
+#control-room-content {
+       height: 428px;
+}
+
+#quickvotes {
+       padding-top: 80px;
+       height: 529px;
+       width: 185px;
+       background: url(/images/bg_quickvotes.png) top left no-repeat;
+}
+
+#quickvotes-content {
+       height: 486px;
+}
+

Benjamin Mako Hill || Want to submit a patch?