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

Merge pull request #5762 from svbergerem/entypo-controls

Browse source 
Use entypo for control icons
This commit is contained in:
Jonne Haß 2015-03-12 19:29:40 +01:00
commit cc585805ad
19 changed files with 101 additions and 239 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
app/assets/javascripts/app/views/conversations_view.js
View file

@ -19,6 +19,7 @@ app.views.Conversations = Backbone.View.extend({
setupConversation: function() {
app.helpers.timeago($(this.el));
$('.control-icons a').tooltip({placement: 'bottom'});
var conv = $('.conversation-wrapper .stream_element.selected'),
cBadge = $('#conversations_badge .badge_count');

2
app/assets/javascripts/app/views/photo_view.js
View file

@ -10,7 +10,7 @@ app.views.Photo = app.views.Base.extend({
"click .remove_post": "destroyModel"
},
tooltipSelector : ".block_user, .delete",
tooltipSelector : ".control-icons a",
initialize : function() {
$(this.el).attr("id", this.model.get("guid"));

4
app/assets/javascripts/app/views/single-post-viewer/single_post_comment_stream.js
View file

@ -1,12 +1,12 @@
// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-v3-or-Later
app.views.SinglePostCommentStream = app.views.CommentStream.extend({
tooltipSelector: "time, .controls a",
tooltipSelector: "time, .control-icons a",
initialize: function(){
$(window).on('hashchange',this.highlightPermalinkComment);
},
highlightPermalinkComment: function() {
if(document.location.hash){
var element = $(document.location.hash);

2
app/assets/javascripts/app/views/single-post-viewer/single_post_moderation.js
View file

@ -1,6 +1,8 @@
app.views.SinglePostModeration = app.views.Feedback.extend({
templateName: "single-post-viewer/single-post-moderation",
className: 'control-icons',
events: function() {
return _.defaults({
"click .remove_post": "destroyModel",

2
app/assets/stylesheets/application.scss
View file

@ -22,8 +22,6 @@
/* login */
@import 'new_styles/login';
@import 'new_styles/registration';
@import 'new_styles/landing';
@import 'new_styles/forms';
/* navs */

11
app/assets/stylesheets/conversations.scss
View file

@ -127,15 +127,10 @@
padding: 5px;
line-height: 0px;
a.close_conversation {
.hide_conversation, .delete_conversation {
display: block;
margin-top: 10px;
float: right;
.icons-deletelabel {
height: 14px;
width: 14px;
}
margin-top: 25px;
margin-left: 10px;
}
.avatar {

46
app/assets/stylesheets/new_styles/_interactions.scss
View file

@ -1,5 +1,34 @@
.control-icons {
a {
margin-right: 5px;
&:hover { text-decoration: none; }
i.entypo {
color: $text-grey;
font-size: $font-size-text;
line-height: $line-height;
vertical-align: top;
&:hover { color: $text; }
&.cross { font-size: $line-height; }
}
&.hide_conversation i {
font-size: $line-height*1.5;
}
&.delete_conversation i {
font-size: $font-size-text*1.5;
}
&.destroy_participation i {
color: $black;
&:hover { color: $text-dark-grey; }
}
}
}
.stream_container, #single-post-interactions {
.controls {
.control-icons {
z-index: 6;
float: right;
@ -10,15 +39,6 @@
.destroy_participation,
.post_report {
display: inline-block;
.icons-create_participation,
.icons-deletelabel,
.icons-destroy_participation,
.icons-ignoreuser,
.icons-report {
height: 14px;
width: 14px;
}
}
& > a:hover {
@ -27,13 +47,13 @@
}
.stream_element, .comment, .photo, .stream_element:hover .comment {
.controls > a {
.control-icons > a {
@include transition(opacity);
opacity: 0;
}
&:hover .controls {
& > a { opacity: 0.3; }
&:hover .control-icons {
& > a { opacity: 0.8; }
& > a:hover { opacity: 1; }
}
}

113
app/assets/stylesheets/new_styles/_landing.scss
View file

@ -1,113 +0,0 @@
/* le declarations */
#landing {
overflow : hidden;
position : absolute;
min-height : 100%;
width : 100%;
top : 0;
left : 0;
background : {
color : #fff;
}
#sign_up {
text-align:center;
position : relative;
z-index : 20;
border-bottom: 1px solid #ccc;
padding-bottom:50px;
form {
label.control-label { width : 80px !important; text-align:right; }
.controls { margin-left : 100px; }
input[type='submit'] {
@include transition(background);
box-shadow: 0 0 0 0;
font-size:1.2em;
background : #99CC00;
color : #fff;
text-shadow : 0 -1px 0 #669900;
border : 1px solid $border-dark-grey;
&:hover {
background : desaturate(#99CC00, 15%);
}
&:active {
box-shadow: 0 0 0 0;
background : darken(rgb(255, 77, 54), 2%);
}
}
}
}
#invites {
margin : 20px 0;
}
#footer {
position : absolute;
bottom : 0;
left : 0;
width : 100%;
padding : 10px 0;
color : #333;
text-align : center;
}
#landing_banner {
.container {
position:relative;
}
text-align:center;
padding:50px;
margin-bottom:50px;
color:#ccc;
background:#222;
h2 {
font-weight:100;
}
.landing-logo {
margin-bottom:15px;
height:60px;
}
.landing-banner-right {
position:absolute;
right:0;
a {
color:#ccc;
font-size:1.2em;
font-weight:100;
padding:5px 10px;
}
}
.login-button {
border-radius: 3px;
border:1px solid #666;
background:#111;
&:hover {
background:#222;
border:1px solid $border-dark-grey;
text-decoration:none;
}
}
}
#steps {
text-align: center;
p {
color: $text-dark-grey;
}
}
}

19
app/assets/stylesheets/photo.scss
View file

@ -1,19 +0,0 @@
.photo {
.controls:first-child {
.control_icon {
@include transition(opacity);
opacity: 0;
}
}
&:hover {
.controls:first-child {
.control_icon {
opacity: 0.3;
}
.control_icon:hover {
opacity: 1;
}
}
}
}

4
app/assets/stylesheets/rtl.scss
View file

@ -251,10 +251,6 @@ ul.comments li form p, ul.show_comments li form p, div.likes li form p, div.disl
right: 35px;
}
ul.comments li.posted .controls .delete {
float: left
}
.stream .stream_element time {
right: auto;
left: 20px;

20
app/assets/stylesheets/single-post-view.scss
View file

@ -44,7 +44,7 @@
#single-post-moderation {
margin-left: 5px;
> div.info {
> div.control-icons {
display: inline-block;
}
}
@ -91,24 +91,6 @@
}
}
}
#single-post-moderation {
a:hover {
text-decoration: none;
}
i {
padding-right: 5px;
vertical-align: top;
&:hover {
color: #424242;
}
}
a.post_report > i {
font-size: $font-size-text;
}
i.cross {
font-size: 20px;
}
}
}
#body {

13
app/assets/stylesheets/stream_element.scss
View file

@ -5,7 +5,7 @@
}
&.deleting {
> .media { opacity: 0.3; }
.controls { display: none !important; }
.control-icons { display: none !important; }
}
}
@ -15,17 +15,16 @@
> .bd {
position: relative;
overflow: inherit;
> .controls {
> .control-icons {
border-radius: 4px;
padding-left: 5px;
position: absolute;
right: 6px;
top: 1px;
width: 15px;
height: 15px;
text-align: center;
line-height: 15px;
top: 1px;
}
}
&:hover > .bd > .controls { background: #fff; }
&:hover > .bd > .control-icons { background: #fff; }
}
.thumbnail {
height: 200px;

6
app/assets/templates/comment_tpl.jst.hbs
View file

@ -6,15 +6,15 @@
</div>
<div class="bd">
<div class="controls">
<div class="control-icons">
{{#if loggedIn}}
{{#if canRemove}}
<a href="#" class="delete comment_delete" title="{{t "delete"}}">
<div alt="Deletelabel" class="icons-deletelabel" />
<i class="entypo trash"></i>
<a/>
{{else}}
<a href="#" data-type="comment" class="comment_report" title="{{t "report.name"}}">
<div class="icons-report"/>
<i class="entypo warning"></i>
</a>
{{/if}}
{{/if}}

26
app/assets/templates/photo_tpl.jst.hbs
View file

@ -1,22 +1,22 @@
<div class="media span4">
<div class="bd">
{{#if loggedIn}}
<div class="controls">
{{#unless authorIsCurrentUser}}
<a href="#" rel="nofollow" data-type="post" class="post_report" title="{{t "report.name"}}">
<div class="icons-report control_icon"/>
</a>
<a href="#" rel="nofollow" class="block_user" title="{{t "ignore"}}">
<div class="icons-ignoreuser control_icon"></div>
</a>
<a href="#" rel="nofollow" class="delete hide_post" title="{{t "stream.hide"}}">
<div class="icons-deletelabel delete control_icon"/>
<div class="control-icons">
{{#if authorIsCurrentUser}}
<a href="#" rel="nofollow" class="delete remove_post" title="{{t "delete"}}">
<i class="entypo trash"></i>
</a>
{{else}}
<a href="#" rel="nofollow" class="delete remove_post" title="{{t "delete"}}">
<div class="icons-deletelabel delete control_icon"/>
<a href="#" rel="nofollow" data-type="post" class="post_report" title="{{t "report.name"}}">
<i class="entypo warning"></i>
</a>
{{/unless}}
<a href="#" rel="nofollow" class="block_user" title="{{t "ignore"}}">
<i class="entypo block"></i>
</a>
<a href="#" rel="nofollow" class="delete hide_post" title="{{t "stream.hide"}}">
<i class="entypo cross"></i>
</a>
{{/if}}
</div>
{{/if}}

10
app/assets/templates/single-post-viewer/single-post-moderation_tpl.jst.hbs
View file

@ -2,18 +2,18 @@
{{#if loggedIn}}
{{#if authorIsCurrentUser}}
<a href="#" class="remove_post" title="{{t "delete"}}">
<i class="entypo gray cross"></i>
<i class="entypo trash"></i>
</a>
{{else}}
<a href="#" data-type="post" class="post_report" title="{{t "report.name"}}">
<i class="entypo gray">&#x21;</i>
<i class="entypo warning"></i>
</a>
<a href="#" data-type="post" class="block_user" title="{{t "ignore"}}">
<i class="entypo gray">&#128683;</i>
<i class="entypo block"></i>
</a>
<a href="#" data-type="post" class="hide_post" title="{{t "stream.hide"}}">
<i class="entypo gray cross"></i>
<i class="entypo cross"></i>
</a>
{{/if}}
{{/if}}
</div>
</div>

24
app/assets/templates/stream-element_tpl.jst.hbs
View file

@ -8,31 +8,31 @@
<div class="bd">
{{#if loggedIn}}
<div class="controls">
{{#unless authorIsCurrentUser}}
<div class="control-icons">
{{#if authorIsCurrentUser}}
<a href="#" rel="nofollow" class="delete remove_post" title="{{t "delete"}}">
<i class="entypo trash"></i>
</a>
{{else}}
<a href="#" rel="nofollow" data-type="post" class="post_report" title="{{t "report.name"}}">
<div class="icons-report control_icon"/>
<i class="entypo warning"></i>
</a>
<a href="#" rel="nofollow" class="block_user" title="{{t "ignore"}}">
<div class="icons-ignoreuser control_icon"></div>
<i class="entypo block"></i>
</a>
{{#if participation}}
<a href="#" rel="nofollow" class="destroy_participation" title="{{t "stream.disable_post_notifications"}}">
<div class="icons-destroy_participation control_icon"></div>
<i class="entypo bell"></i>
</a>
{{else}}
<a href="#" rel="nofollow" class="create_participation" title="{{t "stream.enable_post_notifications"}}">
<div class="icons-create_participation control_icon"></div>
<i class="entypo bell"></i>
</a>
{{/if}}
<a href="#" rel="nofollow" class="delete hide_post" title="{{t "stream.hide"}}">
<div class="icons-deletelabel delete control_icon"/>
<i class="entypo cross"></i>
</a>
{{else}}
<a href="#" rel="nofollow" class="delete remove_post" title="{{t "delete"}}">
<div class="icons-deletelabel delete control_icon"/>
</a>
{{/unless}}
{{/if}}
</div>
{{/if}}

31
app/views/conversations/_show.haml
View file

@ -3,21 +3,22 @@
-# the COPYRIGHT file.
.conversation_participants
- if conversation.participants.count > 1
= link_to(content_tag(:div, nil, :class => 'icons-deletelabel'),
conversation_visibility_path(conversation),
:method => 'delete',
:data => { :confirm => "#{t('.hide')}?" },
:title => t('.hide'),
:class => 'close_conversation')
- else
= link_to(content_tag(:div, nil, :class => 'icons-deletelabel'),
conversation_visibility_path(conversation),
:method => 'delete',
:data => { :confirm => "#{t('.delete')}?" },
:title => t('.delete'),
:class => 'close_conversation')
.control-icons.pull-right
- if conversation.participants.count > 1
= link_to(content_tag(:i, nil, :class => 'entypo cross'),
conversation_visibility_path(conversation),
:method => 'delete',
:data => { :confirm => "#{t('.hide')}?" },
:title => t('.hide'),
:class => 'hide_conversation')
- else
= link_to(content_tag(:i, nil, :class => 'entypo trash'),
conversation_visibility_path(conversation),
:method => 'delete',
:data => { :confirm => "#{t('.delete')}?" },
:title => t('.delete'),
:class => 'delete_conversation')
%h3{ :class => direction_for(conversation.subject) }
= conversation.subject

2
features/desktop/logged_out_browsing.feature
View file

@ -12,7 +12,7 @@ Feature: Browsing Diaspora as a logged out user
Scenario: Visiting a profile page
When I am on "bob@bob.bob"'s page
Then I should see "public stuff" within "body"
And page should not have ".media .controls"
And page should not have ".media .control-icons"
Scenario: Visiting a post show page
When I view "bob@bob.bob"'s first post

4
features/step_definitions/custom_web_steps.rb
View file

@ -89,7 +89,7 @@ end
When /^I prepare the deletion of the first post$/ do
within(find('.stream .stream_element')) do
ctrl = find('.controls')
ctrl = find('.control-icons')
ctrl.hover
ctrl.find('.remove_post').click
end
@ -102,7 +102,7 @@ end
When /^I click to delete the first comment$/ do
within("div.comment", match: :first) do
find(".controls").hover
find(".control-icons").hover
find(".comment_delete", visible: false).click # TODO: hax to check what's failing on Travis
end
end