kallithea Changeset - 049bc911b04f

Changeset - 049bc911b04f

Parent rev.

Child rev.

[Not reviewed]

beta

0 3 0

Marcin Kuzminski - 14 years ago 2012-01-20 06:51:17
marcin@python-works.com

removed upper menu to save space and did little rip off menu similar to G+

3 files changed with 214 insertions and 123 deletions:

rhodecode/public/css/style.css

118

rhodecode/templates/base/base.html

rhodecode/templates/base/root.html

0 comments (0 inline, 0 general)

rhodecode/public/css/style.css

➞

Show inline comments

@@ @@ -258,22 +258,19 @@ div.options a { @@
+}
 #header #header-inner {
-	min-height: 40px;
+	min-height: 44px;
 	clear: both;
 	position: relative;
     background-color: #eedc94;
     background-repeat: repeat-x;
     background-image: -khtml-gradient(linear, left top, left bottom, from(#fceec1),
         to(#eedc94) );
     background-image: -khtml-gradient(linear, left top, left bottom, from(#fceec1),to(#eedc94) );
     background-image: -moz-linear-gradient(top, #003b76, #00376e);
     background-image: -ms-linear-gradient(top, #003b76, #00376e);
     background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #003b76),
         color-stop(100%, #00376e) );
     background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #003b76),color-stop(100%, #00376e) );
     background-image: -webkit-linear-gradient(top, #003b76, #00376e) );
     background-image: -o-linear-gradient(top, #003b76, #00376e) );
     background-image: linear-gradient(top, #003b76, #00376e);
     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#003b76',
         endColorstr='#00376e', GradientType=0 );
     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#003b76',endColorstr='#00376e', GradientType=0 );
 	margin: 0;
 	padding: 0;
 	display: block;
@@ @@ -330,7 +327,7 @@ div.options a { @@
 	float: right;
 	list-style-type: none;
 	list-style-position: outside;
-	margin: 6px 5px 0 0;
+	margin: 8px 5px 0 0;
 	padding: 0;
+}
@@ @@ -341,7 +338,7 @@ div.options a { @@
 	padding: 0;
+}
 #header #header-inner #quick li a {
+#header #header-inner #quick li a.menu_link {
 	top: 0;
 	left: 0;
 	height: 1%;
@@ @@ -424,7 +421,7 @@ div.options a { @@
 	border: 1px solid #666;
 	border-top: 1px solid #003367;
 	z-index: 100;
-	margin: 0;
+	margin: 2px 0px 0px 0px;
 	padding: 0;
+}
@@ @@ -1886,39 +1883,102 @@ div.form div.fields div.field div.button @@
 	padding: 0 0 2px;
+}
 #quick_login {
 	top: 31px;
 	background-color: rgb(0, 51, 103);
 .user-menu{
     margin: 0px !important;
     float: left;
+}
 .user-menu .container{
     padding:0px 4px 0px 4px;
     margin: 0px 0px 0px 0px;
+}
 .user-menu .gravatar{
     margin: 0px 0px 0px 0px;
     cursor: pointer;
+}
 #quick_login{
     min-height: 80px;
     margin: 31px 0 0 -251px;
     padding: 4px;
     position: absolute;
     width: 278px;
     background-repeat: repeat-x;
     background-image: -khtml-gradient(linear, left top, left bottom, from(#fceec1),
         to(#eedc94) );
     background-image: -moz-linear-gradient(top, #003b76, #00376e);
     background-image: -ms-linear-gradient(top, #003b76, #00376e);
     background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #003b76),
         color-stop(100%, #00376e) );
     background-image: -webkit-linear-gradient(top, #003b76, #00376e) );
     background-image: -o-linear-gradient(top, #003b76, #00376e) );
     background-image: linear-gradient(top, #003b76, #00376e);
     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#003b76',
         endColorstr='#00376e', GradientType=0 );
 	z-index: 999;
 	height: 150px;
 	position: absolute;
 	margin-left: -16px;
 	width: 281px;
 	-webkit-border-radius: 0px 0px 4px 4px;
 	-khtml-border-radius: 0px 0px 4px 4px;
 	-moz-border-radius: 0px 0px 4px 4px;
 	border-radius: 0px 0px 4px 4px;
 	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.6);
+}
 #quick_login h4{
     color: #fff;
     padding: 5px 0px 5px 14px;
+}
 #quick_login .password_forgoten {
 	padding-right: 10px;
 	padding-top: 0px;
-	float: left;
+	text-align: left;
+}
 #quick_login .password_forgoten a {
 	font-size: 10px
 	font-size: 10px;
 	color: #fff;
+}
 #quick_login .register {
 	padding-right: 10px;
 	padding-top: 5px;
-	float: left;
+	text-align: left;
+}
 #quick_login .register a {
 	font-size: 10px
 	font-size: 10px;
 	color: #fff;
+}
 #quick_login .submit {
     margin: -20px 0 0 194px;
     position: absolute;
+}
 #quick_login .links_left{
 	float: left;
+}
 #quick_login .links_right{
     float: right;
+}
 #quick_login .full_name{
     color: #FFFFFF;
     font-weight: bold;
     padding: 3px;
+}
 #quick_login .big_gravatar{
 	padding:4px 0px 0px 6px;
+}
 #quick_login .email,#quick_login .email a{
     color: #FFFFFF;
     padding: 3px;
+}
 #quick_login .links .logout{
+}
 #quick_login div.form div.fields {
@@ @@ -1953,7 +2013,7 @@ div.form div.fields div.field div.button @@
 	overflow: hidden;
 	text-align: right;
 	margin: 0;
-	padding: 10px 14px 0px 5px;
+	padding: 5px 14px 0px 5px;
+}
 #quick_login div.form div.links {
@@ @@ -1963,6 +2023,30 @@ div.form div.fields div.field div.button @@
 	padding: 0 0 2px;
+}
 #quick_login ol.links{
     display: block;
     font-weight: bold;
     list-style: none outside none;
     text-align: right;
+}
 #quick_login ol.links li{
     line-height: 27px;
     margin: 0;
     padding: 0;
     color: #fff;
     display: block;
     float:none !important;
