Improve the management of the contacts visibility settings in an aspect
This commit is contained in:
parent
3251fce3d6
commit
3df0fdc09b
8 changed files with 208 additions and 222 deletions
|
|
@ -40,6 +40,7 @@
|
|||
* Collapse aspect list and tag followings list when switching to other views [#4462](https://github.com/diaspora/diaspora/pull/4462)
|
||||
* Highlight current stream in left sidebar [#4445](https://github.com/diaspora/diaspora/pull/4445)
|
||||
* Added ignore user icon [#4417](https://github.com/diaspora/diaspora/pull/4417)
|
||||
* Improve the management of the contacts visibility settings in an aspect [#4567](https://github.com/diaspora/diaspora/pull/4567)
|
||||
|
||||
|
||||
# 0.2.0.0
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@
|
|||
@import 'help'
|
||||
@import 'profile'
|
||||
@import 'publisher'
|
||||
@import 'facebox'
|
||||
|
||||
/* ====== media ====== */
|
||||
.media
|
||||
|
|
@ -624,9 +625,6 @@ input[type="search"]
|
|||
:-webkit-appearance textfield
|
||||
:-moz-appearance textfield
|
||||
|
||||
.facebox_content
|
||||
:display none
|
||||
|
||||
#photo_edit_options
|
||||
:display none
|
||||
|
||||
|
|
@ -740,125 +738,6 @@ ul#request_result
|
|||
:bottom 2.5em
|
||||
:padding 0
|
||||
|
||||
.contact_list_controls
|
||||
:height 30px
|
||||
:margin
|
||||
:bottom 5px
|
||||
:vertical-align middle
|
||||
:position relative
|
||||
|
||||
#contact_list_search
|
||||
:width 200px
|
||||
:margin
|
||||
:top 0
|
||||
:float right
|
||||
|
||||
.contact_list,
|
||||
.aspect_list
|
||||
@include border-radius(3px)
|
||||
|
||||
:height 300px
|
||||
:max-height 300px
|
||||
|
||||
:overflow-y auto
|
||||
:overflow-x hidden
|
||||
|
||||
:border 1px solid #bbb
|
||||
|
||||
:background
|
||||
:color rgb(252,252,252)
|
||||
|
||||
.avatar
|
||||
:float left
|
||||
:height 50px
|
||||
:width 50px
|
||||
:margin
|
||||
:right 10px !important
|
||||
|
||||
.button.share
|
||||
:padding
|
||||
:right 20px
|
||||
.right
|
||||
:right 8px
|
||||
:top 3px
|
||||
|
||||
.icons-monotone_plus_add_round,
|
||||
.icons-monotone_check_yes
|
||||
:height 20px
|
||||
:width 20px
|
||||
|
||||
> .contacts
|
||||
:margin 0
|
||||
:padding 5px
|
||||
:right 0
|
||||
|
||||
> .contact
|
||||
@include border-radius(3px)
|
||||
@include box-shadow(0, 1px, 5px, #ccc)
|
||||
:background
|
||||
:color #fff
|
||||
:float left
|
||||
:overflow-x hidden
|
||||
:overflow-y hidden
|
||||
|
||||
:position relative
|
||||
:display inline-block
|
||||
|
||||
&.hidden
|
||||
:display none
|
||||
|
||||
:height 50px
|
||||
:width 170px
|
||||
|
||||
:margin
|
||||
:bottom 5px
|
||||
:right 5px
|
||||
|
||||
:padding 5px
|
||||
:border 1px solid $border-dark-grey
|
||||
|
||||
> .name
|
||||
:white-space nowrap
|
||||
|
||||
&.remote_friend
|
||||
:width 285px
|
||||
|
||||
a.button
|
||||
@include box-shadow(0,0,0)
|
||||
|
||||
:border
|
||||
:bottom none
|
||||
|
||||
:min-width auto
|
||||
:float right
|
||||
:padding 2px 4px
|
||||
:margin-top 5px
|
||||
|
||||
&.added
|
||||
@include linear-gradient(rgb(158,255,153), rgb(92,199,86))
|
||||
|
||||
&.added.remove
|
||||
@include linear-gradient(rgb(255,153,153), rgb(199,86,86))
|
||||
|
||||
&:active
|
||||
@include linear-gradient(rgb(199,119,119), rgb(130,55,55))
|
||||
|
||||
.aspect_list
|
||||
:height 300px
|
||||
:max-height 300px
|
||||
|
||||
.name
|
||||
:left 1em
|
||||
|
||||
ul
|
||||
> li
|
||||
:padding 1em
|
||||
:height 1em
|
||||
|
||||
.right
|
||||
:top 2px
|
||||
:right 1em
|
||||
|
||||
#signup_field
|
||||
:margin
|
||||
:top -200px
|
||||
|
|
@ -1097,63 +976,6 @@ ul#press_logos
|
|||
#inner_account_delete
|
||||
:width 810px
|
||||
|
||||
#aspect_edit_pane
|
||||
:width 810px
|
||||
.person_tiles
|
||||
.tile
|
||||
@include border-radius(2px)
|
||||
|
||||
:padding 6px
|
||||
:left 65px
|
||||
:margin 3px
|
||||
:left 0
|
||||
:display inline-block
|
||||
:width 126px
|
||||
:height 50px
|
||||
|
||||
:border 1px solid #eee
|
||||
|
||||
:position relative
|
||||
|
||||
img
|
||||
:position absolute
|
||||
:left 6px
|
||||
|
||||
&.larger
|
||||
:width 650px
|
||||
|
||||
#facebox_header
|
||||
:position relative
|
||||
:padding
|
||||
:bottom 10px
|
||||
|
||||
.right
|
||||
:z-index 3
|
||||
:right 1em
|
||||
:top 14px
|
||||
:color #ccc
|
||||
|
||||
img
|
||||
:vertical
|
||||
:align top
|
||||
:position relative
|
||||
:top 0px
|
||||
|
||||
h3,
|
||||
h4
|
||||
.description
|
||||
:margin
|
||||
:top 0px
|
||||
|
||||
.tiny_text
|
||||
:font
|
||||
:size 11px
|
||||
:weight normal
|
||||
|
||||
#aspect_edit_controls
|
||||
:margin
|
||||
:top 8px
|
||||
|
||||
.icons-monotone_email_letter_round
|
||||
:height 128px
|
||||
:width 128px
|
||||
|
|
@ -1468,9 +1290,6 @@ ul#press_logos
|
|||
:font
|
||||
:size 12px
|
||||
|
||||
#contact_visibility_padlock:hover
|
||||
@include opacity(0.7)
|
||||
|
||||
.side_stream
|
||||
.stream_element
|
||||
:padding 10px 0
|
||||
|
|
@ -1676,10 +1495,6 @@ h1.tag
|
|||
&:active
|
||||
@include linear-gradient(darken(#D9FFA9,20%),darken(#B9E68A,20%))
|
||||
|
||||
#facebox
|
||||
input[type='text'], input.text
|
||||
:width 98%
|
||||
|
||||
#client-application-image
|
||||
:max-width 100%
|
||||
|
||||
|
|
@ -1984,27 +1799,6 @@ a.toggle_selector
|
|||
:text-align center
|
||||
:margin 5px 0
|
||||
|
||||
.bottom_submit_section
|
||||
:overflow hidden
|
||||
:display block
|
||||
:position relative
|
||||
:text-align right
|
||||
|
||||
form
|
||||
:float left
|
||||
:display inline-block
|
||||
.creation
|
||||
:float right
|
||||
|
||||
.icons-padlock-open,
|
||||
.icons-padlock-closed
|
||||
:float left
|
||||
:height 16px
|
||||
:width 16px
|
||||
:margin
|
||||
:left 4px
|
||||
:top 2px
|
||||
|
||||
#no_contacts
|
||||
:text-align center
|
||||
:padding 10px
|
||||
|
|
|
|||
184
app/assets/stylesheets/facebox.css.scss
Normal file
184
app/assets/stylesheets/facebox.css.scss
Normal file
|
|
@ -0,0 +1,184 @@
|
|||
.facebox_content { display: none; }
|
||||
|
||||
#facebox {
|
||||
input[type='text'], input.text { width: 98%; }
|
||||
}
|
||||
|
||||
#facebox_header {
|
||||
position: relative;
|
||||
padding-bottom: 10px;
|
||||
|
||||
.right {
|
||||
z-index: 3;
|
||||
right: 1em;
|
||||
top: 14px;
|
||||
color: #ccc;
|
||||
|
||||
img {
|
||||
vertical-align: top;
|
||||
position: relative;
|
||||
top: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
h3, h4 {
|
||||
.description { margin-top: 0px; }
|
||||
}
|
||||
|
||||
.tiny_text {
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
#aspect_edit_controls { margin-top: 8px; }
|
||||
/* -- Used in aspects/edit.haml and in contacts/sharing.haml -- */
|
||||
#aspect_edit_pane {
|
||||
width: 772px;
|
||||
|
||||
.contact_list_controls {
|
||||
height: 30px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
#contact_list_search {
|
||||
width: 200px;
|
||||
margin-top: 0px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.contact_list,
|
||||
.aspect_list {
|
||||
@include border-radius(3px);
|
||||
height: 300px;
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
border: 1px solid #bbb;
|
||||
background-color: rgb(252,252,252);
|
||||
|
||||
.avatar {
|
||||
float: left;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
margin-right: 10px !important;
|
||||
}
|
||||
|
||||
.button.share {
|
||||
padding-right: 20px;
|
||||
.right {
|
||||
right: 8px;
|
||||
top: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
.icons-monotone_plus_add_round,
|
||||
.icons-monotone_check_yes {
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
& > .contacts {
|
||||
margin: 0px;
|
||||
padding: 5px;
|
||||
padding-right: 0px;
|
||||
|
||||
& > .contact {
|
||||
@include border-radius(3px);
|
||||
@include box-shadow(0, 1px, 5px, #ccc);
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
float: left;
|
||||
height: 50px;
|
||||
width: 170px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: hidden;
|
||||
margin-bottom: 5px;
|
||||
margin-right: 5px;
|
||||
padding: 5px;
|
||||
background-color: #fff;
|
||||
border: 1px solid $border-dark-grey;
|
||||
|
||||
&.hidden { display: none; }
|
||||
& > .name { white-space: nowrap; }
|
||||
&.remote_friend { width: 285px; }
|
||||
|
||||
a.button {
|
||||
@include box-shadow(0,0,0);
|
||||
border-bottom: none;
|
||||
min-width: auto;
|
||||
float: right;
|
||||
padding: 2px 4px;
|
||||
margin-top: 5px;
|
||||
|
||||
&.added { @include linear-gradient(rgb(158,255,153), rgb(92,199,86)); }
|
||||
&.added.remove {
|
||||
@include linear-gradient(rgb(255,153,153), rgb(199,86,86));
|
||||
|
||||
&:active { @include linear-gradient(rgb(199,119,119), rgb(130,55,55)); }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.aspect_list {
|
||||
height: 300px;
|
||||
max-height: 300px;
|
||||
|
||||
.name { left: 1em; }
|
||||
|
||||
ul > li {
|
||||
padding: 1em;
|
||||
height: 1em;
|
||||
|
||||
.right {
|
||||
top: 2px;
|
||||
right: 1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.person_tiles .tile {
|
||||
@include border-radius(2px);
|
||||
padding: 6px;
|
||||
padding-left: 65px;
|
||||
margin: 3px;
|
||||
margin-left: 0px;
|
||||
display: inline-block;
|
||||
width: 126px;
|
||||
height: 50px;
|
||||
border: 1px solid #eee;
|
||||
position: relative;
|
||||
|
||||
img {
|
||||
position: absolute;
|
||||
left: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
&.larger { width: 650px; }
|
||||
|
||||
.bottom_submit_section {
|
||||
margin-top: 12px;
|
||||
|
||||
form {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.creation {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.contact_visibility_link {
|
||||
margin-left: 5px;
|
||||
|
||||
#contact_visibility_padlock {
|
||||
display: inline-block;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
margin-left: 4px;
|
||||
margin-bottom: -2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -40,4 +40,17 @@ module AspectsHelper
|
|||
remove_from_aspect_button(membership.id, aspect.id, person.id)
|
||||
end
|
||||
end
|
||||
|
||||
def aspect_visibility_link(aspect);
|
||||
if aspect.contacts_visible?
|
||||
icon = 'icons-padlock-open';
|
||||
title = t('.aspect_list_is_visible');
|
||||
else
|
||||
icon = 'icons-padlock-closed';
|
||||
title = t('.aspect_list_is_not_visible');
|
||||
end
|
||||
padlock = content_tag(:div, nil, id: "contact_visibility_padlock", class: icon);
|
||||
link_to "#{t('.visibility')} #{padlock}".html_safe, aspect_toggle_contact_visibility_path(@aspect),
|
||||
class: 'contact_visibility_link button', title: title, method: :put, remote: true;
|
||||
end
|
||||
end
|
||||
|
|
|
|||
|
|
@ -17,16 +17,8 @@
|
|||
- if @contacts.count > 0
|
||||
= render 'shared/contact_list', :aspect => @aspect, :contacts => @contacts
|
||||
|
||||
%br
|
||||
.bottom_submit_section
|
||||
= button_to t('delete'), @aspect, :method => "delete", :data => { :confirm => t('.confirm_remove_aspect') }, :class => 'button delete'
|
||||
- if @aspect.contacts_visible
|
||||
= link_to content_tag(:div, nil, :class => 'icons-padlock-open', :id => "contact_visibility_padlock", :title => t('.aspect_list_is_visible')),
|
||||
aspect_toggle_contact_visibility_path(@aspect), :class => 'contact_visibility_link', :method => :put, :remote => true
|
||||
|
||||
- else
|
||||
= link_to content_tag(:div, nil, :class => 'icons-padlock-closed', :id => "contact_visibility_padlock", :title => t('.aspect_list_is_not_visible')),
|
||||
aspect_toggle_contact_visibility_path(@aspect), :class => 'contact_visibility_link', :method => :put, :remote => true
|
||||
|
||||
= aspect_visibility_link(@aspect)
|
||||
= submit_tag t('.done'), :class => 'button creation', :rel => 'close'
|
||||
|
||||
|
|
|
|||
|
|
@ -1,14 +1,15 @@
|
|||
$(document).ready(function() {
|
||||
|
||||
var padlockImg = $("#contact_visibility_padlock");
|
||||
var linkText = $(".contact_visibility_link");
|
||||
|
||||
if (padlockImg.hasClass('icons-padlock-open')) {
|
||||
padlockImg.removeClass('icons-padlock-open');
|
||||
padlockImg.addClass('icons-padlock-closed');
|
||||
padlockImg.attr('title', "<%= t('aspects.edit.aspect_list_is_not_visible') %>");
|
||||
linkText.attr('title', "<%= t('aspects.edit.aspect_list_is_not_visible') %>");
|
||||
} else {
|
||||
padlockImg.removeClass('icons-padlock-closed');
|
||||
padlockImg.addClass('icons-padlock-open');
|
||||
padlockImg.attr('title', "<%= t('aspects.edit..aspect_list_is_visible') %>");
|
||||
linkText.attr('title', "<%= t('aspects.edit.aspect_list_is_visible') %>");
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -4,8 +4,8 @@
|
|||
|
||||
|
||||
.contact_list_controls
|
||||
= search_field_tag :contact_search, "", :id => "contact_list_search", :class => 'contact_list_search', :results => 5, :placeholder => t('.all_contacts')
|
||||
= t('contacts', :count =>@aspect_contacts_count)
|
||||
= search_field_tag :contact_search, "", id: "contact_list_search", class: 'contact_list_search', results: 5, placeholder: t('.all_contacts')
|
||||
= t('contacts', count: @aspect_contacts_count)
|
||||
|
||||
.contact_list.searchable
|
||||
%ul.contacts
|
||||
|
|
|
|||
|
|
@ -159,10 +159,11 @@ en:
|
|||
remove_aspect: "Delete this aspect"
|
||||
confirm_remove_aspect: "Are you sure you want to delete this aspect?"
|
||||
add_existing: "Add an existing contact"
|
||||
visibility: "Visibility"
|
||||
done: "Done"
|
||||
rename: "rename"
|
||||
aspect_list_is_visible: "aspect list is visible to others in aspect"
|
||||
aspect_list_is_not_visible: "aspect list is hidden to others in aspect"
|
||||
aspect_list_is_visible: "Contacts in this aspect are able to see each other."
|
||||
aspect_list_is_not_visible: "Contacts in this aspect are not able to see each other."
|
||||
update: "update"
|
||||
updating: "updating"
|
||||
aspect_contacts:
|
||||
|
|
|
|||
Loading…
Reference in a new issue