/**

 * Stylesheets for the context bar

 */

i.icon-arrow-right { background-image: url('../images/icons/arrow_right.png');}

i.icon-ban-circle { background-image: url("../images/icons/cancel.png"); }

i.icon-bar-chart { background-image: url("../images/icons/chart_bar.png"); }

i.icon-bookmark { background-image: url("../images/icons/tag_green.png"); }

i.icon-code-merge { background-image: url("../images/icons/arrow_merge.png"); } /* unused! */

i.icon-cogs { background-image: url("../images/icons/table_gear.png"); }

i.icon-ellipsis-horizontal:after { content: ' ...';}

i.icon-eye-open { background-image: url("../images/icons/eye.png"); }

i.icon-file-alt { background-image: url("../images/icons/note_add.png"); }

i.icon-file { background-image: url("../images/icons/file.png"); }

i.icon-file-txt { background-image: url("../images/icons/note_error.png"); }

i.icon-folder-close { background-image: url("../images/icons/database_link.png"); }

i.icon-git { background-image: url('../images/icons/giticon.png');}

i.icon-group { background-image: url("../images/icons/group_edit.png"); }

i.icon-heart { background-image: url("../images/icons/heart_delete.png"); }

i.icon-heart-empty { background-image: url("../images/icons/heart.png"); }

i.icon-hg { background-image: url('../images/icons/hgicon.png');}

i.icon-key { background-image: url("../images/icons/server_key.png"); }

i.icon-lock { background-image: url('../images/icons/lock.png');}

i.icon-lock-alt { background-image: url('../images/icons/private_repo.png');}

i.icon-loop { background-image: url('../images/icons/arrow_inout.png');}

i.icon-loop-2 { background-image: url('../images/icons/arrow_inout.png');}

i.icon-private { background-image: url('../images/icons/private_repo.png');}

i.icon-public { background-image: url('../images/icons/public_repo.png');}

i.icon-random { background-image: url("../images/icons/arrow_switch.png"); }

i.icon-refresh { background-image: url('../images/icons/arrow_refresh.png');}

i.icon-tag { background-image: url("../images/icons/tag_blue.png"); }

i.icon-time { background-image: url("../images/icons/time.png"); }

i.icon-list-alt { background-image: url("../images/icons/time.png"); }

i.icon-unlock { background-image: url('../images/icons/lock_open.png');}

i.icon-unlock-alt { background-image: url('../images/icons/public_repo.png');}

i.icon-user { background-image: url("../images/icons/user_edit.png"); }

i.icon-wrench { background-image: url("../images/icons/wrench.png"); }

i.icon-rss-sign { background-image: url('../images/icons/rss_16.png');}

i.icon-plus-sign { background-image: url('../images/icons/add.png');}

i.icon-chevron-left:after { content: "\00AB";}

i.icon-chevron-right:after { content: "\00BB";}

i.icon-copy { background-image: url('../images/icons/note_add.png');}

i.icon-pencil { background-image: url('../images/icons/application_form_edit.png');}

i.icon-remove { background-image: url('../images/icons/delete.png');}

i.icon-remove-sign { background-image: url('../images/icons/delete.png');}

i.icon-plus { background-image: url('../images/icons/plus_16.png');}

i.icon-resize-vertical { background-image: url('../images/icons/text_align_left.png');}

i.icon-ok-sign { background-image: url('../images/icons/tick.png');}

i.icon-minus-sign { background-image: url('../images/icons/delete.png');}

i.icon-disabled { background-image: url('../images/icons/shading.png');} /* todo: use instead of minus sign */

i[class^='icon-'] {

    background-repeat: no-repeat;

    background-position: center;

    display: inline-block;

    min-width: 16px;

    min-height: 16px;

    margin: -2px 0 -4px 0;

    /* background-color: red; /* for debugging */

}

#content #context-bar {

    position: relative;

    overflow: visible;

    background-color: #577632;

    padding: 0 5px;

    min-height: 36px;

}

#content #context-bar h2 {

    display: inline-block;

    color: #FFF;

}

#header #header-inner #quick a,

#content #context-bar,

#content #context-bar a {

    color: #FFFFFF;

}

#header #header-inner #quick a:hover,

