mirror of
https://github.com/friendica/friendica
synced 2024-11-18 09:03:42 +00:00
template rework: multi-row view for the other themes
This commit is contained in:
parent
86f94570ef
commit
442d59abc4
9 changed files with 96 additions and 49 deletions
|
@ -1,5 +1,3 @@
|
|||
{{* todo: better layout and implement $contact.details and other variables *}}
|
||||
|
||||
|
||||
<div class="contact-entry-wrapper" id="contact-entry-wrapper-{{$contact.id}}" >
|
||||
<div class="contact-entry-photo-wrapper" >
|
||||
|
@ -30,8 +28,14 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
<div class="contact-entry-photo-end" ></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>
|
||||
|
|
|
@ -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;
|
||||
|
@ -899,11 +905,14 @@ input#dfrn-url {
|
|||
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;
|
||||
|
|
|
@ -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;
|
||||
|
@ -1130,8 +1135,10 @@ input#dfrn-url {
|
|||
.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;
|
||||
|
@ -1143,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;
|
||||
|
@ -2137,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;
|
||||
|
|
|
@ -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 />
|
||||
|
||||
<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}}
|
||||
<div class="contact-entry-network" id="contact-entry-network-{{$contact.id}}" >{{$contact.network}}</div>
|
||||
{{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>
|
||||
|
|
|
@ -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}}
|
||||
|
|
|
@ -1,12 +0,0 @@
|
|||
|
||||
{{include file="section_title.tpl"}}
|
||||
|
||||
<div id="contacts-display-wrapper">
|
||||
{{foreach $contacts as $contact}}
|
||||
{{include file="contact_template.tpl"}}
|
||||
{{/foreach}}
|
||||
</div>
|
||||
|
||||
<div id="view-contact-end"></div>
|
||||
|
||||
{{$paginate}}
|
|
@ -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;
|
||||
|
@ -1100,6 +1102,9 @@ input#dfrn-url {
|
|||
.contact-entry-photo-end {
|
||||
clear: both;
|
||||
}
|
||||
.contact-entry-desc {
|
||||
overflow: hidden;
|
||||
}
|
||||
.contact-entry-name {
|
||||
/*float: left;*/
|
||||
margin-left: 0px;
|
||||
|
@ -1113,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;
|
||||
|
|
|
@ -25,10 +25,14 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
<div class="contact-entry-photo-end" ></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}}
|
||||
<div class="contact-entry-network" id="contact-entry-network-{{$contact.id}}" >{{$contact.network}}</div>
|
||||
{{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>
|
||||
|
|
|
@ -115,6 +115,10 @@ input[type=submit]:active {
|
|||
#search-save {
|
||||
}
|
||||
|
||||
#directory-search-end {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.dirsearch-desc {
|
||||
}
|
||||
|
||||
|
@ -2753,11 +2757,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 {
|
||||
|
@ -2768,6 +2771,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;
|
||||
|
@ -2784,17 +2791,27 @@ margin-left: 0px;
|
|||
font-weight: bold;
|
||||
}
|
||||
|
||||
.contact-entry-desc {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.contact-entry-name, .contact-entry-connect {
|
||||
width: 100px;
|
||||
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;
|
||||
|
@ -2805,6 +2822,10 @@ margin-left: 0px;
|
|||
-webkit-box-shadow: 0 0 8px #BDBDBD;*/
|
||||
}
|
||||
|
||||
.contact-entry-photo {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.contact-entry-photo a img {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
|
|
Loading…
Reference in a new issue