Commit f00f3965 authored by augier's avatar augier

Styling main stream

parent cf5830ad
......@@ -4,7 +4,7 @@ app.views.Photo = app.views.Base.extend({
templateName: "photo",
className : "photo loaded col-md-4 clearfix",
className : "photo loaded col-md-4 col-sm-6 clearfix",
events: {
"click .remove_post": "destroyModel"
......
// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-v3-or-Later
app.views.Photos = app.views.InfScroll.extend({
className: "clearfix",
className: "clearfix row",
postClass : app.views.Photo,
......
......@@ -26,3 +26,5 @@ $dark-blue: darken(#0984C8,10%);
$sidebars-background: #f0f0f0;
$sidebars-sub-background: darken($sidebars-background, 12%);
$left-navbar-drawer-background: darken($sidebars-background, 6%);
$card-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
\ No newline at end of file
......@@ -12,7 +12,7 @@
.stream_element.media {
border-bottom: 1px solid $border-grey;
padding: 10px;
margin: 0px;
margin: 0;
font-size: 13px;
line-height: 16px;
min-height: 50px;
......
body.page-people.action-show, body.page-people.action-contacts {
background-color: $sidebars-background;
}
#profile_container {
.profile_header {
margin-bottom: 20px;
border-left: 1px solid #dddddd;
margin-bottom: 15px;
background-color: $white;
padding-left: 10px;
padding-right: 10px;
padding-top: 20px;
margin-left: -10px;
margin-top: -20px;
box-shadow: $card-shadow;
#edit_profile, #unblock_user_button, .aspect_dropdown {
margin-top: 5px;
margin-right: 10px;
margin-top: 15px;
}
#author_info {
......@@ -51,9 +55,8 @@
}
}
#profile_horizontal_bar {
#profile-horizontal-bar {
border-top: 1px dashed $border-grey;
border-bottom: 1px solid $border-grey;
min-height: 50px;
margin-top: 10px;
#profile_buttons {
......@@ -106,15 +109,20 @@
}
#profile {
padding: 10px 20px;
background-color: $white;
padding: 20px;
margin-top: -10px;
margin-bottom: 35px;
box-shadow: $card-shadow;
#profile_photo {
margin-top: 10px;
padding-bottom: 10px;
border-bottom: 1px dashed $border-grey;
text-align: center;
}
ul#profile_information {
border-top: 1px dashed $border-grey;
margin: 0;
padding: 0;
list-style: none;
......@@ -129,6 +137,11 @@
}
.stream_container > .pagination { text-align: center; }
#people_stream {
background-color: $white;
box-shadow: $card-shadow;
}
}
#email-form{
......
body.page-streams, body.page-photos {
background-color: $sidebars-background;
}
.stream_container {
padding-left: 10px;
padding-top: 20px;
margin-left: -10px;
margin-top: -20px;
#publisher {
margin-bottom: 15px;
}
......
......@@ -24,25 +24,25 @@
top: 1px;
}
}
&:hover > .bd > .control-icons { background: #fff; }
&:hover > .bd > .control-icons { background: $white; }
}
.thumbnail {
padding: 10px;
margin: 0 5px 10px;
text-align: center;
line-height: 200px;
border: 1px solid $border-grey;
background: #fefefe;
box-shadow: 3px 3px 2px #eee;
img {
&.big_photo { max-height: 200px; }
}
margin: 0 0 15px;
background: $white;
border-radius: 0;
box-shadow: $card-shadow;
img.big_photo { max-height: 200px; }
}
}
#main_stream .stream_element {
border-bottom: 1px solid $border-grey;
padding: 10px;
margin-bottom: 20px;
background-color: $white;
border: 1px solid $light-grey;
box-shadow: $card-shadow;
& > .media {
&.shield-active .nsfw-hidden { display: none; }
&:not(.shield-active) .nsfw-shield { display: none; }
......
......@@ -22,26 +22,29 @@ h1.tag {
&:hover { border-bottom: 1px solid $border-dark-grey; }
}
}
#tags_show {
.col-md-3 {
h4 { margin: 25px 0 15px; }
.side_stream #people_stream {
.name { display: block; }
.name, .diaspora_handle {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
.page-tags {
background-color: $sidebars-background;
#tags_show {
#left-navbar-fixed-background { border-right: none; }
.col-md-3 {
h4 { margin: 25px 0 15px; }
.side_stream #people_stream {
.name { display: block; }
.name, .diaspora_handle {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
}
.col-md-7 {
.tag-following-action {
max-width: 100%;
input[type="submit"] {
overflow: hidden;
text-overflow: ellipsis;
.col-md-7 {
.tag-following-action {
max-width: 100%;
input[type="submit"] {
overflow: hidden;
text-overflow: ellipsis;
max-width: 100%;
}
}
}
}
......
......@@ -25,5 +25,5 @@
<img src="{{sizes.large}}" class="photo big_photo">
</a>
</div>
</div>
</div>
{{#if loggedIn}}
<div class="pull-right">
{{#if is_own_profile}}
{{!-- can't block myself, so don't check it here --}}
<a href="{{urlTo 'editProfile'}}" id="edit_profile" class="btn btn-primary">{{t 'people.edit_my_profile'}}</a>
{{else}} {{#if is_blocked}}
<a href="#" id="unblock_user_button" class="btn btn-danger">{{t 'people.stop_ignoring'}}</a>
{{else}}
<div class="placeholder aspect_membership_dropdown"></div>
{{/if}}{{/if}}
</div>
{{/if}}
<div id="author_info">
<h2>
<span id="name">{{name}}</span>
<span id="diaspora_handle">{{diaspora_id}}</span>
{{#if show_profile_btns}}
{{{sharingMessage this}}}
{{/if}}
</h2>
<div id="author_info" class="row">
<div class="col-sm-10">
<h2>
<span id="name">{{name}}</span>
<span id="diaspora_handle">{{diaspora_id}}</span>
{{#if show_profile_btns}}
{{{sharingMessage this}}}
{{/if}}
</h2>
{{#if has_tags}}
<div class="description">
<i class="entypo-tag"></i>
{{fmtTags profile.tags}}
</div>
{{else}}
{{#if is_own_profile}}
{{#if has_tags}}
<div class="description">
<i>{{t 'profile.you_have_no_tags'}}</i>
<span class="add_tags">
<a href="{{urlTo 'editProfile'}}">{{t 'profile.add_some'}}</a>
</span>
<i class="entypo-tag"></i>
{{fmtTags profile.tags}}
</div>
{{else}}
{{#if is_own_profile}}
<div class="description">
<i>{{t 'profile.you_have_no_tags'}}</i>
<span class="add_tags">
<a href="{{urlTo 'editProfile'}}">{{t 'profile.add_some'}}</a>
</span>
</div>
{{/if}}
{{/if}}
</div>
<div class="clearfix col-sm-2">
{{#if loggedIn}}
<div class="pull-right">
{{#if is_own_profile}}
{{!-- can't block myself, so don't check it here --}}
<a href="{{urlTo 'editProfile'}}" id="edit_profile" class="btn btn-primary">{{t 'people.edit_my_profile'}}</a>
{{else}} {{#if is_blocked}}
<a href="#" id="unblock_user_button" class="btn btn-danger">{{t 'people.stop_ignoring'}}</a>
{{else}}
<div class="placeholder aspect_membership_dropdown"></div>
{{/if}}{{/if}}
</div>
{{/if}}
{{/if}}
</div>
</div>
<div id="profile_horizontal_bar">
<div id="profile-horizontal-bar">
{{#if show_profile_btns}}
<div id="profile_buttons" class="pull-right">
{{#if is_receiving}}
......
......@@ -10,14 +10,16 @@
.container-fluid#tags_show
.row
.col-md-3.col-md-offset-1
.col-lg-1.visible-lg#left-navbar-fixed-sub-background
.col-lg-offset-1.col-lg-3.col-md-4.hidden-sm.hidden-xs#left-navbar-fixed-background
.col-lg-offset-1.col-lg-3.col-md-4
%h4
= t('.tagged_people', count: @stream.tagged_people_count, tag: @stream.display_tag_name)
.side_stream.stream
= render partial: 'people/index', locals: {people: @stream.tagged_people}
.col-md-7
.col-lg-7.col-md-8
.stream_container
#author_info
%h2
......@@ -26,13 +28,13 @@
- if current_user
= render 'publisher/publisher', :selected_aspects => @stream.aspect_ids, :aspect_ids => @stream.aspect_ids, aspect: @stream.aspect
%hr
#main_stream.stream
#paginate
%span.loader.hidden
.spinner
.col-lg-1.visible-lg#right-sidebar-fixed-sub-background
%a{id:"back-to-top", title:"#{t('layouts.application.back_to_top')}", href:"#"}
&#8679;
......@@ -22,7 +22,7 @@ Feature: show contacts
And I sign out
And I sign in as "alice@alice.alice"
And I am on "robert@grimm.grimm"'s page
Then I should see "Contacts" within "#profile_horizontal_bar"
Then I should see "Contacts" within "#profile-horizontal-bar"
When I press the first "#contacts_link"
And I press the first "a" within "#people_stream .media-body"
......@@ -38,4 +38,4 @@ Feature: show contacts
And I sign in as "alice@alice.alice"
And I am on "robert@grimm.grimm"'s page
Then I should not see "Contacts" within "#profile_horizontal_bar"
Then I should not see "Contacts" within "#profile-horizontal-bar"
......@@ -25,7 +25,7 @@ Feature: show photos
Scenario: I cannot see photos of people who don't share with me
When I sign in as "alice@alice.alice"
And I am on "robert@grimm.grimm"'s page
Then I should not see "Photos" within "#profile_horizontal_bar"
Then I should not see "Photos" within "#profile-horizontal-bar"
Scenario: I delete a photo
When I am on "robert@grimm.grimm"'s photos page
......@@ -33,4 +33,4 @@ Feature: show photos
And I confirm the alert
Then I should not see a ".stream"
When I am on "robert@grimm.grimm"'s page
Then I should not see "Photos" within "#profile_horizontal_bar"
Then I should not see "Photos" within "#profile-horizontal-bar"
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment