made favicon sexier; extracted form-block into its own custom class; …

…made the title of pages less caps-lock.
diaspora · May 5, 2012 · a5f34e6 · a5f34e6
1 parent 0fc3992
commit a5f34e6
Show file tree

Hide file tree

Showing 14 changed files with 170 additions and 261 deletions.
diff --git a/app/assets/images/favicon.ico b/app/assets/images/favicon.ico
diff --git a/app/assets/images/favicon.png b/app/assets/images/favicon.png
diff --git a/app/assets/stylesheets/new-templates.css.scss b/app/assets/stylesheets/new-templates.css.scss
@@ -23,6 +23,10 @@
 @import 'new_styles/isotope_transitions';
 
 /* login */
+@import 'new_styles/login';
 @import 'new_styles/registration';
 
+@import 'new_styles/forms';
+
+
 @include video-overlay();
diff --git a/app/assets/stylesheets/new_styles/_forms.scss b/app/assets/stylesheets/new_styles/_forms.scss
@@ -0,0 +1,105 @@
+form.block-form {
+  display : inline-block;
+
+  label {
+    color : #555;
+  }
+
+  input {
+    &:invalid,
+    &:invalid:required,
+    &:invalid:required:focus {
+      -webkit-box-shadow : none;
+      -moz-box-shadow : none;
+      box-shadow : none;
+      box-shadow : none;
+
+      border : none;
+      color : #555;
+    }
+  }
+
+  fieldset {
+    @include border-radius(5px);
+
+    -webkit-box-shadow : inset 0 1px 1px rgba(0,0,0,0.2), 0 1px 2px rgba(255,255,255,0.7);
+
+    margin-bottom : 1em;
+
+    background-color : #fff;
+
+    border : 1px solid #888;
+
+    input[type=text],
+    input[type=email],
+    input[type=password] {
+      @include box-shadow(0,0,0,0);
+      @include border-radius(0);
+
+      background : transparent;
+
+      padding : 10px;
+
+      margin-bottom : 0;
+      border : none;
+    }
+
+  /* mainly bootstrap overrides */
+    .control-group {
+      margin : 0;
+      border-bottom : 1px solid #ddd;
+
+      .control-label,
+      input[type=text],
+      input[type=password],
+      .field_with_errors label {
+        padding : 10px;
+        margin : 0;
+      }
+
+      .controls { margin-left : 100px; position : relative; }
+      .control-label { width : 80px; }
+
+      .controls .field_with_errors input {
+        background : {
+          image : image-url('invalid_fat@2x.png');
+          repeat : no-repeat;
+          position : 197px;
+          size: 20px 20px;
+        }
+      }
+    }
+  }
+
+  input[type=submit] {
+    text-align : center;
+    display : block;
+    width : 100%;
+    padding : 8px 0;
+  }
+}
+
+
+/* buttons to be extracted? */
+.new-btn {
+  @include transition(box-shadow);
+  @include border-radius(5px);
+  @include linear-gradient(#fff, rgb(233,233,233));
+  @include box-shadow(0, 1px, 2px, rgba(0,0,0,0));
+
+  background-color : rgb(233,233,233);
+  color : #888;
+  border : 1px solid #888;
+
+  //font-family : Roboto-Bold;
+  font-size : 14px;
+  text-shadow : 0 1px 2px #eee;
+
+  &:hover {
+    @include box-shadow(0, 1px, 2px, rgba(0,0,0,0.3));
+  }
+
+  &:active {
+    box-shadow : inset 0 1px 3px rgba(0,0,0,0.3), 0 1px 2px rgba(255,255,255,0.7);
+  }
+}
diff --git a/app/assets/stylesheets/new_styles/_login.scss b/app/assets/stylesheets/new_styles/_login.scss
@@ -0,0 +1,24 @@
+#login {
+  position : absolute;
+  top : 0;
+  left : 0;
+  margin-top : 200px;
+  //background-color : #afc652;
+  min-height : 100%;
+  min-width : 100%;
+
+  //color : #fff;
+  text-align : center;
+
+  input[type=text],
+  input[type=password] {
+    width : 120px;
+  }
+
+  #huge-text {
+    font-family : Roboto-Light;
+    font-size : 200px;
+    color : #ddd;
+    text-shadow : 0 1px 0 #fff;
+  }
+}
diff --git a/app/assets/stylesheets/new_styles/_registration.scss b/app/assets/stylesheets/new_styles/_registration.scss
@@ -39,100 +39,4 @@
 
     max-width : 95%;
   }
-
-  form#user_new {
-    display : inline-block;
-
-    label {
-      color : #555;
-    }
-
-    input:invalid {
-      color : #555;
-    }
-
-    fieldset {
-      @include border-radius(5px);
-
-      -webkit-box-shadow : inset 0 1px 1px rgba(0,0,0,0.2), 0 1px 2px rgba(255,255,255,0.7);
-
-      margin-bottom : 1em;
-
-      background-color : #fff;
-
-      border : 1px solid #888;
-
-      input[type=text],
-      input[type=email],
-      input[type=password] {
-        @include box-shadow(0,0,0,0);
-        @include border-radius(0);
-
-        background : transparent;
-
-        padding : 10px;
-
-        margin-bottom : 0;
-        border : none;
-      }
-
-      /* mainly bootstrap overrides */
-      .control-group {
-        margin : 0;
-        border-bottom : 1px solid #ddd;
-
-        .control-label,
-        input[type=text],
-        input[type=password],
-        .field_with_errors label {
-          padding : 10px;
-          margin : 0;
-        }
-
-        .controls { margin-left : 100px; position : relative; }
-        .control-label { width : 80px; }
-
-        .controls .field_with_errors input {
-          color : #f15534;
-          background : {
-            image : image-url('invalid_fat@2x.png');
-            repeat : no-repeat;
-            position : 197px;
-            size: 20px 20px;
-          }
-        }
-      }
-    }
-
-    input[type=submit] {
-      text-align : center;
-      display : block;
-      width : 100%;
-      padding : 8px 0;
-    }
-  }
-}
-
-/* buttons to be extracted? */
-.new-btn {
-  @include transition(box-shadow);
-  @include border-radius(5px);
-  @include linear-gradient(#fff, rgb(233,233,233));
-  @include box-shadow(0, 1px, 2px, rgba(0,0,0,0));
-
-  background-color : rgb(233,233,233);
-  color : #888;
-  border : 1px solid #888;
-
-  //font-family : Roboto-Bold;
-  font-size : 14px;
-  text-shadow : 0 1px 2px #eee;
-
-  &:hover {
-    @include box-shadow(0, 1px, 2px, rgba(0,0,0,0.3));
-  }
-
-  &:active {
-    box-shadow : inset 0 1px 3px rgba(0,0,0,0.3), 0 1px 2px rgba(255,255,255,0.7);
-  }
 }
diff --git a/app/helpers/layout_helper.rb b/app/helpers/layout_helper.rb
@@ -14,7 +14,7 @@ def title(page_title, show_title = true)
 
   def page_title(text=nil)
     return text unless text.blank?
-    current_user ? current_user.name : t("application.helper.diaspora_alpha")
+    "Diaspora"
   end
 
   def set_asset_host

diff --git a/app/views/layouts/post.html.haml b/app/views/layouts/post.html.haml
@@ -16,8 +16,8 @@
     %meta{:name => "MobileOptimized", :content => "320"}
     %meta{:name => "viewport", :content => "initial-scale=1, maximum-scale=1"}
 
-    %link{:rel => 'shortcut icon', :href => '/favicon.png'}
-    %link{:rel => 'apple-touch-icon', :href => '/apple-touch-icon.png'}
+    %link{:rel => 'shortcut icon', :href => "#{image_path('favicon.png')}" }
+    %link{:rel => 'apple-touch-icon', :href => "#{image_path('apple-touch-icon.png')}"}
 
     = og_site_name
     = chartbeat_head_block

diff --git a/app/views/registrations/new.html.erb b/app/views/registrations/new.html.erb
@@ -23,7 +23,7 @@
               SIGN UP
             </h4>
 
-            <%= form_for(resource, :as => resource_name, :url => registration_path(resource_name), :html => {:class => "form-horizontal", :autocomplete => "off"}, :validate => true) do |f| %>
+            <%= form_for(resource, :as => resource_name, :url => registration_path(resource_name), :html => {:class => "form-horizontal block-form", :autocomplete => "off"}, :validate => true) do |f| %>
                 <fieldset>
                   <div class="control-group">
                     <label class="control-label" for="user_email">

diff --git a/app/views/sessions/new.haml b/app/views/sessions/new.haml
@@ -3,8 +3,7 @@
 -#   the COPYRIGHT file.
 
 = content_for :page_title do
-  = t('devise.sessions.new.sign_in')
-  | DIASPORA* ALPHA
+  = "Diaspora* / #{t('devise.sessions.new.sign_in')}"
 
 = content_for :head do
   = javascript_include_tag :login

diff --git a/app/views/sessions/new_working_copy.html.erb b/app/views/sessions/new_working_copy.html.erb
@@ -0,0 +1,32 @@
+<div id="login">
+
+  <h1 id="huge-text">
+    DIASPORA
+  </h1>
+
+  <%= form_for(resource, :as => resource_name, :url => session_path(resource_name), :html => {:class => "form-horizontal block-form", :autocomplete => 'off'}) do |f| %>
+        <fieldset>
+          <div class="control-group">
+              <label class="control-label" for="user_username">
+                USERNAME
+              </label>
+
+              <div class="controls">
+                <%= f.text_field :username, :required => true, :pattern => "[A-Za-z0-9_]+" %>
+              </div>
+          </div>
+
+          <div class="control-group">
+            <label class="control-label" for="user_password">
+                PASSWORD
+            </label>
+
+            <div class="controls">
+                <%= f.password_field :password, :placeholder => "••••••••", :required => true, :pattern => "......+" %>
+            </div>
+          </div>
+        </fieldset>
+
+        <%= f.submit "Sign In", :class => "new-btn" %>
+    <% end %>
+</div>