quattro: initial style of conversations
This commit is contained in:
parent
80af4f3fe6
commit
6b6f45f9f1
|
@ -268,6 +268,10 @@ function conversation(&$a, $items, $mode, $update) {
|
||||||
$blowhard = 0;
|
$blowhard = 0;
|
||||||
$blowhard_count = 0;
|
$blowhard_count = 0;
|
||||||
|
|
||||||
|
// array with html for each thread (parent+comments)
|
||||||
|
$treads = array();
|
||||||
|
$treadsid = -1;
|
||||||
|
|
||||||
foreach($items as $item) {
|
foreach($items as $item) {
|
||||||
|
|
||||||
$comment = '';
|
$comment = '';
|
||||||
|
@ -294,7 +298,7 @@ function conversation(&$a, $items, $mode, $update) {
|
||||||
$toplevelprivate = (($toplevelpost && $item['private']) ? true : false);
|
$toplevelprivate = (($toplevelpost && $item['private']) ? true : false);
|
||||||
$item_writeable = (($item['writable'] || $item['self']) ? true : false);
|
$item_writeable = (($item['writable'] || $item['self']) ? true : false);
|
||||||
|
|
||||||
if($blowhard == $item['cid'] && (! $item['self']) && ($mode != 'profile') && ($mode != 'notes')) {
|
/*if($blowhard == $item['cid'] && (! $item['self']) && ($mode != 'profile') && ($mode != 'notes')) {
|
||||||
$blowhard_count ++;
|
$blowhard_count ++;
|
||||||
if($blowhard_count == 3) {
|
if($blowhard_count == 3) {
|
||||||
$o .= '<div class="icollapse-wrapper fakelink" id="icollapse-wrapper-' . $item['parent']
|
$o .= '<div class="icollapse-wrapper fakelink" id="icollapse-wrapper-' . $item['parent']
|
||||||
|
@ -308,10 +312,13 @@ function conversation(&$a, $items, $mode, $update) {
|
||||||
if($blowhard_count >= 3)
|
if($blowhard_count >= 3)
|
||||||
$o .= '</div>';
|
$o .= '</div>';
|
||||||
$blowhard_count = 0;
|
$blowhard_count = 0;
|
||||||
}
|
}*/
|
||||||
|
|
||||||
$comments_seen = 0;
|
$comments_seen = 0;
|
||||||
$comments_collapsed = false;
|
$comments_collapsed = false;
|
||||||
|
|
||||||
|
$treadsid++;
|
||||||
|
$treads[$treadsid] = "";
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
// prevent private email from leaking into public conversation
|
// prevent private email from leaking into public conversation
|
||||||
|
@ -325,7 +332,7 @@ function conversation(&$a, $items, $mode, $update) {
|
||||||
|
|
||||||
if(($comments[$item['parent']] > 2) && ($comments_seen <= ($comments[$item['parent']] - 2)) && ($item['gravity'] == 6)) {
|
if(($comments[$item['parent']] > 2) && ($comments_seen <= ($comments[$item['parent']] - 2)) && ($item['gravity'] == 6)) {
|
||||||
if(! $comments_collapsed) {
|
if(! $comments_collapsed) {
|
||||||
$o .= '<div class="ccollapse-wrapper fakelink" id="ccollapse-wrapper-' . $item['parent']
|
$treads[$treadsid] .= '<div class="ccollapse-wrapper fakelink" id="ccollapse-wrapper-' . $item['parent']
|
||||||
. '" onclick="openClose(' . '\'ccollapse-' . $item['parent'] . '\'); $(\'#ccollapse-wrapper-' . $item['parent'] . '\').hide();" >'
|
. '" onclick="openClose(' . '\'ccollapse-' . $item['parent'] . '\'); $(\'#ccollapse-wrapper-' . $item['parent'] . '\').hide();" >'
|
||||||
. sprintf( t('See all %d comments'), $comments[$item['parent']]) . '</div>'
|
. sprintf( t('See all %d comments'), $comments[$item['parent']]) . '</div>'
|
||||||
. '<div class="ccollapse" id="ccollapse-' . $item['parent'] . '" style="display: none;" >';
|
. '<div class="ccollapse" id="ccollapse-' . $item['parent'] . '" style="display: none;" >';
|
||||||
|
@ -333,15 +340,15 @@ function conversation(&$a, $items, $mode, $update) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if(($comments[$item['parent']] > 2) && ($comments_seen == ($comments[$item['parent']] - 1))) {
|
if(($comments[$item['parent']] > 2) && ($comments_seen == ($comments[$item['parent']] - 1))) {
|
||||||
$o .= '</div>';
|
$treads[$treadsid] .= '</div>';
|
||||||
}
|
}
|
||||||
|
|
||||||
$redirect_url = $a->get_baseurl() . '/redir/' . $item['cid'] ;
|
$redirect_url = $a->get_baseurl() . '/redir/' . $item['cid'] ;
|
||||||
|
|
||||||
$lock = ((($item['private']) || (($item['uid'] == local_user()) && (strlen($item['allow_cid']) || strlen($item['allow_gid'])
|
$lock = ((($item['private']) || (($item['uid'] == local_user()) && (strlen($item['allow_cid']) || strlen($item['allow_gid'])
|
||||||
|| strlen($item['deny_cid']) || strlen($item['deny_gid']))))
|
|| strlen($item['deny_cid']) || strlen($item['deny_gid']))))
|
||||||
? '<div class="wall-item-lock"><img src="images/lock_icon.gif" class="lockview" alt="' . t('Private Message') . '" onclick="lockview(event,' . $item['id'] . ');" /></div>'
|
? t('Private Message')
|
||||||
: '<div class="wall-item-lock"></div>');
|
: false);
|
||||||
|
|
||||||
|
|
||||||
// Top-level wall post not written by the wall owner (wall-to-wall)
|
// Top-level wall post not written by the wall owner (wall-to-wall)
|
||||||
|
@ -427,7 +434,20 @@ function conversation(&$a, $items, $mode, $update) {
|
||||||
|
|
||||||
$drop = replace_macros((($dropping)? $droptpl : $fakedrop), array('$id' => $item['id'], '$select' => t('Select'), '$delete' => t('Delete')));
|
$drop = replace_macros((($dropping)? $droptpl : $fakedrop), array('$id' => $item['id'], '$select' => t('Select'), '$delete' => t('Delete')));
|
||||||
|
|
||||||
$star = (($profile_owner == local_user() && $toplevelpost) ? '<a href="#" id="starred-' . $item['id'] . '" onclick="dostar(' . $item['id'] . '); return false;" class="star-item icon ' . (($item['starred']) ? 'starred' : 'unstarred') . '" title="' . t('toggle star status') . '"></a>' : '');
|
$star = false;
|
||||||
|
|
||||||
|
if ($profile_owner == local_user() && $toplevelpost) {
|
||||||
|
$isstarred = (($item['starred']) ? "starred" : "hidden");
|
||||||
|
|
||||||
|
$star = array(
|
||||||
|
'do' => t("add star"),
|
||||||
|
'undo' => t("remove star"),
|
||||||
|
'classdo' => (($item['starred']) ? "hidden" : ""),
|
||||||
|
'classundo' => (($item['starred']) ? "" : "hidden"),
|
||||||
|
'starred' => t('starred'),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
$photo = $item['photo'];
|
$photo = $item['photo'];
|
||||||
|
@ -508,6 +528,7 @@ function conversation(&$a, $items, $mode, $update) {
|
||||||
'$owner_name' => $owner_name,
|
'$owner_name' => $owner_name,
|
||||||
'$plink' => get_plink($item),
|
'$plink' => get_plink($item),
|
||||||
'$edpost' => $edpost,
|
'$edpost' => $edpost,
|
||||||
|
'$isstarred' => $isstarred,
|
||||||
'$star' => $star,
|
'$star' => $star,
|
||||||
'$drop' => $drop,
|
'$drop' => $drop,
|
||||||
'$vote' => $likebuttons,
|
'$vote' => $likebuttons,
|
||||||
|
@ -520,7 +541,7 @@ function conversation(&$a, $items, $mode, $update) {
|
||||||
$arr = array('item' => $item, 'output' => $tmp_item);
|
$arr = array('item' => $item, 'output' => $tmp_item);
|
||||||
call_hooks('display_item', $arr);
|
call_hooks('display_item', $arr);
|
||||||
|
|
||||||
$o .= $arr['output'];
|
$treads[$treadsid] .= $arr['output'];
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -529,10 +550,15 @@ function conversation(&$a, $items, $mode, $update) {
|
||||||
// if author collapsing is in force but didn't get closed, close it off now.
|
// if author collapsing is in force but didn't get closed, close it off now.
|
||||||
|
|
||||||
if($blowhard_count >= 3)
|
if($blowhard_count >= 3)
|
||||||
$o .= '</div>';
|
$treads[$treadsid] .= '</div>';
|
||||||
|
|
||||||
if($dropping)
|
$page_template = get_markup_template("conversation.tpl");
|
||||||
$o .= '<div id="item-delete-selected" class="fakelink" onclick="deleteCheckedItems();"><div id="item-delete-selected-icon" class="icon drophide" title="' . t('Delete Selected Items') . '" onmouseover="imgbright(this);" onmouseout="imgdull(this);" ></div><div id="item-delete-selected-desc" >' . t('Delete Selected Items') . '</div></div><div id="item-delete-selected-end"></div>';
|
$o .= replace_macros($page_template, array(
|
||||||
|
'$treads' => $treads,
|
||||||
|
'$dropping' => $dropping,
|
||||||
|
));
|
||||||
|
//if($dropping)
|
||||||
|
// $o .= '<div id="item-delete-selected" class="fakelink" onclick="deleteCheckedItems();"><div id="item-delete-selected-icon" class="icon drophide" title="' . t('Delete Selected Items') . '" onmouseover="imgbright(this);" onmouseout="imgdull(this);" ></div><div id="item-delete-selected-desc" >' . t('Delete Selected Items') . '</div></div><div id="item-delete-selected-end"></div>';
|
||||||
|
|
||||||
return $o;
|
return $o;
|
||||||
}
|
}
|
||||||
|
|
|
@ -834,9 +834,14 @@ function feed_salmonlinks($nick) {
|
||||||
if(! function_exists('get_plink')) {
|
if(! function_exists('get_plink')) {
|
||||||
function get_plink($item) {
|
function get_plink($item) {
|
||||||
$a = get_app();
|
$a = get_app();
|
||||||
$plink = (((x($item,'plink')) && (! $item['private'])) ? '<div class="wall-item-links-wrapper"><a href="'
|
if (x($item,'plink') && (! $item['private'])){
|
||||||
. $item['plink'] . '" title="' . t('link to source') . '" target="external-link" class="icon remote-link"></a></div>' : '');
|
return array(
|
||||||
return $plink;
|
'href' => $item['plink'],
|
||||||
|
'title' => t('link to source'),
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
}}
|
}}
|
||||||
|
|
||||||
if(! function_exists('unamp')) {
|
if(! function_exists('unamp')) {
|
||||||
|
|
20
js/main.js
20
js/main.js
|
@ -71,6 +71,7 @@
|
||||||
/* popup menus */
|
/* popup menus */
|
||||||
$('a[rel^=#]').click(function(e){
|
$('a[rel^=#]').click(function(e){
|
||||||
menu = $( $(this).attr('rel') );
|
menu = $( $(this).attr('rel') );
|
||||||
|
e.preventDefault();
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
if (menu.attr('popup')=="false") return false;
|
if (menu.attr('popup')=="false") return false;
|
||||||
$(this).parent().toggleClass("selected");
|
$(this).parent().toggleClass("selected");
|
||||||
|
@ -261,17 +262,22 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
function dostar(ident) {
|
function dostar(ident) {
|
||||||
$('#like-rotator-' + ident.toString()).show();
|
ident = ident.toString();
|
||||||
$.get('starred/' + ident.toString(), function(data) {
|
$('#like-rotator-' + ident).show();
|
||||||
|
$.get('starred/' + ident, function(data) {
|
||||||
if(data.match(/1/)) {
|
if(data.match(/1/)) {
|
||||||
$('#starred-' + ident.toString()).addClass('starred');
|
$('#starred-' + ident).addClass('starred');
|
||||||
$('#starred-' + ident.toString()).removeClass('unstarred');
|
$('#starred-' + ident).removeClass('hidden');
|
||||||
|
$('#star-' + ident).addClass('hidden');
|
||||||
|
$('#unstar-' + ident).removeClass('hidden');
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
$('#starred-' + ident.toString()).addClass('unstarred');
|
$('#starred-' + ident).addClass('hidden');
|
||||||
$('#starred-' + ident.toString()).removeClass('starred');
|
$('#starred-' + ident).removeClass('starred');
|
||||||
|
$('#star-' + ident).removeClass('hidden');
|
||||||
|
$('#unstar-' + ident).addClass('hidden');
|
||||||
}
|
}
|
||||||
$('#like-rotator-' + ident.toString()).hide();
|
$('#like-rotator-' + ident).hide();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
5
view/conversation.tpl
Normal file
5
view/conversation.tpl
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
{{ for $treads as $tread }}
|
||||||
|
<div class="tread-wrapper">
|
||||||
|
$tread
|
||||||
|
</div>
|
||||||
|
{{ endfor }}
|
49
view/theme/duepuntozero/wall_item.tpl
Normal file
49
view/theme/duepuntozero/wall_item.tpl
Normal file
|
@ -0,0 +1,49 @@
|
||||||
|
<div class="wall-item-outside-wrapper$indent" id="wall-item-outside-wrapper-$id" >
|
||||||
|
<div class="wall-item-content-wrapper$indent" id="wall-item-content-wrapper-$id" >
|
||||||
|
<div class="wall-item-info" id="wall-item-info-$id">
|
||||||
|
<div class="wall-item-photo-wrapper" id="wall-item-photo-wrapper-$id"
|
||||||
|
onmouseover="if (typeof t$id != 'undefined') clearTimeout(t$id); openMenu('wall-item-photo-menu-button-$id')"
|
||||||
|
onmouseout="t$id=setTimeout('closeMenu(\'wall-item-photo-menu-button-$id\'); closeMenu(\'wall-item-photo-menu-$id\');',200)">
|
||||||
|
<a href="$profile_url" target="redir" title="$linktitle" class="wall-item-photo-link" id="wall-item-photo-link-$id">
|
||||||
|
<img src="$thumb" class="wall-item-photo$sparkle" id="wall-item-photo-$id" style="height: 80px; width: 80px;" alt="$name" />
|
||||||
|
</a>
|
||||||
|
<span onclick="openClose('wall-item-photo-menu-$id');" class="fakelink wall-item-photo-menu-button" id="wall-item-photo-menu-button-$id">menu</span>
|
||||||
|
<div class="wall-item-photo-menu" id="wall-item-photo-menu-$id">
|
||||||
|
<ul>
|
||||||
|
$item_photo_menu
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="wall-item-photo-end"></div>
|
||||||
|
<div class="wall-item-wrapper" id="wall-item-wrapper-$id" >
|
||||||
|
$lock
|
||||||
|
<div class="wall-item-location" id="wall-item-location-$id">$location</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="wall-item-author">
|
||||||
|
<a href="$profile_url" target="redir" title="$linktitle" class="wall-item-name-link"><span class="wall-item-name$sparkle" id="wall-item-name-$id" >$name</span></a>
|
||||||
|
<div class="wall-item-ago" id="wall-item-ago-$id">$ago</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="wall-item-content" id="wall-item-content-$id" >
|
||||||
|
<div class="wall-item-title" id="wall-item-title-$id">$title</div>
|
||||||
|
<div class="wall-item-title-end"></div>
|
||||||
|
<div class="wall-item-body" id="wall-item-body-$id" >$body</div>
|
||||||
|
</div>
|
||||||
|
<div class="wall-item-tools" id="wall-item-tools-$id">
|
||||||
|
$vote
|
||||||
|
$plink
|
||||||
|
$edpost
|
||||||
|
$star
|
||||||
|
$drop
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="wall-item-wrapper-end"></div>
|
||||||
|
<div class="wall-item-like" id="wall-item-like-$id">$like</div>
|
||||||
|
<div class="wall-item-dislike" id="wall-item-dislike-$id">$dislike</div>
|
||||||
|
<div class="wall-item-comment-wrapper" >
|
||||||
|
$comment
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="wall-item-outside-wrapper-end$indent" ></div>
|
||||||
|
</div>
|
|
@ -65,3 +65,5 @@
|
||||||
|
|
||||||
@NoticeColor: @Grey1;
|
@NoticeColor: @Grey1;
|
||||||
@NoticeBackgroundColor: #511919;
|
@NoticeBackgroundColor: #511919;
|
||||||
|
|
||||||
|
@ThreadBackgroundColor: #f6f7f8;
|
||||||
|
|
|
@ -31,6 +31,8 @@ a:hover {color: @LinkHover; text-decoration: underline; }
|
||||||
|
|
||||||
.left { float: left; }
|
.left { float: left; }
|
||||||
.right { float: right; }
|
.right { float: right; }
|
||||||
|
.hidden { display: none; }
|
||||||
|
|
||||||
|
|
||||||
.tool {
|
.tool {
|
||||||
height: auto; overflow: auto;
|
height: auto; overflow: auto;
|
||||||
|
@ -253,4 +255,55 @@ section {
|
||||||
padding:0px 20px 0px 10px;
|
padding:0px 20px 0px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* wall item */
|
||||||
|
.tread-wrapper {
|
||||||
|
background-color: @ThreadBackgroundColor;
|
||||||
|
position: relative;
|
||||||
|
padding: 10px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.wall-item-decor { position: absolute; left: 790px; top: -10px; width: 16px;}
|
||||||
|
.wall-item-container {
|
||||||
|
display: table;
|
||||||
|
width: 780px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
|
||||||
|
.wall-item-item,
|
||||||
|
.wall-item-bottom { display: table-row; }
|
||||||
|
.wall-item-info {
|
||||||
|
display: table-cell;
|
||||||
|
vertical-align: top;
|
||||||
|
text-align: left;
|
||||||
|
width: 60px;
|
||||||
|
|
||||||
|
.wall-item-photo-wrapper { position: relative; }
|
||||||
|
.wall-item-photo { width: 48px; height: 48px; }
|
||||||
|
|
||||||
|
.wall-item-photo-menu-button {
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
left: -4px;
|
||||||
|
top: 28px;
|
||||||
|
}
|
||||||
|
.wall-item-photo-menu { display: none; }
|
||||||
|
|
||||||
|
}
|
||||||
|
.wall-item-content {
|
||||||
|
display: table-cell;
|
||||||
|
font-size: 12px;
|
||||||
|
max-width: 720px;
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
.wall-item-content img { max-width: 710px; }
|
||||||
|
.wall-item-links,
|
||||||
|
.wall-item-actions { display: table-cell; }
|
||||||
|
|
||||||
|
.wall-item-ago { padding-right: 40px; }
|
||||||
|
}
|
||||||
|
.wall-item-container.comment {
|
||||||
|
.wall-item-photo { width: 32px; height: 32px; margin-left: 16px;}
|
||||||
|
.wall-item-photo-menu-button {
|
||||||
|
top: 13px !important;
|
||||||
|
left: 10px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -14,6 +14,40 @@
|
||||||
.icon.text {
|
.icon.text {
|
||||||
text-indent: 0px;
|
text-indent: 0px;
|
||||||
}
|
}
|
||||||
|
.icon.s10 {
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
}
|
||||||
|
.icon.s10.notify {
|
||||||
|
background-image: url("../../../images/icons/10/notify_off.png");
|
||||||
|
}
|
||||||
|
.icon.s10.gear {
|
||||||
|
background-image: url("../../../images/icons/10/gear.png");
|
||||||
|
}
|
||||||
|
.icon.s10.add {
|
||||||
|
background-image: url("../../../images/icons/10/add.png");
|
||||||
|
}
|
||||||
|
.icon.s10.delete {
|
||||||
|
background-image: url("../../../images/icons/10/delete.png");
|
||||||
|
}
|
||||||
|
.icon.s10.edit {
|
||||||
|
background-image: url("../../../images/icons/10/edit.png");
|
||||||
|
}
|
||||||
|
.icon.s10.star {
|
||||||
|
background-image: url("../../../images/icons/10/star.png");
|
||||||
|
}
|
||||||
|
.icon.s10.menu {
|
||||||
|
background-image: url("../../../images/icons/10/menu.png");
|
||||||
|
}
|
||||||
|
.icon.s10.link {
|
||||||
|
background-image: url("../../../images/icons/10/link.png");
|
||||||
|
}
|
||||||
|
.icon.s10.lock {
|
||||||
|
background-image: url("../../../images/icons/10/lock.png");
|
||||||
|
}
|
||||||
|
.icon.s10.unlock {
|
||||||
|
background-image: url("../../../images/icons/10/unlock.png");
|
||||||
|
}
|
||||||
.icon.s16 {
|
.icon.s16 {
|
||||||
width: 22px;
|
width: 22px;
|
||||||
height: 22px;
|
height: 22px;
|
||||||
|
@ -33,9 +67,21 @@
|
||||||
.icon.s16.edit {
|
.icon.s16.edit {
|
||||||
background-image: url("../../../images/icons/16/edit.png");
|
background-image: url("../../../images/icons/16/edit.png");
|
||||||
}
|
}
|
||||||
.icon.s16.start {
|
.icon.s16.star {
|
||||||
background-image: url("../../../images/icons/16/star.png");
|
background-image: url("../../../images/icons/16/star.png");
|
||||||
}
|
}
|
||||||
|
.icon.s16.menu {
|
||||||
|
background-image: url("../../../images/icons/16/menu.png");
|
||||||
|
}
|
||||||
|
.icon.s16.link {
|
||||||
|
background-image: url("../../../images/icons/16/link.png");
|
||||||
|
}
|
||||||
|
.icon.s16.lock {
|
||||||
|
background-image: url("../../../images/icons/16/lock.png");
|
||||||
|
}
|
||||||
|
.icon.s16.unlock {
|
||||||
|
background-image: url("../../../images/icons/16/unlock.png");
|
||||||
|
}
|
||||||
.icon.s22 {
|
.icon.s22 {
|
||||||
width: 22px;
|
width: 22px;
|
||||||
height: 22px;
|
height: 22px;
|
||||||
|
@ -55,9 +101,55 @@
|
||||||
.icon.s22.edit {
|
.icon.s22.edit {
|
||||||
background-image: url("../../../images/icons/22/edit.png");
|
background-image: url("../../../images/icons/22/edit.png");
|
||||||
}
|
}
|
||||||
.icon.s22.start {
|
.icon.s22.star {
|
||||||
background-image: url("../../../images/icons/22/star.png");
|
background-image: url("../../../images/icons/22/star.png");
|
||||||
}
|
}
|
||||||
|
.icon.s22.menu {
|
||||||
|
background-image: url("../../../images/icons/22/menu.png");
|
||||||
|
}
|
||||||
|
.icon.s22.link {
|
||||||
|
background-image: url("../../../images/icons/22/link.png");
|
||||||
|
}
|
||||||
|
.icon.s22.lock {
|
||||||
|
background-image: url("../../../images/icons/22/lock.png");
|
||||||
|
}
|
||||||
|
.icon.s22.unlock {
|
||||||
|
background-image: url("../../../images/icons/22/unlock.png");
|
||||||
|
}
|
||||||
|
.icon.s48 {
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
}
|
||||||
|
.icon.s48.notify {
|
||||||
|
background-image: url("../../../images/icons/22/notify_off.png");
|
||||||
|
}
|
||||||
|
.icon.s48.gear {
|
||||||
|
background-image: url("../../../images/icons/22/gear.png");
|
||||||
|
}
|
||||||
|
.icon.s48.add {
|
||||||
|
background-image: url("../../../images/icons/22/add.png");
|
||||||
|
}
|
||||||
|
.icon.s48.delete {
|
||||||
|
background-image: url("../../../images/icons/22/delete.png");
|
||||||
|
}
|
||||||
|
.icon.s48.edit {
|
||||||
|
background-image: url("../../../images/icons/22/edit.png");
|
||||||
|
}
|
||||||
|
.icon.s48.star {
|
||||||
|
background-image: url("../../../images/icons/22/star.png");
|
||||||
|
}
|
||||||
|
.icon.s48.menu {
|
||||||
|
background-image: url("../../../images/icons/22/menu.png");
|
||||||
|
}
|
||||||
|
.icon.s48.link {
|
||||||
|
background-image: url("../../../images/icons/22/link.png");
|
||||||
|
}
|
||||||
|
.icon.s48.lock {
|
||||||
|
background-image: url("../../../images/icons/22/lock.png");
|
||||||
|
}
|
||||||
|
.icon.s48.unlock {
|
||||||
|
background-image: url("../../../images/icons/22/unlock.png");
|
||||||
|
}
|
||||||
/* global */
|
/* global */
|
||||||
body {
|
body {
|
||||||
font-family: Liberation Sans, helvetica, arial, clean, sans-serif;
|
font-family: Liberation Sans, helvetica, arial, clean, sans-serif;
|
||||||
|
@ -85,6 +177,9 @@ a:hover {
|
||||||
.right {
|
.right {
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
|
.hidden {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
.tool {
|
.tool {
|
||||||
height: auto;
|
height: auto;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
@ -393,3 +488,70 @@ section {
|
||||||
width: 800px;
|
width: 800px;
|
||||||
padding: 0px 20px 0px 10px;
|
padding: 0px 20px 0px 10px;
|
||||||
}
|
}
|
||||||
|
/* wall item */
|
||||||
|
.tread-wrapper {
|
||||||
|
background-color: #f6f7f8;
|
||||||
|
position: relative;
|
||||||
|
padding: 10px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.wall-item-decor {
|
||||||
|
position: absolute;
|
||||||
|
left: 790px;
|
||||||
|
top: -10px;
|
||||||
|
width: 16px;
|
||||||
|
}
|
||||||
|
.wall-item-container {
|
||||||
|
display: table;
|
||||||
|
width: 780px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.wall-item-container .wall-item-item, .wall-item-container .wall-item-bottom {
|
||||||
|
display: table-row;
|
||||||
|
}
|
||||||
|
.wall-item-container .wall-item-info {
|
||||||
|
display: table-cell;
|
||||||
|
vertical-align: top;
|
||||||
|
text-align: left;
|
||||||
|
width: 60px;
|
||||||
|
}
|
||||||
|
.wall-item-container .wall-item-info .wall-item-photo-wrapper {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.wall-item-container .wall-item-info .wall-item-photo {
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
}
|
||||||
|
.wall-item-container .wall-item-info .wall-item-photo-menu-button {
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
left: -4px;
|
||||||
|
top: 28px;
|
||||||
|
}
|
||||||
|
.wall-item-container .wall-item-info .wall-item-photo-menu {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.wall-item-container .wall-item-content {
|
||||||
|
display: table-cell;
|
||||||
|
font-size: 12px;
|
||||||
|
max-width: 720px;
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
.wall-item-container .wall-item-content img {
|
||||||
|
max-width: 710px;
|
||||||
|
}
|
||||||
|
.wall-item-container .wall-item-links, .wall-item-container .wall-item-actions {
|
||||||
|
display: table-cell;
|
||||||
|
}
|
||||||
|
.wall-item-container .wall-item-ago {
|
||||||
|
padding-right: 40px;
|
||||||
|
}
|
||||||
|
.wall-item-container.comment .wall-item-photo {
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
margin-left: 16px;
|
||||||
|
}
|
||||||
|
.wall-item-container.comment .wall-item-photo-menu-button {
|
||||||
|
top: 13px !important;
|
||||||
|
left: 10px !important;
|
||||||
|
}
|
||||||
|
|
|
@ -1,50 +1,43 @@
|
||||||
<div class="wall-item-outside-wrapper$indent" id="wall-item-outside-wrapper-$id" >
|
{{ if $indent }}{{ else }}
|
||||||
<div class="wall-item-content-wrapper$indent" id="wall-item-content-wrapper-$id" >
|
<div class="wall-item-decor">
|
||||||
<div class="wall-item-info" id="wall-item-info-$id">
|
<span class="icon s22 star $isstarred" id="starred-$id" title="$star.starred">$star.starred</span>
|
||||||
<div class="wall-item-photo-wrapper" id="wall-item-photo-wrapper-$id"
|
{{ if $lock }}<span class="icon s22 lock fakelink" onclick="lockview(event,$id);" title="$lock">$lock</span>{{ endif }}
|
||||||
onmouseover="if (typeof t$id != 'undefined') clearTimeout(t$id); openMenu('wall-item-photo-menu-button-$id')"
|
</div>
|
||||||
onmouseout="t$id=setTimeout('closeMenu(\'wall-item-photo-menu-button-$id\'); closeMenu(\'wall-item-photo-menu-$id\');',200)">
|
{{ endif }}
|
||||||
|
<div class="wall-item-container $indent">
|
||||||
|
<div class="wall-item-item">
|
||||||
|
<div class="wall-item-info">
|
||||||
|
<div class="wall-item-photo-wrapper"
|
||||||
|
onmouseover="if (typeof t$id != 'undefined') clearTimeout(t$id); openMenu('wall-item-photo-menu-button-$id')"
|
||||||
|
onmouseout="t$id=setTimeout('closeMenu(\'wall-item-photo-menu-button-$id\'); closeMenu(\'wall-item-photo-menu-$id\');',200)">
|
||||||
<a href="$profile_url" target="redir" title="$linktitle" class="wall-item-photo-link" id="wall-item-photo-link-$id">
|
<a href="$profile_url" target="redir" title="$linktitle" class="wall-item-photo-link" id="wall-item-photo-link-$id">
|
||||||
<img src="$thumb" class="wall-item-photo$sparkle" id="wall-item-photo-$id" style="height: 80px; width: 80px;" alt="$name" />
|
<img src="$thumb" class="wall-item-photo$sparkle" id="wall-item-photo-$id" alt="$name" />
|
||||||
</a>
|
</a>
|
||||||
<span onclick="openClose('wall-item-photo-menu-$id');" class="fakelink wall-item-photo-menu-button" id="wall-item-photo-menu-button-$id">menu</span>
|
<a href="#" rel="#wall-item-photo-menu-$id" class="fakelink wall-item-photo-menu-button icon s16 menu" id="wall-item-photo-menu-button-$id">menu</a>
|
||||||
<div class="wall-item-photo-menu" id="wall-item-photo-menu-$id">
|
<ul class="wall-item-menu menu-popup" id="wall-item-photo-menu-$id">
|
||||||
<ul>
|
$item_photo_menu
|
||||||
$item_photo_menu
|
</ul>
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="wall-item-photo-end"></div>
|
|
||||||
<div class="wall-item-wrapper" id="wall-item-wrapper-$id" >
|
|
||||||
$lock
|
|
||||||
<div class="wall-item-location" id="wall-item-location-$id">$location</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="wall-item-author">
|
|
||||||
<a href="$profile_url" target="redir" title="$linktitle" class="wall-item-name-link"><span class="wall-item-name$sparkle" id="wall-item-name-$id" >$name</span></a>
|
|
||||||
<div class="wall-item-ago" id="wall-item-ago-$id">$ago</div>
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="wall-item-location">$location</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="wall-item-content" id="wall-item-content-$id" >
|
<div class="wall-item-content">
|
||||||
<div class="wall-item-title" id="wall-item-title-$id">$title</div>
|
{{ if $title }}<h2><a href="$plink.href">$title</a></h2>{{ endif }}
|
||||||
<div class="wall-item-title-end"></div>
|
$body
|
||||||
<div class="wall-item-body" id="wall-item-body-$id" >$body</div>
|
|
||||||
</div>
|
|
||||||
<div class="wall-item-tools" id="wall-item-tools-$id">
|
|
||||||
$vote
|
|
||||||
$plink
|
|
||||||
$edpost
|
|
||||||
$star
|
|
||||||
$drop
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="wall-item-wrapper-end"></div>
|
<div class="wall-item-bottom">
|
||||||
<div class="wall-item-like" id="wall-item-like-$id">$like</div>
|
<div class="wall-item-links">
|
||||||
<div class="wall-item-dislike" id="wall-item-dislike-$id">$dislike</div>
|
{{ if $plink }}<a class="icon s16 link" title="$plink.title" href="$plink.href">$plink.title</a>{{ endif }}
|
||||||
<div class="wall-item-comment-wrapper" >
|
</div>
|
||||||
$comment
|
<div class="wall-item-actions">
|
||||||
</div>
|
<a href="$profile_url" target="redir" title="$linktitle" class="wall-item-name-link"><span class="wall-item-name$sparkle">$name</span></a> <span class="wall-item-ago">$ago</span>
|
||||||
|
|
||||||
<div class="wall-item-outside-wrapper-end$indent" ></div>
|
{{ if $star }}
|
||||||
|
<a href="#" id="star-$id" onclick="dostar($id); return false;" class="$star.classdo" title="$star.do">$star.do</a>
|
||||||
|
<a href="#" id="unstar-$id" onclick="dostar($id); return false;" class="$star.classundo" title="$star.undo">$star.undo</a>
|
||||||
|
{{ endif }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue