Vier: Use CSS for popup menu
This commit is contained in:
Michael Vogel
parent
2e09ce6847
commit
92fbf1bcbd
9 changed files with 79 additions and 102 deletions
|
|
@ -243,7 +243,7 @@ function dfrn_notify_content(&$a) {
|
|||
dbesc($last_update)
|
||||
);
|
||||
|
||||
logger('dfrn_notify: challenge=' . $hash, LOGGER_DEBUG );
|
||||
logger('dfrn_notify: challenge=' . $hash, LOGGER_DEBUG);
|
||||
|
||||
$sql_extra = '';
|
||||
switch($direction) {
|
||||
|
|
|
|||
|
|
@ -47,10 +47,11 @@ nav .nav-menu {
|
|||
font-weight: initial;
|
||||
}
|
||||
|
||||
#nav-apps-menu,
|
||||
#nav-site-menu,
|
||||
#nav-notifications-menu,
|
||||
#nav-user-menu {
|
||||
top: 35px;
|
||||
top: 32px;
|
||||
}
|
||||
|
||||
#nav-messages-menu {
|
||||
|
|
|
|||
|
|
@ -606,6 +606,7 @@ nav .nav-menu-icon {
|
|||
nav .nav-menu-icon.selected {
|
||||
background-color: #364e59;
|
||||
}
|
||||
nav .nav-menu img,
|
||||
nav .nav-menu-icon img {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
|
|
@ -613,6 +614,10 @@ nav .nav-menu-icon img {
|
|||
-moz-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
nav .nav-menu img {
|
||||
margin-top: -3px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
nav .nav-menu-icon .nav-notify {
|
||||
top: 3px;
|
||||
}
|
||||
|
|
@ -683,7 +688,7 @@ nav #nav-user-linklabel {
|
|||
}
|
||||
nav #nav-user-linklabel {
|
||||
padding-left: 0px;
|
||||
margin-left: 0px;
|
||||
margin-top: 0px;
|
||||
}
|
||||
nav #nav-help-link .menu-popup,
|
||||
nav #nav-search-link .menu-popup,
|
||||
|
|
@ -699,6 +704,17 @@ nav #nav-site-linkmenu {
|
|||
margin-left: 0px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
.contact-entry-photo:hover .contact-photo-menu,
|
||||
.contact-photo-wrapper:hover .menu-popup,
|
||||
nav #nav-user-linklabel:hover #nav-user-menu,
|
||||
nav #nav-user-linkmenu:hover #nav-user-menu,
|
||||
nav #nav-apps-link:hover #nav-apps-menu,
|
||||
nav #nav-site-linkmenu:hover #nav-site-menu,
|
||||
nav #nav-notifications-linkmenu:hover #nav-notifications-menu {
|
||||
display:block;
|
||||
visibility:visible;
|
||||
opacity:1;
|
||||
}
|
||||
nav #nav-notifications-linkmenu {
|
||||
margin-left: 0px;
|
||||
margin-right: 5px;
|
||||
|
|
@ -754,8 +770,12 @@ nav #nav-user-linkmenu {
|
|||
}
|
||||
|
||||
ul.menu-popup {
|
||||
visibility:hidden;
|
||||
opacity:0;
|
||||
z-index:1;
|
||||
transition:all 0.2s ease-in-out;
|
||||
/* display: none; */
|
||||
position: absolute;
|
||||
display: none;
|
||||
width: 11em;
|
||||
background: #ffffff;
|
||||
color: #2d2d2d;
|
||||
|
|
|
|||
34
view/theme/vier/templates/contact_template.tpl
Normal file
34
view/theme/vier/templates/contact_template.tpl
Normal file
|
|
@ -0,0 +1,34 @@
|
|||
|
||||
<div class="contact-entry-wrapper" id="contact-entry-wrapper-{{$contact.id}}" >
|
||||
<div class="contact-entry-photo-wrapper" >
|
||||
<div class="contact-entry-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}}')"
|
||||
onmouseout="t{{$contact.id}}=setTimeout('closeMenu(\'contact-photo-menu-button-{{$contact.id}}\'); closeMenu(\'contact-photo-menu-{{$contact.id}}\');',200)" > -->
|
||||
|
||||
<a href="{{$contact.url}}" title="{{$contact.img_hover}}" /><img src="{{$contact.thumb}}" {{$contact.sparkle}} alt="{{$contact.name}}" /></a>
|
||||
|
||||
{{if !$no_contacts_checkbox}}
|
||||
<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>
|
||||
{{foreach $contact.photo_menu as $k=>$c}}
|
||||
{{if $c.2}}
|
||||
<li><a class="{{$k}}" target="redir" href="{{$c.1}}">{{$c.0}}</a></li>
|
||||
{{else}}
|
||||
<li><a class="{{$k}}" href="{{$c.1}}">{{$c.0}}</a></li>
|
||||
{{/if}}
|
||||
{{/foreach}}
|
||||
</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>
|
||||
|
||||
<div class="contact-entry-end" ></div>
|
||||
</div>
|
||||
|
|
@ -45,11 +45,11 @@
|
|||
{{/if}}
|
||||
|
||||
{{if $userinfo}}
|
||||
<li aria-hidden="true" id="nav-user-linklabel" class="nav-menu">
|
||||
<!-- <li aria-hidden="true" id="nav-user-linklabel" class="nav-menu">
|
||||
<a rel="#nav-user-menu" title="{{$sitelocation}}">{{$userinfo.name}}<span id="intro-update" class="nav-notify"></span></a>
|
||||
</li>
|
||||
<li role="menu" aria-haspopup="true" id="nav-user-linkmenu" class="nav-menu-icon">
|
||||
<a accesskey="u" rel="#nav-user-menu" title="{{$sitelocation}}"><img src="{{$userinfo.icon}}" alt="{{$userinfo.name}}"></a>
|
||||
</li> -->
|
||||
<li role="menu" aria-haspopup="true" id="nav-user-linkmenu" class="nav-menu">
|
||||
<a accesskey="u" rel="#nav-user-menu" title="{{$sitelocation}}"><img src="{{$userinfo.icon}}" alt="{{$userinfo.name}}"><span id="nav-user-linklabel">{{$userinfo.name}}</span><span id="intro-update" class="nav-notify"></span></a>
|
||||
<ul id="nav-user-menu" class="menu-popup">
|
||||
{{if $nav.introductions}}<li role="menuitem"><a class="{{$nav.introductions.2}}" href="{{$nav.introductions.0}}" title="{{$nav.introductions.3}}" >{{$nav.introductions.1}}</a><span id="intro-update-li" class="nav-notify"></span></li>{{/if}}
|
||||
{{if $nav.contacts}}<li role="menuitem"><a class="{{$nav.contacts.2}}" href="{{$nav.contacts.0}}" title="{{$nav.contacts.3}}" >{{$nav.contacts.1}}</a></li>{{/if}}
|
||||
|
|
|
|||
|
|
@ -1,78 +0,0 @@
|
|||
<div class="wall-item-container {{$indent}} {{$shiny}} ">
|
||||
<div class="wall-item-item">
|
||||
<div class="wall-item-info">
|
||||
<div class="contact-photo-wrapper">
|
||||
<a href="{{$profile_url}}" target="redir" title="{{$linktitle}}" class="wall-item-photo-link" id="wall-item-photo-link-{{$id}}">
|
||||
<img src="{{$thumb}}" class="contact-photo{{$sparkle}}" id="wall-item-photo-{{$id}}" alt="{{$name}}" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wall-item-actions-author">
|
||||
<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">
|
||||
{{if $plink}}<a class="link" title="{{$plink.title}}" href="{{$plink.href}}" style="color: #999">{{$ago}}</a>{{else}} {{$ago}} {{/if}}
|
||||
{{if $lock}}<span class="fakelink" style="color: #999" onclick="lockview(event,{{$id}});">{{$lock}}</span> {{/if}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="wall-item-content">
|
||||
{{if $title}}<h2><a href="{{$plink.href}}">{{$title}}</a></h2>{{/if}}
|
||||
{{$body}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="wall-item-bottom">
|
||||
<div class="wall-item-links">
|
||||
</div>
|
||||
<div class="wall-item-tags">
|
||||
{{foreach $tags as $tag}}
|
||||
<span class='tag'>{{$tag}}</span>
|
||||
{{/foreach}}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="wall-item-bottom">
|
||||
<div class="">
|
||||
<!-- {{if $plink}}<a title="{{$plink.title}}" href="{{$plink.href}}"><i class="icon-link icon-large"></i></a>{{/if}} -->
|
||||
{{if $conv}}<a href='{{$conv.href}}' id='context-{{$id}}' title='{{$conv.title}}'><i class="icon-link icon-large"></i></a>{{/if}}
|
||||
</div>
|
||||
<div class="wall-item-actions">
|
||||
|
||||
<div class="wall-item-location">{{$location}} </div>
|
||||
|
||||
<div class="wall-item-actions-social">
|
||||
{{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>
|
||||
<a href="#" id="tagger-{{$id}}" onclick="itemTag({{$id}}); return false;" class="{{$star.classtagger}}" title="{{$star.tagger}}">{{$star.tagger}}</a>
|
||||
{{/if}}
|
||||
|
||||
{{if $vote}}
|
||||
<a href="#" id="like-{{$id}}" title="{{$vote.like.0}}" onclick="dolike({{$id}},'like'); return false">{{$vote.like.1}}</a>
|
||||
<a href="#" id="dislike-{{$id}}" title="{{$vote.dislike.0}}" onclick="dolike({{$id}},'dislike'); return false">{{$vote.dislike.1}}</a>
|
||||
{{/if}}
|
||||
|
||||
{{if $vote.share}}
|
||||
<a href="#" id="share-{{$id}}" title="{{$vote.share.0}}" onclick="jotShare({{$id}}); return false">{{$vote.share.1}}</a>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<div class="wall-item-actions-tools">
|
||||
|
||||
{{if $drop.pagedrop}}
|
||||
<input type="checkbox" title="{{$drop.select}}" name="itemselected[]" class="item-select" value="{{$id}}" />
|
||||
{{/if}}
|
||||
{{if $drop.dropping}}
|
||||
<a href="item/drop/{{$id}}" onclick="return confirmDelete();" class="icon delete s16" title="{{$drop.delete}}">{{$drop.delete}}</a>
|
||||
{{/if}}
|
||||
{{if $edpost}}
|
||||
<a class="icon edit s16" href="{{$edpost.0}}" title="{{$edpost.1}}"></a>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="wall-item-bottom">
|
||||
<div class="wall-item-links"></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>
|
||||
</div>
|
||||
|
|
@ -9,9 +9,9 @@
|
|||
<div class="wall-item-container {{$item.indent}} {{$item.shiny}} ">
|
||||
<div class="wall-item-item">
|
||||
<div class="wall-item-info">
|
||||
<div class="contact-photo-wrapper"
|
||||
onmouseover="if (typeof t{{$item.id}} != 'undefined') clearTimeout(t{{$item.id}}); openMenu('wall-item-photo-menu-button-{{$item.id}}')"
|
||||
onmouseout="t{{$item.id}}=setTimeout('closeMenu(\'wall-item-photo-menu-button-{{$item.id}}\'); closeMenu(\'wall-item-photo-menu-{{$item.id}}\');',200)">
|
||||
<div class="contact-photo-wrapper">
|
||||
<!-- onmouseover="if (typeof t{{$item.id}} != 'undefined') clearTimeout(t{{$item.id}}); openMenu('wall-item-photo-menu-button-{{$item.id}}')"
|
||||
onmouseout="t{{$item.id}}=setTimeout('closeMenu(\'wall-item-photo-menu-button-{{$item.id}}\'); closeMenu(\'wall-item-photo-menu-{{$item.id}}\');',200)"> -->
|
||||
<a href="{{$item.profile_url}}" target="redir" title="{{$item.linktitle}}" class="wall-item-photo-link" id="wall-item-photo-link-{{$item.id}}">
|
||||
<img src="{{$item.thumb}}" class="contact-photo{{$item.sparkle}}" id="wall-item-photo-{{$item.id}}" alt="{{$item.name}}" />
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -38,9 +38,9 @@
|
|||
{{/if}}
|
||||
<div class="wall-item-item">
|
||||
<div class="wall-item-info">
|
||||
<div class="contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}}"
|
||||
onmouseover="if (typeof t{{$item.id}} != 'undefined') clearTimeout(t{{$item.id}}); openMenu('wall-item-photo-menu-button-{{$item.id}}')"
|
||||
onmouseout="t{{$item.id}}=setTimeout('closeMenu(\'wall-item-photo-menu-button-{{$item.id}}\'); closeMenu(\'wall-item-photo-menu-{{$item.id}}\');',200)">
|
||||
<div class="contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}}">
|
||||
<!-- onmouseover="if (typeof t{{$item.id}} != 'undefined') clearTimeout(t{{$item.id}}); openMenu('wall-item-photo-menu-button-{{$item.id}}')"
|
||||
onmouseout="t{{$item.id}}=setTimeout('closeMenu(\'wall-item-photo-menu-button-{{$item.id}}\'); closeMenu(\'wall-item-photo-menu-{{$item.id}}\');',200)"> -->
|
||||
<a aria-hidden="true" href="{{$item.profile_url}}" target="redir" title="{{$item.linktitle}}" class="contact-photo-link" id="wall-item-photo-link-{{$item.id}}">
|
||||
<img src="{{$item.thumb}}" class="contact-photo {{$item.sparkle}}" id="wall-item-photo-{{$item.id}}" alt="{{$item.name}}" />
|
||||
</a>
|
||||
|
|
|
|||
Loading…
Reference in a new issue