diff --git a/app/views/dashboard/index.html.haml b/app/views/dashboard/index.html.haml
index d7a02fdb37b3d51b0e4b223f071a5897ae4f40a5..917e173d7d44010ef787fc8c48bb3f5bd256dfaf 100644
--- a/app/views/dashboard/index.html.haml
+++ b/app/views/dashboard/index.html.haml
@@ -6,24 +6,36 @@
/= link_to "glimpse", "#"
/of what all your friends are doing.
-.span-16.append-2.last
+.span-15.append-2.last
+
+ %div.small_text
+ what's crackalackin', daniel?
+ %div#publish
+ - form_for 'StatusMessage' do |f|
+ = f.text_field :thought
%div.big_text
recent activity
+ %div.filters
+ = link_to "displaying all", "#"
- /%div#publish
- /- form_for 'StatusMessage' do |f|
- /= f.text_field :thought
%ul#stream
- for post in @posts
= render "status_messages/pane", :post => post
-.span-6.last
- %div.big_text
- requests
+.span-7.last
- %div.big_text
- %div.big_number= link_to "30", "#"
- new requests
+ %div.info_pane
+ %img{:src => "/images/mocks/bp.jpeg", :width => '100%', :class => "profile_image"}
+ %div.big_text
+ daniel grippi
+
+ %div.info_pane
+ %div.big_text
+ requests
+
+ %div.big_text
+ %div.big_number= link_to "30", "#"
+ new requests
diff --git a/app/views/devise/sessions/new.html.haml b/app/views/devise/sessions/new.html.haml
index 43cd65929aa705ae2a1299d5945f87276b54c1ce..7855cf39bed3f764b42f76da72fe7d7d7aafbf3a 100644
--- a/app/views/devise/sessions/new.html.haml
+++ b/app/views/devise/sessions/new.html.haml
@@ -1,16 +1,15 @@
-%h2 Sign in
-= form_for(resource, :as => resource_name, :url => session_path(resource_name)) do |f|
- %p
- = f.label :email
- %br/
+%div.centered
+ %div.big_text
+ sign in
+
+ = form_for(resource, :as => resource_name, :url => session_path(resource_name)) do |f|
= f.text_field :email
- %p
- = f.label :password
- %br/
+ %br
= f.password_field :password
- - if devise_mapping.rememberable?
%p
- = f.check_box :remember_me
- = f.label :remember_me
- %p= f.submit "Sign in"
-= render :partial => "devise/shared/links"
+ - if devise_mapping.rememberable?
+ = f.check_box :remember_me
+ = f.label :remember_me
+ %br
+ = f.submit "Sign in"
+ = render :partial => "devise/shared/links"
diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml
index d5d56987dcc43dbccb071e045e8fbb09b1387ddf..0afd02c649170f58332b185b967be89a6c88b86e 100644
--- a/app/views/layouts/application.html.haml
+++ b/app/views/layouts/application.html.haml
@@ -19,7 +19,7 @@
.container
#huge_star *
%a#diaspora_text{:href => root_path}
- /%img{:src => '/images/diaspora_white.png'}
+ %img{:src => '/images/diaspora_white.png'}
#session_action
- if user_signed_in?
@@ -29,12 +29,9 @@
#header_below
.container
- %div.big_text#info_top
- daniel grippi posted a new update
- %p.description
- let's take this into overdrive.
%ul.nav
%li= link_to "home", root_path
+ %li= link_to "status messages", status_messages_path
%li= link_to "friends", friends_path
.container
diff --git a/app/views/status_messages/_pane.html.haml b/app/views/status_messages/_pane.html.haml
index f98226072fdab3e34df90eeb43883361b978ceee..f09dcb9b2a51adb6520323a4c48be7c33aeb4ff6 100644
--- a/app/views/status_messages/_pane.html.haml
+++ b/app/views/status_messages/_pane.html.haml
@@ -1,10 +1,9 @@
%li
- .span-2.last
- %img{:src => "/images/mocks/user_pic.jpeg", :height => "35px", :class => "avatar"}
- .span-13.last
- %sp.message
- %sp.from= post.owner
- = post.message
- %br
- %sp.time= "#{time_ago_in_words(post.updated_at)} ago"
+ %img{:src => "/images/mocks/user_pic.jpeg", :class => "avatar"}
+ %sp.message
+ %sp.from= link_to post.owner, "#"
+ /%sp.from Daniel Grippi
+ = post.message
+ %br
+ %sp.time= "#{time_ago_in_words(post.updated_at)} ago"
diff --git a/public/images/diaspora_white.png b/public/images/diaspora_white.png
index cc4a1ab3b4f16bd7cdd26ad0accbf5a683176abc..2a7260ea414c0b34f59c0527dada16b38cf7590d 100644
Binary files a/public/images/diaspora_white.png and b/public/images/diaspora_white.png differ
diff --git a/public/images/mocks/bp.jpeg b/public/images/mocks/bp.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..33f75aa044a365d52811406f0a43d8d5068cec30
Binary files /dev/null and b/public/images/mocks/bp.jpeg differ
diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
index 5aa1fb1b45647e8675c8d7c5fd372e549b1e0ad4..a22a52242ed8bfb2f9e85e5ee3cbc6b184c3e6e1 100644
--- a/public/stylesheets/application.css
+++ b/public/stylesheets/application.css
@@ -3,8 +3,7 @@ body {
a {
color: #cc1e14;
- text-decoration: none;
- border-bottom: dotted 1px #999999; }
+ text-decoration: none; }
h1,
h2,
@@ -56,15 +55,18 @@ h4 {
color: white;
font-size: 110%;
background-color: #1a1a21;
- border-bottom: 1px solid white;
+ border-bottom: 2px solid white;
padding-top: 5px; }
#header #huge_star {
+ display: none;
position: absolute;
font-family: "helvetica neue", "helvetica", "arial", "sans-serif";
font-size: 60px;
top: -15px; }
#header #diaspora_text {
- border: none; }
+ position: absolute;
+ border: none;
+ top: 8px; }
#header #session_action {
float: right;
font-size: 110%;
@@ -76,20 +78,22 @@ h4 {
color: white; }
ul.nav {
+ position: absolute;
padding: 0;
margin: 0;
font-size: 130%;
- position: absolute;
- margin-top: -62px; }
+ bottom: 2px; }
ul.nav li {
display: inline;
- margin-right: 1em;
+ margin-right: 0.5em;
padding: 5px 10px;
background: #f2f8fc;
border: 1px solid white;
border-bottom: none; }
ul.nav li:first-child {
background: white; }
+ ul.nav li:first-child a {
+ color: #1a1a21; }
ul.nav li:last-child {
margin: 0; }
ul.nav a {
@@ -99,8 +103,11 @@ ul.nav {
color: #cccccc; }
#header_below {
+ position: relative;
background-color: #e6eff7;
- text-align: right; }
+ text-align: right;
+ height: 70px;
+ margin-bottom: 40px; }
#left_pane {
background-color: #e6eff7;
@@ -113,26 +120,32 @@ ul#stream {
color: #666666; }
ul#stream > li {
list-style: none;
- padding: 2em;
- -webkit-box-shadow: 0 4px 5px -5px #999999;
- min-height: 40px; }
+ padding: 1em;
+ border-bottom: 1px solid #f1f1f1; }
ul#stream > li img.avatar {
- background: white;
- padding: 2px;
- border: 1px solid #eaeaea;
- border-radius: 3px; }
+ width: 45px;
+ background: white; }
sp.message {
+ position: absolute;
+ float: left;
+ margin-left: 10px;
+ margin-top: -2px;
+ line-height: 17px;
font-size: 120%;
- color: #999999;
- text-shadow: none; }
+ font-family: "Lucida Grande";
+ color: #666666;
+ text-shadow: none;
+ width: 480px; }
sp.message sp.from {
- color: black; }
+ color: black;
+ font-weight: bold; }
sp.message sp.time {
- color: #cccccc;
- font-size: 80%; }
+ color: #bababa;
+ font-size: 70%; }
div.big_text {
+ position: relative;
font-size: 24px;
font-weight: bold;
line-height: 36px; }
@@ -142,20 +155,42 @@ div.big_text {
div.big_text .big_number {
font-size: 300%;
line-height: 100%; }
- div.big_text .big_number a {
- border: none; }
+ div.big_text .filters {
+ position: absolute;
+ right: 0;
+ display: inline;
+ font-size: 12px;
+ font-weight: normal; }
+
+div.small_text {
+ position: relative;
+ font-size: 18px;
+ font-weight: bold; }
#publish input {
font-size: 30px;
padding: 7px;
border-radius: 5px;
- width: 90%; }
+ width: 100%;
+ margin-bottom: 1em; }
#profile_image {
+ display: inline block;
margin-top: 0;
width: 100px;
border: 2px solid #eaeaea; }
-.yellow {
- background: #fffdb8;
- border: 1px solid #e3e08d; }
+form {
+ font-size: 130%; }
+ form input {
+ font-size: 150%;
+ padding: 0.2em; }
+
+.centered {
+ text-align: center; }
+
+.info_pane {
+ padding: 1em;
+ background-color: #1a1a21;
+ color: #f5fafd;
+ margin-bottom: 1em; }
diff --git a/public/stylesheets/sass/application.sass b/public/stylesheets/sass/application.sass
index 592e115c55e1540f94bd5094a059837f6f8483ce..61e34bfbd5c6ac84ee4a517a0724023f5de246e1 100644
--- a/public/stylesheets/sass/application.sass
+++ b/public/stylesheets/sass/application.sass
@@ -6,8 +6,6 @@ a
:color #CC1E14
:text
:decoration none
- :border
- :bottom dotted 1px #999
h1,
h2,
@@ -65,12 +63,13 @@ h4
:background
:color #1A1A21
:border
- :bottom 1px solid #fff
+ :bottom 2px solid #fff
:padding
:top 5px
#huge_star
+ :display none
:position absolute
:font
:family 'helvetica neue', 'helvetica', 'arial', 'sans-serif'
@@ -80,7 +79,9 @@ h4
:top -15px
#diaspora_text
+ :position absolute
:border none
+ :top 8px
#session_action
@@ -95,17 +96,17 @@ h4
ul.nav
+ :position absolute
:padding 0
:margin 0
:font
:size 130%
- :position absolute
- :margin-top -62px
+ :bottom 2px
li
:display inline
:margin
- :right 1em
+ :right 0.5em
:padding 5px 10px
:background #F2F8FC
:border 1px solid #fff
@@ -113,6 +114,8 @@ ul.nav
li:first-child
:background #fff
+ a
+ :color #1A1A21
li:last-child
:margin 0
@@ -125,13 +128,15 @@ ul.nav
:color #ccc
-
-
-
#header_below
+ :position relative
:background
:color #e6eff7
:text-align right
+ :height 70px
+ :margin
+ :bottom 40px
+
#left_pane
:background
@@ -146,32 +151,42 @@ ul#stream
:color #666
> li
:list-style none
- :padding 2em
- :-webkit-box-shadow 0 4px 5px -5px #999
- :min-height 40px
+ :padding 1em
+ //:-webkit-box-shadow 0 4px 5px -5px #999
+ :border
+ :bottom 1px solid #f1f1f1
img.avatar
+ :width 45px
background: #fff
- padding: 2px
- :border 1px solid #eaeaea
- :border-radius 3px
sp.message
+ :position absolute
+ :float left
+ :margin
+ :left 10px
+ :top -2px
+ :line-height 17px
:font
:size 120%
- :color #999
+ :family 'Lucida Grande'
+ :color #666
:text-shadow none
+ :width 480px
sp.from
:color #000
+ :font
+ :weight bold
sp.time
- :color #ccc
- :font-size 80%
+ :color #bababa
+ :font-size 70%
div.big_text
+ :position relative
:font
:size 24px
:weight bold
@@ -186,8 +201,21 @@ div.big_text
:font
:size 300%
:line-height 100%
- a
- :border none
+
+ .filters
+ :position absolute
+ :right 0
+ :display inline
+ :font
+ :size 12px
+ :weight normal
+
+div.small_text
+ :position relative
+ :font
+ :size 18px
+ :weight bold
+
#publish
@@ -196,16 +224,35 @@ div.big_text
:size 30px
:padding 7px
:border-radius 5px
- :width 90%
+ :width 100%
+ :margin
+ :bottom 1em
#profile_image
+ :display inline block
:margin
:top 0
:width 100px
-
:border 2px solid #eaeaea
-.yellow
- :background #FFFDB8
- :border 1px solid #E3E08D
+
+form
+ :font
+ :size 130%
+
+ input
+ :font
+ :size 150%
+ :padding 0.2em
+
+.centered
+ :text-align center
+
+.info_pane
+ :padding 1em
+ :background
+ :color #1A1A21
+ :color #f5fafd
+ :margin
+ :bottom 1em