nocebo/diaspora
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #4583 from Flaburgan/refactor-mobile-header

Browse source 
Refactor mobile header, close #4579

Conflicts:
	Changelog.md
This commit is contained in:
Jonne Haß 2013-11-10 23:55:55 +01:00
commit 859cd83e38
3 changed files with 73 additions and 90 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
Changelog.md
View file

@ -34,6 +34,7 @@
* Avoid publishing empty posts [#4542](https://github.com/diaspora/diaspora/pull/4542)
* Force comments sort order in mobile spv [#4578](https://github.com/diaspora/diaspora/pull/4578)
* Fix getting started page for mobile [#4536](https://github.com/diaspora/diaspora/pull/4536)
* Refactor mobile header, fix [#4579](https://github.com/diaspora/diaspora/issues/4579)
## Features
* Add oEmbed content to the mobile view [#4343](https://github.com/diaspora/diaspora/pull/4353)

122
app/assets/stylesheets/mobile.css.scss
View file

@ -308,84 +308,68 @@ body {
.right {
float: right; }
.navbar {
@include box-shadow(0,1px,2px,#333);
}
.navbar-inner {
@include box-shadow(0,1px,2px,#333);
background: {
image: image-url("header-bg-long.jpg");
}
width: 100%;
header {
position: fixed;
top: 0px;
left: 0px;
right: 0px;
min-width: 250px;
z-index: 10;
background: url("header-bg-long.jpg") rgb(40,35,35);
@include box-shadow(0, 1px, 2px, #333);
border-bottom: 1px solid #222;
border: {
bottom: 1px solid #222;
#header_title { display: inline-block; }
#nav_badges {
float: right;
margin: 4px 12px;
.badge {
display: inline;
margin-left: 3px;
padding: 8px 3px;
padding-bottom: 9px;
font-weight: bold;
font-size: smaller;
width: 28px;
}
.badge:hover .badge_count {
background-color: #bd0902;
}
a {
padding: 5px 0px;
}
}
}
#nav_badges {
display: inline-block;
float: right;
padding: 4px 12px;
a:hover {
text-decoration: none;
}
.badge {
position: relative;
display: inline;
margin-left: 3px;
padding: 8px 3px;
padding-bottom: 9px;
font-weight: bold;
.badge_count {
-moz-border-radius: 2px 2px 2px 2px;
-webkit-border-radius: 2px 2px 2px 2px;
border-radius: 2px 2px 2px 2px;
z-index: 3;
position: absolute;
top: 1px;
padding: 0 2px;
padding-bottom: 1px;
background-color: $red;
line-height: 12px;
color: white;
font-size: smaller;
width: 28px;
}
.badge:hover .badge_count {
background-color: #bd0902;
#notification {
right: 140px;
}
a {
padding: 5px 0px;
#conversation {
right: 110px;
}
}
.badge_count {
-moz-border-radius: 2px 2px 2px 2px;
-webkit-border-radius: 2px 2px 2px 2px;
border-radius: 2px 2px 2px 2px;
z-index: 3;
position: absolute;
top: 1px;
padding: 0 2px;
padding-bottom: 1px;
background-color: $red;
line-height: 12px;
color: white;
font-size: smaller;
}
#notification {
right: 140px;
}
#conversation {
right: 110px;
}
.badge-inverse {
background-color: #333333 !important;
}
#header_title {
position: relative;
top: -3px;
.badge-inverse {
background-color: #333333 !important;
}
}
footer {

40
app/views/layouts/application.mobile.haml
View file

@ -46,28 +46,26 @@
= yield(:head)
%body
.navbar.navbar-fixed-top
.navbar-inner
.container{:style => "position: relative;"}
= link_to(image_tag('branding/header-logo2x.png', :height => 40, :width => 40, :id => 'header_title'), stream_path)
%header
= link_to(image_tag('branding/header-logo2x.png', height: 40, width: 40), stream_path, id: 'header_title')
- if user_signed_in?
#nav_badges
= link_to(image_tag('icons/my_activity.png', :class => 'my_activity'), activity_stream_path, :class => "badge badge-inverse", :id => "my_activity_badge")
= link_to(image_tag('icons/notifications_grey.png', :height => 16, :width => 16, :id => 'notification-flag'), notifications_path, :class => "badge badge-inverse", :id => "notification_badge")
- if current_user.unread_notifications.count > 0
.badge_count{:id => "notification"}
= current_user.unread_notifications.count
= link_to(image_tag('icons/mail_grey.png', :height => 11, :width => 17), conversations_path, :class => "badge badge-inverse", :id => "conversations_badge")
- if current_user.unread_message_count > 0
.badge_count{:id => "conversation"}
= current_user.unread_message_count
= link_to(image_tag('icons/search_grey.png', :height => 14, :width => 14), people_path, :class => "badge badge-inverse", :id => "people_badge")
= link_to(image_tag('icons/user_grey.png', :height => 16, :width => 16), contacts_path, :class => "badge badge-inverse", :id => "contacts_badge")
- if yield(:header_action).present?
= yield(:header_action)
- else
= link_to(image_tag('icons/compose_mobile2.png', :class => 'compose_icon'), new_status_message_path)
- if user_signed_in?
#nav_badges
= link_to(image_tag('icons/my_activity.png', class: 'my_activity'), activity_stream_path, class: "badge badge-inverse", id: "my_activity_badge")
= link_to(image_tag('icons/notifications_grey.png', height: 16, width: 16, id: 'notification-flag'), notifications_path, class: "badge badge-inverse", id: "notification_badge")
- if current_user.unread_notifications.count > 0
.badge_count{id: "notification"}
= current_user.unread_notifications.count
= link_to(image_tag('icons/mail_grey.png', height: 11, width: 17), conversations_path, class: "badge badge-inverse", id: "conversations_badge")
- if current_user.unread_message_count > 0
.badge_count{id: "conversation"}
= current_user.unread_message_count
= link_to(image_tag('icons/search_grey.png', height: 14, width: 14), people_path, class: "badge badge-inverse", id: "people_badge")
= link_to(image_tag('icons/user_grey.png', height: 16, width: 16), contacts_path, class: "badge badge-inverse", id: "contacts_badge")
- if yield(:header_action).present?
= yield(:header_action)
- else
= link_to(image_tag('icons/compose_mobile2.png', class: 'compose_icon'), new_status_message_path)
#main.container{:role => "main"}
.row