moved nav to bottom header

This commit is contained in:
danielvincent 2010-06-19 03:01:39 -07:00
parent d1630b6c45
commit 0c392a0cce
7 changed files with 170 additions and 132 deletions

View file

@ -1,38 +1,29 @@
%div.big_text#info_top /%div.big_text#info_top
welcome home, daniel. /welcome home, daniel.
%p.description /%p.description
this is your diaspora dashboard, a place where you can catch a /this is your diaspora dashboard, a place where you can catch a
= link_to "glimpse", "#" /= link_to "glimpse", "#"
of what all your friends are doing. /of what all your friends are doing.
.span-16.append-2.last
%div.big_text
recent activity
/%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 .span-6.last
%div{ :style => "padding: 1em" } %div.big_text
%div.big_text requests
daniel grippi
%img{:src=>"/images/bp.jpeg", :id => "profile_image"} %div.big_text
%div.big_number= link_to "30", "#"
%div.big_text new requests
requests
%div.big_text
%div.big_number= link_to "30", "#"
new requests
.prepend-2.span-16.last
%div{ :style => "padding: 1em" }
%div.big_text
updates
/%div#publish
/- form_for 'update' do |f|
/= f.text_field :thought
%ul#stream
- for post in @posts
%li
= render "status_messages/pane", :post => post

View file

@ -20,21 +20,22 @@
#huge_star * #huge_star *
%a#diaspora_text{:href => root_path} %a#diaspora_text{:href => root_path}
/%img{:src => '/images/diaspora_white.png'} /%img{:src => '/images/diaspora_white.png'}
%ul.nav
%li= link_to "home", root_path
%li= link_to "users", users_path
%li= link_to "status messages", status_messages_path
%li= link_to "friends", friends_path
%li= link_to "bookmarks", bookmarks_path
%li= link_to "blogs", blogs_path
#session_action #session_action
- if user_signed_in? - if user_signed_in?
= link_to "log out", destroy_user_session_path = link_to User.first.email, destroy_user_session_path
- else - else
= link_to "login", new_user_session_path = link_to "login", new_user_session_path
#header_below #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 "friends", friends_path
.container .container
- if show_title? - if show_title?

View file

@ -1,4 +1,10 @@
%sp.message %li
%sp.from= post.owner .span-2.last
= post.message %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"

Binary file not shown.

Before

Width:  |  Height:  |  Size: 261 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.5 KiB

View file