#content #context-bar a:hover {

    text-decoration: none;

}

#content #context-bar .icon {

    display: inline-block;

    width: 16px;

    height: 16px;

    vertical-align: text-bottom;

}

ul.horizontal-list {

    display: block;

}

ul.horizontal-list > li {

    float: left;

    position: relative;

}

#header #header-inner #quick ul,

ul.horizontal-list > li ul {

    position: absolute;

    display: none;

    right: 0;

    z-index: 999;

}

#header #header-inner #quick li:hover > ul,

ul.horizontal-list li:hover > ul {

    display: block;

}

#header #header-inner #quick li ul li,

ul.horizontal-list ul li {

    position: relative;

    border-bottom: 1px solid rgba(0,0,0,0.1);

    border-top: 1px solid rgba(255,255,255,0.1);

}

ul.horizontal-list > li ul ul {

    position: absolute;

    right: 100%;

    top: -1px;

    min-width: 200px;

    max-height: 400px;

    overflow-x: hidden;

    overflow-y: auto;

}

#header #header-inner #quick ul a,

ul.horizontal-list li a {

    white-space: nowrap;

}

#breadcrumbs {

    float: left;

    padding: 6px 0 5px 0;

    padding-left: 5px;

    font-weight: bold;

    font-size: 14px;

}

#breadcrumbs span {

    font-weight: bold;

    font-size: 1.4em;

}

#header #header-inner #quick ul,

#revision-changer,

#context-pages,

#context-pages ul {

    background: #3b6998; /* Old browsers */

    background: -moz-linear-gradient(top, #577632 0%, #577632 100%); /* FF3.6+ */

    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#577632), color-stop(100%,#577632)); /* Chrome,Safari4+ */

    background: -webkit-linear-gradient(top, #577632 0%, #577632 100%); /* Chrome10+,Safari5.1+ */

    background: -o-linear-gradient(top, #577632 0%, #577632 100%); /* Opera 11.10+ */

    background: -ms-linear-gradient(top, #577632 0%, #577632 100%); /* IE10+ */

    background: linear-gradient(to bottom, #577632 0%, #577632 100%); /* W3C */

    /*Filter on IE will also use overflow:hidden implicitly, and that would clip our inner menus.*/

    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#577632', endColorstr='#577632',GradientType=0 ); /* IE6-9 */*/

}

#header #header-inner #quick a,

#context-actions a,

#context-pages a {

    background-repeat: no-repeat;

    background-position: 10px 50%;

    padding-left: 30px;

}

#quick a,

#context-pages ul ul a {

    padding-left: 10px;

}

ul#context-actions {

    display: inline-block;

    float: right;

    border-radius: 4px;

    background-image: linear-gradient(top, #577632 0%, #577632 100%);

}

#content ul#context-actions li {

    padding: 0px;

    border-right: 1px solid rgba(0,0,0,0.1);

    border-left: 1px solid rgba(255,255,255,0.1);

}

#context-actions a {

    display: block;

    cursor: pointer;

    background: none;

    border: none;

    margin: 0px;

    height: auto;

    padding: 10px 10px 10px 30px;

    background-repeat: no-repeat;

    background-position: 10px 50%;

    font-size: 1em;

}

#context-actions a {

    padding: 11px 10px 12px 30px;

## DATA TABLE RE USABLE ELEMENTS

## usage:

## <%namespace name="dt" file="/data_table/_dt_elements.html"/>

<%def name="quick_menu(repo_name)">

  <ul class="menu_items hidden">

  ##<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">

    <li style="border-top:1px solid #577632;margin-left:18px;padding-left:-99px"></li>

    <li>

       <a title="${_('Summary')}" href="${h.url('summary_home',repo_name=repo_name)}">

       <span class="icon">

       </span>

       <span>${_('Summary')}</span>

       </a>

    </li>

    <li>

       <a title="${_('Changelog')}" href="${h.url('changelog_home',repo_name=repo_name)}">

       <span class="icon">

           <i class="icon-list-alt"></i>

       </span>

       <span>${_('Changelog')}</span>

       </a>

    </li>

    <li>

       <a title="${_('Files')}" href="${h.url('files_home',repo_name=repo_name)}">

       <span class="icon">

           <i class="icon-file-alt"></i>

       </span>

       <span>${_('Files')}</span>

       </a>

    </li>

    <li>

       <a title="${_('Fork')}" href="${h.url('repo_fork_home',repo_name=repo_name)}">

       <span class="icon">

           <i class="icon-code-fork"></i>

       </span>

       <span>${_('Fork')}</span>

       </a>

    </li>

    <li>

       <a title="${_('Settings')}" href="${h.url('edit_repo',repo_name=repo_name)}">

       <span class="icon">

           <i class="icon-gear"></i>

       </span>

       <span>${_('Settings')}</span>

       </a>

    </li>

  </ul>