+}
 #quick_login ol.links li a{
     color: #fff;
     display: block;
     padding: 2px;
+}
 #quick_login ol.links li a:HOVER{
     background-color: inherit !important;
+}
 #register div.title {
 	clear: both;
 	overflow: hidden;
@@ @@ -3955,20 +4039,24 @@ form.comment-inline-form { @@
 	margin:10px 5px !important;
+}
 .notifications{
 	width:22px;
     padding:2px;
 	float:right;
     border-radius: 4px 4px 4px 4px;
     -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
     border-radius: 4px;
     -moz-border-radius: 4px;
     float: right;
     margin: 24px 0px 0px;
     position: absolute;
     text-align: center;
     margin: 0px -10px 0px 5px;
     background-color: #DEDEDE;
     width: 22px;
     z-index: 1000;
+}
 .notifications a{
 	color:#888 !important;
 	display: block;
 	font-size: 10px
 	font-size: 10px;
 	background-color: #DEDEDE !important;
     border-radius: 2px !important;
     -webkit-border-radius: 2px !important;
     -moz-border-radius: 2px !important;
+}
 .notifications a:hover{
 	text-decoration: none !important;

rhodecode/templates/base/base.html

➞

Show inline comments

@@ @@ -3,76 +3,6 @@ @@
 <!-- HEADER -->
 <div id="header">
     <!-- user -->
     <ul id="logged-user">
          <li class="first">
 			<div id="quick_login" style="display:none">
 			${h.form(h.url('login_home',came_from=h.url.current()))}
 			<div class="form">
 			    <div class="fields">
 			        <div class="field">
 			            <div class="label">
 			                <label for="username">${_('Username')}:</label>
 			            </div>
 			            <div class="input">
 			                ${h.text('username',class_='focus',size=40)}
 			            </div>
 			        </div>
 			        <div class="field">
 			            <div class="label">
 			                <label for="password">${_('Password')}:</label>
 			            </div>
 			            <div class="input">
 			                ${h.password('password',class_='focus',size=40)}
 			            </div>
 			        </div>
 			        <div class="buttons">
 			            <div class="password_forgoten">${h.link_to(_('Forgot password ?'),h.url('reset_password'))}</div>
                         <div class="register">
                         %if h.HasPermissionAny('hg.admin', 'hg.register.auto_activate', 'hg.register.manual_activate')():
                          ${h.link_to(_("Don't have an account ?"),h.url('register'))}
                         %endif
                         </div>
                             ${h.submit('sign_in',_('Sign In'),class_="ui-button")}
 			        </div>
 			    </div>
 			</div>
 			${h.end_form()}
 			</div>
              <div class="gravatar">
                  <img alt="gravatar" src="${h.gravatar_url(c.rhodecode_user.email,20)}" />
              </div>
           <div class="account">
           %if c.rhodecode_user.username == 'default':
               <a href="${h.url('public_journal')}">${_('Public journal')}</a>
           %else:
           	<div style="float: left">
             ${h.link_to(c.rhodecode_user.username,h.url('admin_settings_my_account'),title='%s %s'%(c.rhodecode_user.name,c.rhodecode_user.lastname))}
             </div>
             <div class="notifications">
             <a id="notification_counter" href="${h.url('notifications')}">${c.unread_notifications}</a>
             </div>
           %endif
           </div>
          </li>
          <li>
             <a href="${h.url('home')}">${_('Home')}</a>
          </li>
          %if c.rhodecode_user.username != 'default':
             <li>
                <a href="${h.url('journal')}">${_('Journal')}</a>
             </li>
             %endif
             %if c.rhodecode_user.username == 'default':
                 <li class="last highlight">${h.link_to(_(u'Login'),h.url('login_home'),id='quick_login_link')}</li>
             %else:
                 <li class="last highlight">${h.link_to(_(u'Log Out'),h.url('logout_home'))}</li>
             %endif
     </ul>
     <!-- end user -->
     <div id="header-inner" class="title">
         <div id="logo">
             <h1><a href="${h.url('home')}">${c.rhodecode_name}</a></h1>
@@ @@ -130,6 +60,73 @@ @@
     </div>
 </%def>
 <%def name="usermenu()">
   <div class="user-menu">
       <div class="container">
        <div class="gravatar" id="quick_login_link">
            <img alt="gravatar" src="${h.gravatar_url(c.rhodecode_user.email,20)}" />
        </div>
        %if c.rhodecode_user.username != 'default':
         <div class="notifications">
           <a id="notification_counter" href="${h.url('notifications')}">${c.unread_notifications}</a>
         </div>
        %endif
       </div>
       <div id="quick_login" style="display:none">
         %if c.rhodecode_user.username == 'default':
             <h4>${_('Login to your account')}</h4>
             ${h.form(h.url('login_home',came_from=h.url.current()))}
             <div class="form">
                 <div class="fields">
                     <div class="field">
                         <div class="label">
                             <label for="username">${_('Username')}:</label>
                         </div>
                         <div class="input">
                             ${h.text('username',class_='focus',size=40)}
                         </div>
                     </div>
                     <div class="field">
                         <div class="label">
                             <label for="password">${_('Password')}:</label>
                         </div>
                         <div class="input">
                             ${h.password('password',class_='focus',size=40)}
                         </div>
                     </div>
                     <div class="buttons">
                         <div class="password_forgoten">${h.link_to(_('Forgot password ?'),h.url('reset_password'))}</div>
                         <div class="register">
                         %if h.HasPermissionAny('hg.admin', 'hg.register.auto_activate', 'hg.register.manual_activate')():
                          ${h.link_to(_("Don't have an account ?"),h.url('register'))}
                         %endif
                         </div>
                         <div class="submit">
                             ${h.submit('sign_in',_('Sign In'),class_="ui-btn xsmall")}
                         </div>
                     </div>
                 </div>
             </div>
             ${h.end_form()}
         %else:
             <div class="links_left">
                 <div class="full_name">${c.rhodecode_user.full_name}</div>
                 <div class="email">${c.rhodecode_user.email}</div>
                 <div class="big_gravatar"><img alt="gravatar" src="${h.gravatar_url(c.rhodecode_user.email,48)}" /></div>
             </div>
             <div class="links_right">
             <ol class="links">
               <li>${h.link_to(_(u'Home'),h.url('home'))}</li>
               <li>${h.link_to(_(u'My account'),h.url('admin_settings_my_account'))}</li>
               <li class="logout">${h.link_to(_(u'Log Out'),h.url('logout_home'))}</li>
             </ol>
             </div>
         %endif
       </div>
  </div>
 </%def>
 <%def name="menu(current=None)">
 		<%
@@ @@ -142,7 +139,7 @@ @@
 	        <ul id="quick">
 				<!-- repo switcher -->
 				<li>
 					<a id="repo_switcher" title="${_('Switch repository')}" href="#">
+					<a class="menu_link" id="repo_switcher" title="${_('Switch repository')}" href="#">
                     <span class="icon">
                         <img src="${h.url('/images/icons/database.png')}" alt="${_('Products')}" />
                     </span>
@@ @@ -156,23 +153,15 @@ @@
 				</li>
 	            <li ${is_current('summary')}>
 	               <a title="${_('Summary')}" href="${h.url('summary_home',repo_name=c.repo_name)}">
+	               <a class="menu_link" title="${_('Summary')}" href="${h.url('summary_home',repo_name=c.repo_name)}">
 	               <span class="icon">
 	                   <img src="${h.url('/images/icons/clipboard_16.png')}" alt="${_('Summary')}" />
 	               </span>
 	               <span>${_('Summary')}</span>
 	               </a>
 	            </li>
                 ##<li ${is_current('shortlog')}>
                 ##   <a title="${_('Shortlog')}" href="${h.url('shortlog_home',repo_name=c.repo_name)}">
                 ##   <span class="icon">
                 ##       <img src="${h.url('/images/icons/application_view_list.png')}" alt="${_('Shortlog')}" />
                 ##   </span>
                 ##   <span>${_('Shortlog')}</span>
                 ##   </a>
                 ##</li>
                 <li ${is_current('changelog')}>
                    <a title="${_('Changelog')}" href="${h.url('changelog_home',repo_name=c.repo_name)}">
+                   <a class="menu_link" title="${_('Changelog')}" href="${h.url('changelog_home',repo_name=c.repo_name)}">
                    <span class="icon">
                        <img src="${h.url('/images/icons/time.png')}" alt="${_('Changelog')}" />
                    </span>
@@ @@ -181,7 +170,7 @@ @@
                 </li>
                 <li ${is_current('switch_to')}>
                    <a id="branch_tag_switcher" title="${_('Switch to')}" href="#">
+                   <a class="menu_link" id="branch_tag_switcher" title="${_('Switch to')}" href="#">
                    <span class="icon">
                        <img src="${h.url('/images/icons/arrow_switch.png')}" alt="${_('Switch to')}" />
                    </span>
@@ @@ -192,7 +181,7 @@ @@
                     </ul>
                 </li>
                 <li ${is_current('files')}>
                    <a title="${_('Files')}" href="${h.url('files_home',repo_name=c.repo_name)}">
+                   <a class="menu_link" title="${_('Files')}" href="${h.url('files_home',repo_name=c.repo_name)}">
                    <span class="icon">
                        <img src="${h.url('/images/icons/file.png')}" alt="${_('Files')}" />
                    </span>
@@ @@ -201,7 +190,7 @@ @@
                 </li>
                 <li ${is_current('options')}>
                    <a title="${_('Options')}" href="#">
+                   <a class="menu_link" title="${_('Options')}" href="#">
                    <span class="icon">
                        <img src="${h.url('/images/icons/table_gear.png')}" alt="${_('Admin')}" />
                    </span>
@@ @@ -241,7 +230,7 @@ @@
                 </li>
                 <li>
                     <a title="${_('Followers')}" href="${h.url('repo_followers_home',repo_name=c.repo_name)}">
+                    <a class="menu_link" title="${_('Followers')}" href="${h.url('repo_followers_home',repo_name=c.repo_name)}">
                     <span class="icon_short">
                         <img src="${h.url('/images/icons/heart.png')}" alt="${_('Followers')}" />
                     </span>
@@ @@ -249,13 +238,14 @@ @@
                     </a>
                 </li>
                 <li>
                     <a title="${_('Forks')}" href="${h.url('repo_forks_home',repo_name=c.repo_name)}">
+                    <a class="menu_link" title="${_('Forks')}" href="${h.url('repo_forks_home',repo_name=c.repo_name)}">
                     <span class="icon_short">
                         <img src="${h.url('/images/icons/arrow_divide.png')}" alt="${_('Forks')}" />
                     </span>
                     <span class="short">${c.repository_forks}</span>
                     </a>
                 </li>
                 ${usermenu()}
 	        </ul>
             <script type="text/javascript">
                YUE.on('repo_switcher','mouseover',function(){
@@ @@ -294,25 +284,34 @@ @@
 		    ##ROOT MENU
             <ul id="quick">
                 <li>
                     <a title="${_('Home')}"  href="${h.url('home')}">
+                    <a class="menu_link" title="${_('Home')}"  href="${h.url('home')}">
                     <span class="icon">
                         <img src="${h.url('/images/icons/home_16.png')}" alt="${_('Home')}" />
                     </span>
                     <span>${_('Home')}</span>
                     </a>
                 </li>
-                % if c.rhodecode_user.username != 'default':
                 %if c.rhodecode_user.username != 'default':
                  <li>
                     <a title="${_('Journal')}"  href="${h.url('journal')}">
+                    <a class="menu_link" title="${_('Journal')}"  href="${h.url('journal')}">
                     <span class="icon">
                         <img src="${h.url('/images/icons/book.png')}" alt="${_('Journal')}" />
                     </span>
                     <span>${_('Journal')}</span>
                     </a>
                  </li>
                 % endif
                 %else:
                  <li>
                     <a class="menu_link" title="${_('Public journal')}"  href="${h.url('public_journal')}">
                     <span class="icon">
                         <img src="${h.url('/images/icons/book.png')}" alt="${_('Public journal')}" />
                     </span>
                     <span>${_('Public journal')}</span>
                     </a>
                  </li>
                 %endif
                 <li>
                     <a title="${_('Search')}"  href="${h.url('search')}">
+                    <a class="menu_link" title="${_('Search')}"  href="${h.url('search')}">
                     <span class="icon">
                         <img src="${h.url('/images/icons/search_16.png')}" alt="${_('Search')}" />
                     </span>
@@ @@ -322,7 +321,7 @@ @@
 				%if h.HasPermissionAll('hg.admin')('access admin main page'):
                 <li ${is_current('admin')}>
                    <a title="${_('Admin')}" href="${h.url('admin_home')}">
+                   <a class="menu_link" title="${_('Admin')}" href="${h.url('admin_home')}">
                    <span class="icon">
                        <img src="${h.url('/images/icons/cog_edit.png')}" alt="${_('Admin')}" />
                    </span>
@@ @@ -331,6 +330,7 @@ @@
                     ${admin_menu()}
                 </li>
 				%endif
                 ${usermenu()}
 			</ul>
 		%endif
 </%def>

rhodecode/templates/base/root.html

➞

Show inline comments

@@ @@ -117,7 +117,10 @@ @@
                  else{
                      YUD.setStyle('quick_login','display','');
                      YUD.addClass('quick_login_link','enabled');
                      YUD.get('username').focus();
                      var usr = YUD.get('username');
                      if(usr){
                     	 usr.focus();
+                     }
+                 }
              });

0 comments (0 inline, 0 general)