bitPickups/friendica_2020-09-1_sharedHosting
1
0
Fork 0
Code Pull requests Activity

Merge pull request #1975 from rabuzarus/template_rework

Browse source 
Template rework for contact related pages
This commit is contained in:
Tobias Diekershoff 2015-10-27 08:59:03 +01:00
commit 4079084492
30 changed files with 463 additions and 269 deletions
Download patch file Download diff file Expand all files Collapse all files

25
view/theme/duepuntozero/style.css
View file

@ -876,8 +876,14 @@ input#dfrn-url {
.contact-entry-wrapper {
float: left;
width: 120px;
height: 120px;
min-width: 363px;
height: 90px;
padding-right: 10px;
margin: 0 10px 10px 0px;
}
.contact-entry-wrapper .contact-entry-photo-wrapper {
float: left;
margin-right: 10px;
}
#contacts-search-end {
margin-bottom: 10px;
@ -891,15 +897,22 @@ input#dfrn-url {
.contact-entry-photo img {
border: none;
}
.contact-entry-photo a img {
width: 80px;
height: 80px;
}
.contact-entry-photo-end {
clear: both;
}
.contact-entry-name {
float: left;
margin-left: 0px;
margin-right: 10px;
width: 120px;
font-weight: bold;
}
.contact-entry-details {
font-size: 13px;
color: #999999;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.contact-entry-edit-links {
margin-top: 6px;

20
view/theme/frost-mobile/style.css
View file

@ -1110,8 +1110,13 @@ input#dfrn-url {
height: 120px;*/
padding-left: 15px;
padding-right: 15px;
width: 95px;
height: 200px;
max-width: 262px;
height: 90px;
margin: 0 10px 10px 0px;
}
.contact-entry-wrapper .contact-entry-photo-wrapper {
float: left;
margin-right: 10px;
}
#contacts-search-end {
margin-bottom: 10px;
@ -1124,12 +1129,16 @@ input#dfrn-url {
.contact-entry-photo img {
border: none;
width: 80px;
height: 80px;
}
.contact-entry-photo-end {
clear: both;
}
.contact-entry-desc {
overflow: hidden;
}
.contact-entry-name {
float: left;
margin-left: 0px;
margin-right: 10px;
padding-bottom: 5px;
@ -1141,6 +1150,9 @@ input#dfrn-url {
font-style: italic;
font-size: 10px;
font-weight: 500;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.contact-entry-network {
font-size: 10px;
@ -2135,7 +2147,7 @@ input#profile-jot-email {
border: 1px solid #AAA;
background: #FFFFFF;
position: absolute;
left: -30px; top: 80px;
/*left: -30px;*/ top: 80px;
display: none;
z-index: 101;
-moz-box-shadow: 3px 3px 5px #555;

12
view/theme/frost-mobile/templates/contact_template.tpl
View file

@ -28,10 +28,14 @@
</div>
</div>
<div class="contact-entry-photo-end" ></div>
<div class="contact-entry-name" id="contact-entry-name-{{$contact.id}}" >{{$contact.name}}</div><br />
{{if $contact.alt_text}}<div class="contact-entry-details" id="contact-entry-rel-{{$contact.id}}" >{{$contact.alt_text}}</div>{{/if}}
<div class="contact-entry-network" id="contact-entry-network-{{$contact.id}}" >{{$contact.network}}</div>
<div class="contact-entry-desc">
<div class="contact-entry-name" id="contact-entry-name-{{$contact.id}}" >{{$contact.name}}</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.network}}<div class="contact-entry-network" id="contact-entry-network-{{$contact.id}}" >{{$contact.network}}</div>{{/if}}
{{if $contact.details}}<div class="contact-entry-details" id="contact-entry-details-{{$contact.id}}" >{{$contact.details}}</div>{{/if}}
</div>
<div class="contact-entry-end" ></div>
</div>

3
view/theme/frost-mobile/templates/contacts-template.tpl
View file

@ -15,11 +15,10 @@
{{$tabs}}
<div id="contacts-display-wrapper">
{{foreach $contacts as $contact}}
{{include file="contact_template.tpl"}}
{{/foreach}}
</div>
<div id="contact-edit-end"></div>
{{$paginate}}

17
view/theme/frost-mobile/templates/suggest_friends.tpl
View file

@ -1,17 +0,0 @@
<div class="profile-match-wrapper">
<div class="profile-match-photo">
<a href="{{$url}}">
<img src="{{$photo}}" alt="{{$name}}" width="80" height="80" title="{{$name}} [{{$url}}]" onError="this.src='../../../images/person-48.jpg';" />
</a>
</div>
<div class="profile-match-break"></div>
<div class="profile-match-name">
<a href="{{$url}}" title="{{$name}}">{{$name}}</a>
</div>
<div class="profile-match-end"></div>
{{if $connlnk}}
<div class="profile-match-connect"><a href="{{$connlnk}}" title="{{$conntxt}}">{{$conntxt}}</a></div>
{{/if}}
<a href="{{$ignlnk}}" title="{{$ignore}}" class="icon drophide profile-match-ignore" {{*onmouseout="imgdull(this);" onmouseover="imgbright(this);" *}}onclick="return confirmDelete();" ></a>
</div>

28
view/theme/frost/style.css
View file

@ -1074,12 +1074,14 @@ input#dfrn-url {
.contact-entry-wrapper {
float: left;
/* width: 120px;
height: 120px;*/
padding-left: 8px;
padding-right: 8px;
width: 95px;
height: 170px;
width: 262px;
height: 90px;
padding-right: 10px;
margin: 0 10px 10px 0px;
}
.contact-entry-wrapper .contact-entry-photo-wrapper {
float: left;
margin-right: 10px;
}
#contacts-search-end {
margin-bottom: 10px;
@ -1093,15 +1095,22 @@ input#dfrn-url {
.contact-entry-photo img {
border: none;
}
.contact-entry-photo a img {
width: 80px;
height: 80px;
}
.contact-entry-photo-end {
clear: both;
}
.contact-entry-desc {
overflow: hidden;
}
.contact-entry-name {
float: left;
/*float: left;*/
margin-left: 0px;
margin-right: 10px;
padding-bottom: 5px;
width: 120px;
/*width: 120px;*/
font-weight: 600;
overflow: hidden;
}
@ -1109,6 +1118,9 @@ input#dfrn-url {
font-style: italic;
font-size: 10px;
font-weight: 500;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.contact-entry-network {
font-size: 10px;

20
view/theme/frost/templates/contact_template.tpl
View file

@ -10,8 +10,8 @@
{{if $contact.photo_menu}}
<span onclick="openClose('contact-photo-menu-{{$contact.id}}');" class="fakelink contact-photo-menu-button" id="contact-photo-menu-button-{{$contact.id}}">menu</span>
<div class="contact-photo-menu" id="contact-photo-menu-{{$contact.id}}">
<ul>
<div class="contact-photo-menu" id="contact-photo-menu-{{$contact.id}}">
<ul>
{{foreach $contact.photo_menu as $c}}
{{if $c.2}}
<li><a target="redir" href="{{$c.1}}">{{$c.0}}</a></li>
@ -19,16 +19,20 @@
<li><a href="{{$c.1}}">{{$c.0}}</a></li>
{{/if}}
{{/foreach}}
</ul>
</div>
</ul>
</div>
{{/if}}
</div>
</div>
<div class="contact-entry-photo-end" ></div>
<div class="contact-entry-name" id="contact-entry-name-{{$contact.id}}" >{{$contact.name}}</div><br />
{{if $contact.alt_text}}<div class="contact-entry-details" id="contact-entry-rel-{{$contact.id}}" >{{$contact.alt_text}}</div>{{/if}}
<div class="contact-entry-network" id="contact-entry-network-{{$contact.id}}" >{{$contact.network}}</div>
<div class="contact-entry-desc">
<div class="contact-entry-name" id="contact-entry-name-{{$contact.id}}" >{{$contact.name}}</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.network}}<div class="contact-entry-network" id="contact-entry-network-{{$contact.id}}" >{{$contact.network}}</div>{{/if}}
{{if $contact.details}}<div class="contact-entry-details" id="contact-entry-details-{{$contact.id}}" >{{$contact.details}}</div>{{/if}}
</div>
<div class="contact-entry-end" ></div>
</div>