</%def>

<%def name="repo_name(name,rtype,rstate,private,fork_of,short_name=False,admin=False)">

    <%

    def get_name(name,short_name=short_name):

      if short_name:

        return name.split('/')[-1]

      else:

        return name

    %>

  <div style="white-space: nowrap; ${'opacity: 0.5' if rstate == 'repo_state_pending' else ''}}">

    ##NAME

    %if admin:

        <a href="${h.url('edit_repo',repo_name=name)}">

    %else:

        <a href="${h.url('summary_home',repo_name=name)}">

    %endif

    ##TYPE OF REPO

    %if h.is_hg(rtype):

        <span title="${_('Mercurial repository')}"><i class="icon-hg" style="color: #576622; font-size: 14px;"></i></span>

    %elif h.is_git(rtype):

        <span title="${_('Git repository')}"><i class="icon-git" style="color: #e85634; font-size: 14px;"></i></span>

    %endif

    ##PRIVATE/PUBLIC

    %if private and c.visual.show_private_icon:

      <i class="icon-lock" style="color: #e85634; font-size: 16px; vertical-align: -2px; margin: 0px 1px 0px 3px" title="${_('Private repository')}"></i>

    %elif not private and c.visual.show_public_icon:

      <i class="icon-unlock-alt" style="color: #999999; font-size: 16px; vertical-align: -2px; margin: 0px 1px 0px 3px" title="${_('Public repository')}"></i>

    %else:

      <span style="margin: 0px 8px 0px 8px"></span>

    %endif

    ${get_name(name)}

    </a>

    %if fork_of:

      <a href="${h.url('summary_home',repo_name=fork_of.repo_name)}"><i class="icon-code-fork"></i></a>

    %endif

    %if rstate == 'repo_state_pending':

      <i class="icon-cogs" style="color: #036185;" title="${_('Repository creating in progress...')}"></i>

    %endif

  </div>

</%def>

<%def name="last_change(last_change)">

  <span class="tooltip" date="${last_change}" title="${h.tooltip(h.fmt_date(last_change))}">${h.age(last_change)}</span>

</%def>

<%def name="revision(name,rev,tip,author,last_msg)">

  <div>

  %if rev >= 0:

      <pre><a title="${h.tooltip('%s:\n\n%s' % (author,last_msg))}" class="tooltip" href="${h.url('changeset_home',repo_name=name,revision=tip)}">${'r%s:%s' % (rev,h.short_id(tip))}</a></pre>

  %else:

      ${_('No changesets yet')}

  %endif

  </div>

</%def>

<%def name="rss(name)">

  %if c.authuser.username != 'default':

    <a title="${_('Subscribe to %s rss feed')% name}" href="${h.url('rss_feed_home',repo_name=name,api_key=c.authuser.api_key)}"><i class="icon-rss-sign" style="color: #fa9b39"></i></a>

  %else:

    <a title="${_('Subscribe to %s rss feed')% name}" href="${h.url('rss_feed_home',repo_name=name)}"><i class="icon-rss-sign" style="color: #fa9b39"></i></a>

  %endif

</%def>

<%def name="atom(name)">

  %if c.authuser.username != 'default':

    <a title="${_('Subscribe to %s atom feed')% name}" href="${h.url('atom_feed_home',repo_name=name,api_key=c.authuser.api_key)}"><i class="icon-rss-sign"  style="color: #fa9b39"></i></a>

  %else:

    <a title="${_('Subscribe to %s atom feed')% name}" href="${h.url('atom_feed_home',repo_name=name)}"><i class="icon-rss-sign"  style="color: #fa9b39"></i></a>

  %endif

</%def>

<%def name="user_gravatar(email, size=24)">

    <div class="gravatar"><img alt="gravatar" src="${h.gravatar_url(email, size)}"/> </div>

</%def>

<%def name="repo_actions(repo_name, super_user=True)">

  <div>

    <div style="float:left; margin-right:5px;" class="grid_edit">

      <a href="${h.url('edit_repo',repo_name=repo_name)}" title="${_('edit')}">

        <i class="icon-pencil"></i> ${h.submit('edit_%s' % repo_name,_('edit'),class_="action_button")}

      </a>

    </div>

    <div style="float:left" class="grid_delete">

      ${h.form(h.url('repo', repo_name=repo_name),method='delete')}

        <i class="icon-remove-sign" style="color:#FF4444"></i>

        ${h.submit('remove_%s' % repo_name,_('delete'),class_="action_button",

        onclick="return confirm('"+_('Confirm to delete this repository: %s') % repo_name+"');")}

      ${h.end_form()}

    </div>

  </div>

</%def>

<%def name="repo_state(repo_state)">

  <div>

    %if repo_state == 'repo_state_pending':

        <div class="btn btn-mini btn-info disabled">${_('Creating')}</div>

    %elif repo_state == 'repo_state_created':

        <div class="btn btn-mini btn-success disabled">${_('Created')}</div>

    %else:

        <div class="btn btn-mini btn-danger disabled" title="${repo_state}">invalid</div>

    %endif

  </div>

</%def>

<%def name="user_actions(user_id, username)">

 <div style="float:left" class="grid_edit">

   <a href="${h.url('edit_user',id=user_id)}" title="${_('edit')}">

     <i class="icon-pencil"></i> ${h.submit('edit_%s' % username,_('edit'),class_="action_button")}

   </a>

 </div>

 <div style="float:left" class="grid_delete">

  ${h.form(h.url('delete_user', id=user_id),method='delete')}

    <i class="icon-remove-sign" style="color:#FF4444"></i>

    ${h.submit('remove_',_('delete'),id="remove_user_%s" % user_id, class_="action_button",

    onclick="return confirm('"+_('Confirm to delete this user: %s') % username+"');")}

  ${h.end_form()}

 </div>

</%def>

<%def name="user_group_actions(user_group_id, user_group_name)">

 <div style="float:left" class="grid_edit">

    <a href="${h.url('edit_users_group', id=user_group_id)}" title="${_('Edit')}">

    <i class="icon-pencil"></i>

     ${h.submit('edit_%s' % user_group_name,_('edit'),class_="action_button", id_="submit_user_group_edit")}

    </a>

 </div>

 <div style="float:left" class="grid_delete">

    ${h.form(h.url('users_group', id=user_group_id),method='delete')}

      <i class="icon-remove-sign" style="color:#FF4444"></i>

      ${h.submit('remove_',_('delete'),id="remove_group_%s" % user_group_id, class_="action_button",

      onclick="return confirm('"+_('Confirm to delete this user group: %s') % user_group_name+"');")}

    ${h.end_form()}

 </div>

</%def>

<%def name="repo_group_actions(repo_group_id, repo_group_name, gr_count)">

 <div style="float:left" class="grid_edit">

    <a href="${h.url('edit_repo_group',group_name=repo_group_name)}" title="${_('Edit')}">

    <i class="icon-pencil"></i>

     ${h.submit('edit_%s' % repo_group_name, _('edit'),class_="action_button")}

    </a>

 </div>

 <div style="float:left" class="grid_delete">

    ${h.form(h.url('repos_group', group_name=repo_group_name),method='delete')}

        <i class="icon-remove-sign" style="color:#FF4444"></i>

        ${h.submit('remove_%s' % repo_group_name,_('delete'),class_="action_button",

        onclick="return confirm('"+ungettext('Confirm to delete this group: %s with %s repository','Confirm to delete this group: %s with %s repositories',gr_count) % (repo_group_name, gr_count)+"');")}

    ${h.end_form()}

 </div>

</%def>

<%def name="user_name(user_id, username)">