[vier] Add message icon link in header nav
This commit is contained in:
		
					parent
					
						
							
								b8030313e5
							
						
					
				
			
			
				commit
				
					
						73882ff58f
					
				
			
		
					 3 changed files with 40 additions and 28 deletions
				
			
		| 
						 | 
				
			
			@ -60,8 +60,8 @@ nav ul {
 | 
			
		|||
  .wall-item-container .wall-item-content .type-link img.attachment-image, .type-link img.attachment-image, .type-video img.attachment-image {
 | 
			
		||||
    max-width: 350px;
 | 
			
		||||
  }
 | 
			
		||||
  a.desktop-view { display: none; }
 | 
			
		||||
  a.mobile-view { display: initial; }
 | 
			
		||||
  .desktop-view { display: none; }
 | 
			
		||||
  .mobile-view { display: initial; }
 | 
			
		||||
  #nav-apps-link { display: none; }
 | 
			
		||||
 | 
			
		||||
  .wall-item-container .wall-item-info { width: auto; }
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -365,10 +365,12 @@ pre code {
 | 
			
		|||
	box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.desktop-view { display: none; }
 | 
			
		||||
 | 
			
		||||
/* some settings for different form-factors */
 | 
			
		||||
@media (min-width: 601px) {
 | 
			
		||||
	a.mobile-view { display: none };
 | 
			
		||||
	a.desktop-view { display: initial };
 | 
			
		||||
	.mobile-view { display: none!important; }
 | 
			
		||||
	.desktop-view { display: initial; }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/* tool */
 | 
			
		||||
| 
						 | 
				
			
			@ -685,8 +687,11 @@ nav .nav-menu img {
 | 
			
		|||
	margin-right: 4px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
nav .nav-menu-icon .nav-notify {
 | 
			
		||||
nav .nav-menu > a > .nav-notify,
 | 
			
		||||
nav .nav-menu-icon > a > .nav-notify {
 | 
			
		||||
	position: absolute;
 | 
			
		||||
	top: 3px;
 | 
			
		||||
	right: -5px;
 | 
			
		||||
}
 | 
			
		||||
nav .nav-menu-label {
 | 
			
		||||
	margin: 3px 5px 0px;
 | 
			
		||||
| 
						 | 
				
			
			@ -738,33 +743,27 @@ nav .nav-menu:hover {
 | 
			
		|||
 | 
			
		||||
nav .nav-notify {
 | 
			
		||||
	display: none;
 | 
			
		||||
	position: absolute;
 | 
			
		||||
 /*  background-color: #36c; */
 | 
			
		||||
	 background-color: #F80;
 | 
			
		||||
	/* background-color: #19aeff; */
 | 
			
		||||
	background-color: #F80;
 | 
			
		||||
	-moz-border-radius: 5px 5px 5px 5px;
 | 
			
		||||
	-webkit-border-radius: 5px 5px 5px 5px;
 | 
			
		||||
	border-radius: 5px 5px 5px 5px;
 | 
			
		||||
	font-size: 10px;
 | 
			
		||||
	padding: 1px 3px;
 | 
			
		||||
	top: 0px;
 | 
			
		||||
	/* right: -10px; */
 | 
			
		||||
	right: -5px;
 | 
			
		||||
	min-width: 15px;
 | 
			
		||||
	/* text-align: right; */
 | 
			
		||||
	text-align: center;
 | 
			
		||||
	color: white;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
nav .nav-notify.show {
 | 
			
		||||
	display: block;
 | 
			
		||||
	display: inline-block;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
nav #nav-help-link,
 | 
			
		||||
nav #nav-search-link,
 | 
			
		||||
nav #nav-directory-link,
 | 
			
		||||
nav #nav-apps-link,
 | 
			
		||||
nav #nav-apps-link,
 | 
			
		||||
nav #nav-login-link,
 | 
			
		||||
nav #nav-messages-linkmenu,
 | 
			
		||||
nav #nav-notifications-linkmenu,
 | 
			
		||||
nav #nav-site-linkmenu,
 | 
			
		||||
nav #nav-contacts-linkmenu,
 | 
			
		||||
| 
						 | 
				
			
			@ -845,10 +844,6 @@ nav #nav-user-linkmenu {
 | 
			
		|||
	padding: 5px 10px; */
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#mail-update {
 | 
			
		||||
	top: 56px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.notify-unseen {background-color: #FFF; }
 | 
			
		||||
 | 
			
		||||
.notify-seen {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -14,16 +14,20 @@
 | 
			
		|||
		</li>
 | 
			
		||||
		{{if $nav.home}}
 | 
			
		||||
			<li role="menuitem" id="nav-home-link" class="nav-menu {{$sel.home}}">
 | 
			
		||||
				<a accesskey="p" class="{{$nav.home.2}} desktop-view" href="{{$nav.home.0}}" title="{{$nav.home.3}}" >{{$nav.home.1}}</a>
 | 
			
		||||
				<a class="{{$nav.home.2}} mobile-view" href="{{$nav.home.0}}" title="{{$nav.home.3}}" ><i class="icon s22 icon-home"></i></a>
 | 
			
		||||
				<span id="home-update" class="nav-notify"></span>
 | 
			
		||||
				<a accesskey="p" class="{{$nav.home.2}}" href="{{$nav.home.0}}" title="{{$nav.home.3}}" >
 | 
			
		||||
					<span class="desktop-view">{{$nav.home.1}}</span>
 | 
			
		||||
					<i class="icon s22 icon-home mobile-view"><span class="sr-only">{{$nav.home.1}}</span></i>
 | 
			
		||||
					<span id="home-update" class="nav-notify"></span>
 | 
			
		||||
				</a>
 | 
			
		||||
			</li>
 | 
			
		||||
		{{/if}}
 | 
			
		||||
		{{if $nav.network}}
 | 
			
		||||
			<li role="menuitem" id="nav-network-link" class="nav-menu {{$sel.network}}">
 | 
			
		||||
				<a accesskey="n" class="{{$nav.network.2}} desktop-view" href="{{$nav.network.0}}" title="{{$nav.network.3}}" >{{$nav.network.1}}</a>
 | 
			
		||||
				<a class="{{$nav.network.2}} mobile-view" href="{{$nav.network.0}}" title="{{$nav.network.3}}" ><i class="icon s22 icon-th"></i></a>
 | 
			
		||||
				<span id="net-update" class="nav-notify"></span>
 | 
			
		||||
				<a accesskey="n" class="{{$nav.network.2}}" href="{{$nav.network.0}}" title="{{$nav.network.3}}" >
 | 
			
		||||
					<span class="desktop-view">{{$nav.network.1}}</span>
 | 
			
		||||
					<i class="icon s22 icon-th mobile-view"><span class="sr-only">{{$nav.network.1}}</span></i>
 | 
			
		||||
					<span id="net-update" class="nav-notify"></span>
 | 
			
		||||
				</a>
 | 
			
		||||
			</li>
 | 
			
		||||
		{{/if}}
 | 
			
		||||
		{{if $nav.events}}
 | 
			
		||||
| 
						 | 
				
			
			@ -48,9 +52,22 @@
 | 
			
		|||
			</ul>
 | 
			
		||||
		</li>
 | 
			
		||||
 | 
			
		||||
		{{if $nav.messages}}
 | 
			
		||||
			<li role="menu" aria-haspopup="true" id="nav-messages-linkmenu" class="nav-menu-icon">
 | 
			
		||||
				<a href="{{$nav.messages.0}}" title="{{$nav.messages.1}}">
 | 
			
		||||
					<span class="icon s22 icon-envelope"><span class="sr-only">{{$nav.messages.1}}</span></span>
 | 
			
		||||
					<span id="mail-update" class="nav-notify"></span>
 | 
			
		||||
				</a>
 | 
			
		||||
			</li>
 | 
			
		||||
		{{/if}}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
		{{if $nav.notifications}}
 | 
			
		||||
			<li role="menu" aria-haspopup="true" id="nav-notifications-linkmenu" class="nav-menu-icon"><a title="{{$nav.notifications.1}}"><span class="icon s22 icon-bell tilted-icon"><span class="sr-only">{{$nav.notifications.1}}</span></span></a>
 | 
			
		||||
				<span id="notify-update" class="nav-notify"></span>
 | 
			
		||||
			<li role="menu" aria-haspopup="true" id="nav-notifications-linkmenu" class="nav-menu-icon">
 | 
			
		||||
				<a title="{{$nav.notifications.1}}">
 | 
			
		||||
					<span class="icon s22 icon-bell tilted-icon"><span class="sr-only">{{$nav.notifications.1}}</span></span>
 | 
			
		||||
					<span id="notify-update" class="nav-notify"></span>
 | 
			
		||||
				</a>
 | 
			
		||||
				<ul id="nav-notifications-menu" class="menu-popup">
 | 
			
		||||
					<li role="menuitem" id="nav-notifications-mark-all"><a onclick="notifyMarkAll(); return false;">{{$nav.notifications.mark.1}}</a></li>
 | 
			
		||||
					<li role="menuitem" id="nav-notifications-see-all"><a href="{{$nav.notifications.all.0}}">{{$nav.notifications.all.1}}</a></li>
 | 
			
		||||
| 
						 | 
				
			
			@ -65,7 +82,7 @@
 | 
			
		|||
				<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}}
 | 
			
		||||
					{{if $nav.messages}}<li role="menuitem"><a class="{{$nav.messages.2}}" href="{{$nav.messages.0}}" title="{{$nav.messages.3}}" >{{$nav.messages.1}}</a><span id="mail-update" class="nav-notify"></span></a></li>{{/if}}
 | 
			
		||||
					{{if $nav.messages}}<li role="menuitem"><a class="{{$nav.messages.2}}" href="{{$nav.messages.0}}" title="{{$nav.messages.3}}" >{{$nav.messages.1}} <span id="mail-update-li" class="nav-notify"></span></a></li>{{/if}}
 | 
			
		||||
					{{if $nav.manage}}<li role="menuitem"><a class="{{$nav.manage.2}}" href="{{$nav.manage.0}}" title="{{$nav.manage.3}}">{{$nav.manage.1}}</a></li>{{/if}}
 | 
			
		||||
					{{if $nav.usermenu.1}}<li role="menuitem"><a class="{{$nav.usermenu.1.2}}" href="{{$nav.usermenu.1.0}}" title="{{$nav.usermenu.1.3}}">{{$nav.usermenu.1.1}}</a></li>{{/if}}
 | 
			
		||||
					{{if $nav.settings}}<li role="menuitem"><a class="{{$nav.settings.2}}" href="{{$nav.settings.0}}" title="{{$nav.settings.3}}">{{$nav.settings.1}}</a></li>{{/if}}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue