mirror of https://github.com/friendica/friendica
initial work for contact page
This commit is contained in:
rabuzarus
parent
09daf2de26
commit
b59c0648bc
|
|
@ -1414,6 +1414,19 @@ ul.dropdown-menu li:hover {
|
|||
font-size: 11px;
|
||||
color: #bebebe;
|
||||
}
|
||||
.media-list > li {
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid rgba(238, 238, 238, $contentbg_transp);
|
||||
position: relative;
|
||||
/* border-left: 3px solid rgba(255,255,255,$contentbg_transp);*/
|
||||
border-left: 3px solid rgba(255,255,255,0);
|
||||
font-size: 12px;
|
||||
}
|
||||
.media-list > li:hover,
|
||||
.media-list > li.selected {
|
||||
border-left: 3px solid $link_color;
|
||||
background-color: rgba(247, 247, 247, $contentbg_transp);
|
||||
}
|
||||
|
||||
/* Forms */
|
||||
.form-control {
|
||||
|
|
@ -1462,7 +1475,9 @@ ul.dropdown-menu li:hover {
|
|||
/* PAGES */
|
||||
|
||||
/* Profile-page */
|
||||
#profile-page, .photos-content-wrapper, .settings-content-wrapper {
|
||||
#profile-page, .photos-content-wrapper, .settings-content-wrapper,
|
||||
.contacts-content-wrapper, .suggest-content-wrapper, .common-content-wrapper,
|
||||
.allfriends-content-wrapper, .match-content-wrapper {
|
||||
padding: 15px;
|
||||
padding-bottom: 20px;
|
||||
margin-bottom: 20px;
|
||||
|
|
@ -1489,6 +1504,36 @@ ul.dropdown-menu li:hover {
|
|||
float: left;
|
||||
}
|
||||
|
||||
/* contacts page */
|
||||
ul.viewcontact_wrapper {
|
||||
margin-left: -15px;
|
||||
margin-right: -15px;
|
||||
}
|
||||
ul.viewcontact_wrapper > li {
|
||||
padding-left: 15px;
|
||||
}
|
||||
.contact-wrapper {
|
||||
/* padding: 10px;
|
||||
border-bottom: 1px solid rgba(238, 238, 238, $contentbg_transp);;
|
||||
position: relative;*/
|
||||
/*border-left: 3px solid white;*/
|
||||
}
|
||||
.contact-wrapper.media {
|
||||
overflow: visible;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
.contact-entry-desc {
|
||||
color: #555;
|
||||
}
|
||||
.contact-entry-checkbox {
|
||||
margin-top: -20px;
|
||||
}
|
||||
.contact-wrapper .media-body .contact-entry-name h4.media-heading {
|
||||
font-weight: bold;
|
||||
color: #777;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Overwriting for transparency and other colors
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -0,0 +1,59 @@
|
|||
|
||||
<div class="contact-wrapper media" id="contact-entry-wrapper-{{$id}}" >
|
||||
|
||||
<div class="contact-photo-wrapper dropdown pull-left" >
|
||||
<div class="contact-photo mframe" id="contact-entry-photo-{{$contact.id}}" >
|
||||
|
||||
<a class="dropdown-toggle" id="contact-photo-menu-{{$contact.id}}" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" >
|
||||
<div class="contact-photo-image-wrapper">
|
||||
<img class="contact-photo media-object" src="{{$contact.thumb}}" {{$contact.sparkle}} alt="{{$contact.name}}" />
|
||||
|
||||
{{* Overlay background on hover the avatar picture *}}
|
||||
<div class="contact-photo-overlay">
|
||||
<span class="contact-photo-overlay-content"><i class="fa fa-angle-down"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
{{if $contact.photo_menu}}
|
||||
<ul class="contact-photo-menu menu-popup dropdown-menu " id="contact-photo-menu-{{$contact.id}}" role="menu" aria-labelledby="contact-photo-menu-{{$contact.id}}">
|
||||
{{foreach $contact.photo_menu as $c}}
|
||||
{{if $c.2}}
|
||||
<li role="menuitem"><a target="redir" href="{{$c.1}}">{{$c.0}}</a></li>
|
||||
{{else}}
|
||||
<li role="menuitem"><a href="{{$c.1}}">{{$c.0}}</a></li>
|
||||
{{/if}}
|
||||
{{/foreach}}
|
||||
</ul>
|
||||
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="media-body">
|
||||
<div class="contact-entry-desc">
|
||||
<div class="contact-entry-name" id="contact-entry-name-{{$contact.id}}" >
|
||||
<h4 class="media-heading">{{$contact.name}}
|
||||
{{if $contact.account_type}} <small class="contact-entry-details" id="contact-entry-accounttype-{{$contact.id}}">({{$contact.account_type}})</small>{{/if}}
|
||||
</h4>
|
||||
</div>
|
||||
{{if $contact.alt_text}}<div class="contact-entry-details" id="contact-entry-rel-{{$contact.id}}" >{{$contact.alt_text}}</div>{{/if}}
|
||||
{{if $contact.itemurl}}<div class="contact-entry-details" id="contact-entry-url-{{$contact.id}}" >{{$contact.itemurl}}</div>{{/if}}
|
||||
{{if $contact.tags}}<div class="contact-entry-details" id="contact-entry-tags-{{$contact.id}}" >{{$contact.tags}}</div>{{/if}}
|
||||
{{if $contact.details}}<div class="contact-entry-details" id="contact-entry-details-{{$contact.id}}" >{{$contact.details}}</div>{{/if}}
|
||||
{{if $contact.network}}<div class="contact-entry-details" id="contact-entry-network-{{$contact.id}}" >{{$contact.network}}</div>{{/if}}
|
||||
</div>
|
||||
|
||||
{{* if !$no_contacts_checkbox *}}
|
||||
{{if $multiselect}}
|
||||
<div class="checkbox contact-entry-checkbox pull-right">
|
||||
<input id="checkbox-{{$contact.id}}" type="checkbox" class="contact-select pull-right" name="contact_batch[]" value="{{$contact.id}}">
|
||||
<label for="checkbox-{{$contact.id}}"></label>
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -0,0 +1,98 @@
|
|||
|
||||
<div id="contacts" class="standard-page">
|
||||
|
||||
{{$tabs}}
|
||||
|
||||
<h2 class="headding">{{$header}} {{if $total}} ({{$total}}) {{/if}}</h2>
|
||||
|
||||
{{if $finding}}<h4>{{$finding}}</h4>{{/if}}
|
||||
|
||||
<div id="contacts-search-wrapper">
|
||||
<form id="contacts-search-form" class="navbar-form" action="{{$cmd}}" method="get" >
|
||||
<label for="contacts-search" class="contacts-search-desc">{{$desc}}</label><br/>
|
||||
<div class="input-group">
|
||||
<input type="text" name="search" id="contacts-search" class="search-input form-control" onfocus="this.select();" value="{{$search|escape:'html'}}" />
|
||||
<div class="input-group-btn">
|
||||
<button class="btn btn-default" type="submit" name="submit" id="contacts-search-submit" value="{{$submit|escape:'html'}}"><i class="fa fa-search"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
<div id="contacts-search-end"></div>
|
||||
|
||||
<form action="{{$baseurl}}/contacts/batch/" method="POST">
|
||||
<ul class="nav nav-pills preferences">
|
||||
<li class="dropdown pull-right">
|
||||
<a class="btn btn-link dropdown-toggle" type="button" id="BatchActionDropdownMenuTools" data-toggle="dropdown" aria-expanded="true">
|
||||
<i class="fa fa-angle-down"></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="BatchActionDropdownMenuTools">
|
||||
{{foreach $batch_actions as $n=>$l}}
|
||||
<li role="presentation">
|
||||
<input class="batch-action no-input fakelist" name="{{$n}}" value="{{$l|escape:'html'}}" type="submit">
|
||||
</li>
|
||||
{{/foreach}}
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clear">
|
||||
|
||||
<ul id="viewcontact_wrapper" class="viewcontact_wrapper media-list">
|
||||
{{foreach $contacts as $contact}}
|
||||
<li>{{include file="contact_template.tpl"}}</li>
|
||||
{{/foreach}}
|
||||
</ul>
|
||||
<div id="contact-edit-end"></div>
|
||||
</form>
|
||||
|
||||
{{$paginate}}
|
||||
</div>
|
||||
|
||||
<div class="modal" id="PokeModal" tabindex="-1" role="dialog" aria-labelledby="PokeModal" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
</div> <!-- /.modal-content -->
|
||||
</div> <!-- /.modal-dialog -->
|
||||
</div> <!-- /.modal -->
|
||||
|
||||
<div class="modal" id="MailModal" tabindex="-1" role="dialog" aria-labelledby="MailModal" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
</div> <!-- /.modal-content -->
|
||||
</div> <!-- /.modal-dialog -->
|
||||
</div> <!-- /.modal -->
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
// replace data target for poke & private Message to make Modal Dialog possible
|
||||
$('li a[href^="{{$baseurl}}/poke/?f"]').attr('data-target','#PokeModal').attr('data-toggle', 'modal');
|
||||
$('li a[href^="{{$baseurl}}/message/new"]').attr('data-target','#MailModal').attr('data-toggle', 'modal');
|
||||
|
||||
// javascript dialog to batch actions
|
||||
$(".batch-action").click(function(e){
|
||||
if (confirm($(this).attr('value')+" ?")) {
|
||||
return true;
|
||||
} else {
|
||||
e.preventDefault();
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
// add javascript confirm dialog to "drop" links. Plain html url have "?confirm=1" to show confirmation form, we need to remove it
|
||||
$(".drop").each(function() {
|
||||
$(this).attr('href', $(this).attr('href').replace("confirm=1","") );
|
||||
$(this).click(function(e){
|
||||
if (confirm("{{$contact_drop_confirm}}")) {
|
||||
return true;
|
||||
} else {
|
||||
e.preventDefault();
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
|
||||
{{include file="section_title.tpl"}}
|
||||
|
||||
{{$tab_str}}
|
||||
|
||||
<ul id="viewcontact_wrapper{{if $id}}-{{$id}}{{/if}}" class="viewcontact_wrapper media-list">
|
||||
{{foreach $contacts as $contact}}
|
||||
<li>{{include file="contact_template.tpl"}}</li>
|
||||
{{/foreach}}
|
||||
</ul>
|
||||
<div class="clear"></div>
|
||||
<div id="view-contact-end"></div>
|
||||
|
||||
{{$paginate}}
|
||||
Loading…
Reference in New Issue