17
view/theme/frost/templates/suggest_friends.tpl
View file

@ -1,17 +0,0 @@
<div class="profile-match-wrapper">
<div class="profile-match-photo">
<a href="{{$url}}">
<img src="{{$photo}}" alt="{{$name}}" width="80" height="80" title="{{$name}} [{{$url}}]" onError="this.src='../../../images/person-48.jpg';" />
</a>
</div>
<div class="profile-match-break"></div>
<div class="profile-match-name">
<a href="{{$url}}" title="{{$name}}">{{$name}}</a>
</div>
<div class="profile-match-end"></div>
{{if $connlnk}}
<div class="profile-match-connect"><a href="{{$connlnk}}" title="{{$conntxt}}">{{$conntxt}}</a></div>
{{/if}}
<a href="{{$ignlnk}}" title="{{$ignore}}" class="icon drophide profile-match-ignore" {{*onmouseout="imgdull(this);" onmouseover="imgbright(this);" *}}onclick="return confirmDelete();" ></a>
</div>

25
view/theme/quattro/dark/style.css
View file

@ -1543,6 +1543,31 @@ span[id^="showmore-wrap"] {
left: 0px;
top: 63px;
}
.contact-wrapper .drop {
background-image: url('../../../images/icons/22/delete.png');
display: block;
width: 22px;
height: 22px;
position: relative;
top: 10px;
left: -10px;
z-index: 99;
}
.contact-wrapper .drophide {
background-image: url('../../../images/icons/22/delete.png');
display: block;
width: 22px;
height: 22px;
opacity: 0.3;
position: relative;
top: 10px;
left: -10px;
z-index: 99;
}
.contact-wrapper .contact-entry-connect {
padding-top: 5px;
font-weight: bold;
}
.directory-item {
float: left;
width: 200px;

25
view/theme/quattro/green/style.css
View file

@ -1543,6 +1543,31 @@ span[id^="showmore-wrap"] {
left: 0px;
top: 63px;
}
.contact-wrapper .drop {
background-image: url('../../../images/icons/22/delete.png');
display: block;
width: 22px;
height: 22px;
position: relative;
top: 10px;
left: -10px;
z-index: 99;
}
.contact-wrapper .drophide {
background-image: url('../../../images/icons/22/delete.png');
display: block;
width: 22px;
height: 22px;
opacity: 0.3;
position: relative;
top: 10px;
left: -10px;
z-index: 99;
}
.contact-wrapper .contact-entry-connect {
padding-top: 5px;
font-weight: bold;
}
.directory-item {
float: left;
width: 200px;

25
view/theme/quattro/lilac/style.css
View file

@ -1543,6 +1543,31 @@ span[id^="showmore-wrap"] {
left: 0px;
top: 63px;
}
.contact-wrapper .drop {
background-image: url('../../../images/icons/22/delete.png');
display: block;
width: 22px;
height: 22px;
position: relative;
top: 10px;
left: -10px;
z-index: 99;
}
.contact-wrapper .drophide {
background-image: url('../../../images/icons/22/delete.png');
display: block;
width: 22px;
height: 22px;
opacity: 0.3;
position: relative;
top: 10px;
left: -10px;
z-index: 99;
}
.contact-wrapper .contact-entry-connect {
padding-top: 5px;
font-weight: bold;
}
.directory-item {
float: left;
width: 200px;

21
view/theme/quattro/quattro.less
View file

@ -877,6 +877,27 @@ span[id^="showmore-wrap"] {
left: 0px;
top: 63px;
}
.drop {
background-image: url('../../../images/icons/22/delete.png');
display: block; width: 22px; height: 22px;
position: relative;
top: 10px;
left: -10px;
z-index: 99;
}
.drophide {
background-image: url('../../../images/icons/22/delete.png');
display: block; width: 22px; height: 22px;
opacity: 0.3;
position: relative;
top: 10px;
left: -10px;
z-index: 99;
}
.contact-entry-connect {
padding-top: 5px;
font-weight: bold;
}
}
.directory-item {
float: left;

12
view/theme/quattro/templates/contact_template.tpl
View file

@ -1,5 +1,6 @@
<div class="contact-wrapper" id="contact-entry-wrapper-{{$id}}" >
{{if $contact.ignlnk}}<a href="{{$contact.ignlnk}}" title="{{$contact.ignore}}" class="icon drophide profile-match-ignore" onmouseout="imgdull(this);" onmouseover="imgbright(this);" onclick="return confirmDelete();" ></a>{{/if}}
<div class="contact-photo-wrapper" >
<div class="contact-photo mframe" id="contact-entry-photo-{{$contact.id}}"
onmouseover="if (typeof t{{$contact.id}} != 'undefined') clearTimeout(t{{$contact.id}}); openMenu('contact-photo-menu-button-{{$contact.id}}')"
@ -7,7 +8,7 @@
<a href="{{$contact.url}}" title="{{$contact.img_hover}}" /><img src="{{$contact.thumb}}" {{$contact.sparkle}} alt="{{$contact.name}}" /></a>
{{if !$no_contacts_checkbox}}
{{if $multiselect}}
<input type="checkbox" class="contact-select" name="contact_batch[]" value="{{$contact.id}}">
{{/if}}
{{if $contact.photo_menu}}
@ -27,8 +28,13 @@
</div>
<div class="contact-name" id="contact-entry-name-{{$contact.id}}" >{{$contact.name}}</div>
{{if $contact.alt_text}}<div class="contact-details" id="contact-entry-rel-{{$contact.id}}" >{{$contact.alt_text}}</div>{{/if}}
<div class="contact-details" id="contact-entry-url-{{$contact.id}}" >{{$contact.itemurl}}</div>
<div class="contact-details" id="contact-entry-network-{{$contact.id}}" >{{$contact.network}}</div>
{{if $contact.itemurl}}<div class="contact-details" id="contact-entry-url-{{$contact.id}}" >{{$contact.itemurl}}</div>{{/if}}
{{if $contact.network}}<div class="contact-details" id="contact-entry-network-{{$contact.id}}" >{{$contact.network}}</div>{{/if}}
{{if $contact.details}}<div class="contact-details" id="contact-entry-details-{{$contact.id}}" >{{$contact.details}}</div>{{/if}}
{{if $contact.connlnk}}
<div class="contact-entry-connect"><a href="{{$contact.connlnk}}" title="{{$contact.conntxt}}">{{$contact.conntxt}}</a></div>
{{/if}}
</div>

42
view/theme/smoothly/style.css
View file

@ -115,6 +115,10 @@ input[type=submit]:active {
#search-save {
}
#directory-search-end {
clear: both;
}
.dirsearch-desc {
}
@ -2760,11 +2764,10 @@ margin-left: 0px;
.view-contact-wrapper,
.contact-entry-wrapper {
float: left;
margin-right: 30px;
margin-bottom: 20px;
width: 88px;
padding-right: 10px;
width: 345px;
height: 120px;
position: relative;
margin: 0 10px 10px 0px;
}
#view-contact-end {
@ -2775,6 +2778,10 @@ margin-left: 0px;
margin-top: 15px;
}
.contact-entry-wrapper .contact-entry-photo-wrapper {
float: left;
margin-right: 10px;
}
.contact-entry-direction-wrapper {
position: absolute;
top: 20px;
@ -2791,17 +2798,27 @@ margin-left: 0px;
font-weight: bold;
}
.contact-entry-name {
width: 100px;
.contact-entry-desc {
overflow: hidden;
}
.contact-entry-name, .contact-entry-connect {
overflow: hidden;
font: #999;
font-size: 12px;
text-align: center;
font-weight: bold;
margin-top: 5px;
}
.contact-entry-photo {
.contact-entry-details {
font-size: 13px;
color: #999999;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.contact-entry-photo-wrapper {
position: relative;
/*border: 1px solid #7C7D7B;
border-radius: 3px;
@ -2812,6 +2829,15 @@ margin-left: 0px;
-webkit-box-shadow: 0 0 8px #BDBDBD;*/
}
.contact-entry-photo {
width: 80px;
}
.contact-entry-photo a img {
width: 80px;
height: 80px;
}
.contact-entry-edit-links .icon {
border: 1px solid #babdb6;
border-radius: 3px;

47
view/theme/vier/style.css
View file

@ -351,7 +351,7 @@ code {
margin: 0px;
padding: 1em;
list-style: none;
border: 3px solid #364e59;
/*border: 3px solid #364e59;*/
z-index: 100000;
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
}
@ -2270,18 +2270,50 @@ aside #id_password {
float: left;
}
/* contacts */
.contact-entry-wrapper {
/*.contact-entry-wrapper {
width: 120px;
height: 130px;
float: left;
/* overflow: hidden; */
overflow: hidden;
margin-left: 5px;
}*/
.contact-entry-wrapper {
float: left;
width: 363px;
height: 90px;
padding-right: 10px;
margin: 0 10px 10px 0px;
}
.contact-entry-wrapper .contact-entry-photo-wrapper {
float: left;
margin-right: 10px;
}
.contact-entry-photo-wrapper {
position: relative;
}
.contact-entry-desc {
overflow: hidden;
}
.contact-entry-name {
font-weight: bold;
}
.contact-entry-details {
font-size: 13px;
color: #999999;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* photo */
.lframe {
float: left;
margin: 0px 10px 10px 0px;
}
.contact-entry-photo a img {
width: 80px;
height: 80px;
}
/* profile match wrapper */
.profile-match-wrapper {
float: left;
@ -2319,14 +2351,15 @@ aside #id_password {
}
.contact-photo-menu {
width: 11em;
border: 3px solid #364e59;
/*border: 3px solid #364e59;*/
color: #2d2d2d;
background: #FFFFFF;
/* position: absolute;*/
position: relative;
left: 0px; top: 0px;
position: absolute;
/*position: relative;*/
left: 0px; /*top: 0px;*/
display: none;
z-index: 10000;
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
}
.contact-photo-menu ul { margin:0px; padding: 0px; list-style: none }
.contact-photo-menu li a {

18
view/theme/vier/templates/contact_template.tpl
View file

@ -7,18 +7,18 @@
<a href="{{$contact.url}}" title="{{$contact.img_hover}}" /><img src="{{$contact.thumb}}" {{$contact.sparkle}} alt="{{$contact.name}}" /></a>
{{if !$no_contacts_checkbox}}
{{if $multiselect}}
<input type="checkbox" class="contact-select" name="contact_batch[]" value="{{$contact.id}}">
{{/if}}
{{if $contact.photo_menu}}
<!-- <span onclick="openClose('contact-photo-menu-{{$contact.id}}');" class="fakelink contact-photo-menu-button" id="contact-photo-menu-button-{{$contact.id}}">menu</span> -->
<div class="contact-photo-menu" id="contact-photo-menu-{{$contact.id}}">
<ul>
<ul role="menu" aria-haspopup="true">
{{foreach $contact.photo_menu as $k=>$c}}
{{if $c.2}}
<li><a class="{{$k}}" target="redir" href="{{$c.1}}">{{$c.0}}</a></li>
<li role="menuitem"><a class="{{$k}}" target="redir" href="{{$c.1}}">{{$c.0}}</a></li>
{{else}}
<li><a class="{{$k}}" href="{{$c.1}}">{{$c.0}}</a></li>
<li role="menuitem"><a class="{{$k}}" href="{{$c.1}}">{{$c.0}}</a></li>
{{/if}}
{{/foreach}}
</ul>
@ -28,7 +28,15 @@
</div>
<div class="contact-entry-photo-end" ></div>
<div class="contact-entry-name" id="contact-entry-name-{{$contact.id}}" >{{$contact.name}}</div>
<div class="contact-entry-desc">
<div class="contact-entry-name" id="contact-entry-name-{{$contact.id}}" >{{$contact.name}}</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.network}}<div class="contact-entry-details" id="contact-entry-network-{{$contact.id}}" >{{$contact.network}}</div>{{/if}}
{{if $contact.details}}<div class="contact-entry-details" id="contact-entry-details-{{$contact.id}}" >{{$contact.details}}</div>{{/if}}
</div>
<div class="contact-entry-end" ></div>
</div>