@ -52,46 +52,55 @@ h4 {
margin: 0; } margin: 0; }
#header { #header {
min-height: 35px; height: 30px;
color: white; color: white;
font-size: 110%; font-size: 110%;
background-color: #1a1a21; background-color: #1a1a21;
border-bottom: 1px solid white; } border-bottom: 1px solid white;
padding-top: 5px; }
#header #huge_star { #header #huge_star {
position: absolute; position: absolute;
font-size: 80px; font-family: "helvetica neue", "helvetica", "arial", "sans-serif";
top: -25px; } font-size: 60px;
top: -15px; }
#header #diaspora_text { #header #diaspora_text {
border: none; } border: none; }
#header #session_action { #header #session_action {
display: none; float: right;
float: right; } font-size: 110%;
#header ul.nav { margin-top: 1px; }
padding: 0; #header #session_action a {
margin: 0; color: #cccccc;
margin-top: 6px; border: none; }
display: block; #header #session_action a:hover {
font-size: 130%; color: white; }
float: right; }
#header ul.nav li { ul.nav {
display: inline; padding: 0;
margin-right: 1em; } margin: 0;
#header ul.nav li:last-child { font-size: 130%;
margin: 0; } position: absolute;
#header ul.nav a { margin-top: -62px; }
border-bottom: none; ul.nav li {
color: #999999; } display: inline;
#header ul.nav a:hover { margin-right: 1em;
color: #cccccc; } padding: 5px 10px;
background: #f2f8fc;
border: 1px solid white;
border-bottom: none; }
ul.nav li:first-child {
background: white; }
ul.nav li:last-child {
margin: 0; }
ul.nav a {
border-bottom: none;
color: #b1cfe3; }
ul.nav a:hover {
color: #cccccc; }
#header_below { #header_below {
background-color: #e6eff7; background-color: #e6eff7;
min-height: 150px; text-align: right; }
line-height: 150px;
border-bottom: 0;
position: relative;
text-align: right;
z-index: -2; }
#left_pane { #left_pane {
background-color: #e6eff7; background-color: #e6eff7;
@ -105,33 +114,37 @@ ul#stream {
ul#stream > li { ul#stream > li {
list-style: none; list-style: none;
padding: 2em; padding: 2em;
-webkit-box-shadow: 0 4px 5px -5px #999999; } -webkit-box-shadow: 0 4px 5px -5px #999999;
ul#stream > li:first-child { min-height: 40px; }
padding-top: 0; } ul#stream > li img.avatar {
background: white;
padding: 2px;
border: 1px solid #eaeaea;
border-radius: 3px; }
sp.message { sp.message {
font-size: 110%; font-size: 120%;
letter-spacing: 0.1em; } color: #999999;
text-shadow: none; }
sp.message sp.from { sp.message sp.from {
color: #999999; } color: black; }
sp.message sp.time {
color: #cccccc;
font-size: 80%; }
div.big_text { div.big_text {
font-size: 24px; font-size: 24px;
font-weight: bold; font-weight: bold;
line-height: 36px; line-height: 36px; }
margin-bottom: 2em; }
div.big_text p.description { div.big_text p.description {
font-weight: normal; font-weight: normal;
color: #999999; } color: #999999; }
div.big_text .big_number { div.big_text .big_number {
font-size: 300%; } font-size: 300%;
line-height: 100%; }
div.big_text .big_number a { div.big_text .big_number a {
border: none; } border: none; }
#info_top {
margin-top: -130px;
margin-bottom: 50px; }
#publish input { #publish input {
font-size: 30px; font-size: 30px;
padding: 7px; padding: 7px;
@ -139,6 +152,10 @@ div.big_text {
width: 90%; } width: 90%; }
#profile_image { #profile_image {
margin-top: 1em; margin-top: 0;
width: 240px; width: 100px;
border: 2px solid #eaeaea; } border: 2px solid #eaeaea; }
.yellow {
background: #fffdb8;
border: 1px solid #e3e08d; }

View file

@ -58,7 +58,7 @@ h4
:margin 0 :margin 0
#header #header
:min-height 35px :height 30px
:color #fff :color #fff
:font :font
:size 110% :size 110%
@ -66,58 +66,72 @@ h4
:color #1A1A21 :color #1A1A21
:border :border
:bottom 1px solid #fff :bottom 1px solid #fff
:padding
:top 5px
#huge_star #huge_star
:position absolute :position absolute
:font :font
:size 80px :family 'helvetica neue', 'helvetica', 'arial', 'sans-serif'
:size 60px
//:background //:background
//:color #ff3378 //:color #ff3378
:top -25px :top -15px
#diaspora_text #diaspora_text
:border none :border none
#session_action #session_action
:display none
:float right :float right
:font-size 110%
ul.nav :margin-top 1px
:padding 0
:margin 0
:margin-top 6px
:display block
:font
:size 130%
:float right
li
:display inline
:margin
:right 1em
li:last-child
:margin 0
a a
:border :color #ccc
:bottom none :border none
:color #999
&:hover &:hover
:color #ccc :color #fff
ul.nav
:padding 0
:margin 0
:font
:size 130%
:position absolute
:margin-top -62px
li
:display inline
:margin
:right 1em
:padding 5px 10px
:background #F2F8FC
:border 1px solid #fff
:border-bottom none
li:first-child
:background #fff
li:last-child
:margin 0
a
:border
:bottom none
:color #B1CFE3
&:hover
:color #ccc
#header_below #header_below
:background :background
:color #e6eff7 :color #e6eff7
:min-height 150px
:line-height 150px
:border-bottom 0
:position relative
:text-align right :text-align right
:z-index -2
#left_pane #left_pane
:background :background
@ -134,17 +148,27 @@ ul#stream
:list-style none :list-style none
:padding 2em :padding 2em
:-webkit-box-shadow 0 4px 5px -5px #999 :-webkit-box-shadow 0 4px 5px -5px #999
> li:first-child :min-height 40px
:padding-top 0
img.avatar
background: #fff
padding: 2px
:border 1px solid #eaeaea
:border-radius 3px
sp.message sp.message
:font :font
:size 110% :size 120%
:letter-spacing 0.1em :color #999
:text-shadow none
sp.from sp.from
:color #999 :color #000
sp.time
:color #ccc
:font-size 80%
div.big_text div.big_text
@ -152,7 +176,6 @@ div.big_text
:size 24px :size 24px
:weight bold :weight bold
:line-height 36px :line-height 36px
:margin-bottom 2em
p.description p.description
:font :font
@ -162,13 +185,10 @@ div.big_text
.big_number .big_number
:font :font
:size 300% :size 300%
:line-height 100%
a a
:border none :border none
#info_top
:margin
:top -130px
:bottom 50px
#publish #publish
input input
@ -181,8 +201,11 @@ div.big_text
#profile_image #profile_image
:margin :margin
:top 1em :top 0
:width 240px :width 100px
:border 2px solid #eaeaea :border 2px solid #eaeaea
.yellow
:background #FFFDB8
:border 1px solid #E3E08D