div.readme .readme_box h2 {

    margin-top: 1.5em !important;

    border-top: 4px solid #e0e0e0 !important;

    padding-top: .5em !important;

}

div.readme .readme_box p {

    color: black !important;

    margin: 1em 0 !important;

    line-height: 1.5em !important;

}

div.readme .readme_box ul {

    list-style: disc !important;

    margin: 1em 0 1em 2em !important;

}

div.readme .readme_box ol {

    list-style: decimal;

    margin: 1em 0 1em 2em !important;

}

div.readme .readme_box code {

    font-size: 12px !important;

    background-color: ghostWhite !important;

    color: #444 !important;

    padding: 0 .2em !important;

    border: 1px solid #dedede !important;

}

div.readme .readme_box pre code {

    padding: 0 !important;

    font-size: 12px !important;

    background-color: #eee !important;

    border: none !important;

}

div.readme .readme_box pre {

    margin: 1em 0;

    font-size: 12px;

    background-color: #eee;

    border: 1px solid #ddd;

    padding: 5px;

    color: #444;

    overflow: auto;

    border-radius: 3px;

}

div.readme .readme_box table {

    display: table;

    border-collapse: separate;

    border-spacing: 2px;

    border-color: gray;

    width: auto !important;

}

/** RST STYLE **/

div.rst-block {

    padding: 0px;

}

div.rst-block h2 {

    font-weight: normal;

}

div.rst-block {

    background-color: #fafafa;

}

div.rst-block {

    clear: both;

    overflow: hidden;

    margin: 0;

    padding: 0 20px;

}

div.rst-block h1,

div.rst-block h2,

div.rst-block h3,

div.rst-block h4,

div.rst-block h5,

div.rst-block h6 {

    border-bottom: 0 !important;

    margin: 0 !important;

    padding: 0 !important;

    line-height: 1.5em !important;

}

div.rst-block h1:first-child {

    padding-top: .25em !important;

}

div.rst-block h2,

div.rst-block h3 {

    margin: 1em 0 !important;

}

div.rst-block h2 {

    margin-top: 1.5em !important;

    border-top: 4px solid #e0e0e0 !important;

    padding-top: .5em !important;

}

div.rst-block p {

    color: black !important;

    margin: 1em 0 !important;

    line-height: 1.5em !important;

}

div.rst-block ul {

    list-style: disc !important;

    margin: 1em 0 1em 2em !important;

}

div.rst-block ol {

    list-style: decimal;

    margin: 1em 0 1em 2em !important;

}

div.rst-block code {

    font-size: 12px !important;

    background-color: ghostWhite !important;

    color: #444 !important;

    padding: 0 .2em !important;

    border: 1px solid #dedede !important;

}

div.rst-block pre code {

    padding: 0 !important;

    font-size: 12px !important;

    background-color: #eee !important;

    border: none !important;

}

div.rst-block pre {

    margin: 1em 0;

    font-size: 12px;

    background-color: #eee;

    border: 1px solid #ddd;

    padding: 5px;

    color: #444;

    overflow: auto;

    border-radius: 3px;

}

/** comment main **/

.comments {

    padding: 10px 20px;

    max-width: 978px;

}

.comments .comment .comment-wrapp {

    border: 1px solid #ddd;

    margin-top: 10px;

    border-radius: 4px;

}

.comments .comment .meta {

    background: #f8f8f8;

    padding: 4px;

    border-bottom: 1px solid #ddd;

    min-height: 18px;

    overflow: auto;

}

.comments .comment .meta img {

    vertical-align: middle;

}

.comments .comment .meta .user {

    font-weight: bold;

    float: left;

    padding: 4px 2px 2px 2px;

}

.comments .comment .meta .date {

    float: left;

    padding: 4px 4px 0px 4px;

}

.comments .comment .text {

    background-color: #FAFAFA;

    margin: 6px;

}

.comments-number {

    font-weight: bold;

    color: #666;

    font-size: 16px;

}

.automatic-comment {

    font-style: italic;

}

/** comment form **/

.status-block {

    margin: 5px;

    clear: both

}

.comment-form textarea {

    width: 100%;

    height: 100px;

    font-family: Lucida Console, Consolas, Monaco, Inconsolata, Liberation Mono, monospace;

}

form.comment-form {

    margin-top: 10px;

    margin-left: 10px;

}

.comment-inline-form .comment-block-ta,

.comment-form .comment-block-ta {

    border: 1px solid #ccc;

    border-radius: 3px;

    box-sizing: border-box;

}

.comment-form-submit {

    margin-top: 5px;

    margin-left: 525px;

}

.file-comments {

    display: none;

}

.comment-form .comment {

    margin-left: 10px;

}

.comment-form .comment-help {

    padding: 5px 5px 5px 5px;

    color: #666;

}

.comment-form .comment-button {

    padding-top: 5px;

}

.add-another-button {

    margin-left: 10px;

    margin-top: 10px;

    margin-bottom: 10px;

}

.comment .buttons {

    float: right;

    margin: -1px 0px 0px 0px;

}

.show-inline-comments {

    position: relative;

    top: 1px

}

/** comment inline form **/

.comment-inline-form {

    margin: 4px;

    max-width: 978px;

}

.comment-inline-form .submitting-overlay {

    display: none;

    height: 0;

    text-align: center;

    font-size: 16px;

    opacity: 0.5;

}

.comment-inline-form .clearfix,

.comment-form .clearfix {

    background: #EEE;

    border-radius: 4px;

    padding: 5px;

    margin: 0px;

}

div.comment-inline-form {

    padding: 4px 0px 6px 0px;

}

.comment-inline-form textarea {

    width: 100%;

    height: 100px;

    font-family: Lucida Console, Consolas, Monaco, Inconsolata, Liberation Mono, monospace;

}

form.comment-inline-form {

    margin-top: 10px;

    margin-left: 10px;

}

.comment-inline-form-submit {

    margin-top: 5px;

    margin-left: 525px;

}

.file-comments {

    display: none;

}

.comment-inline-form .comment {

    margin-left: 10px;

}

.comment-inline-form .comment-help {

    padding: 5px 5px 5px 5px;

    color: #666;

}

.comment-inline-form .comment-button {

    padding-top: 5px;

}

/** comment inline **/

.inline-comments {

    padding: 0 20px;

}

.inline-comments .comment .comment-wrapp {

    max-width: 978px;

    border: 1px solid #ddd;

    border-radius: 4px;

    margin: 3px 3px 5px 5px;

    background-color: #FAFAFA;

}

.inline-comments .add-button-row {

    padding: 2px 4px 8px 5px;

}

.inline-comments .comment .meta {

    background: #f8f8f8;

    padding: 4px;

    border-bottom: 1px solid #ddd;

    min-height: 20px;

    overflow: auto;

}

.inline-comments .comment .meta img {

    vertical-align: middle;

}

.inline-comments .comment .meta .user {

    font-weight: bold;

    float: left;

    padding: 3px;

}

.inline-comments .comment .meta .date {

    float: left;

    padding: 3px;

}

.inline-comments .comment .text {

    background-color: #FAFAFA;

    margin: 6px;

}

.inline-comments .comments-number {

    padding: 0px 0px 10px 0px;

    font-weight: bold;

    color: #666;

    font-size: 16px;

}

input.status_change_radio {

    margin: 2px 0 5px 15px;

    vertical-align: middle;

}

.notification-paginator {

    padding: 0px 0px 4px 16px;

}

#context-pages .pull-request span,

## -*- coding: utf-8 -*-

## usage:

## <%namespace name="comment" file="/changeset/changeset_file_comment.html"/>

## ${comment.comment_block(co)}

##

<%def name="comment_block(co)">

  <div class="comment" id="comment-${co.comment_id}" line="${co.line_no}">

    <div class="comment-prev-next-links"></div>

    <div class="comment-wrapp">

      <div class="meta">

          <div style="float:left">

               ${h.gravatar(co.author.email, size=20)}

          </div>

          <div class="user">

              ${co.author.full_name_and_username}

          </div>

          <span>

              ${h.age(co.modified_at)}

              %if co.pull_request:

                ${_('on pull request')}

                <a href="${co.pull_request.url()}">"${co.pull_request.title or _("No title")}"</a>

              %else:

                ${_('on this changeset')}

              %endif

              <a class="permalink" href="${co.url()}">&para;</a>

          </span>

          %if h.HasPermissionAny('hg.admin')() or h.HasRepoPermissionAny('repository.admin')(c.repo_name) or co.author.user_id == c.authuser.user_id:

            <div onClick="confirm('${_("Delete comment?")}') && deleteComment(${co.comment_id})" class="buttons delete-comment btn btn-mini">${_('Delete')}</div>

          %endif

      </div>

      <div class="text">

        %if co.status_change:

           <div class="automatic-comment">

             <p>

               <span title="${_('Changeset status')}" class="changeset-status-lbl">${_("Status change")}: ${co.status_change[0].status_lbl}</span>

               <span class="changeset-status-ico"><i class="icon-circle changeset-status-${co.status_change[0].status}"></i></span>

             </p>

           </div>

        %endif

        %if co.text:

          ${h.render_w_mentions(co.text, c.repo_name)|n}

        %endif

      </div>

    </div>

  </div>

</%def>

<%def name="comment_inline_form()">

<div id='comment-inline-form-template' style="display:none">

  <div class="ac">

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

    ${h.form('#', class_='inline-form')}

      <div class="clearfix">

        <div class="comment-help">${_('Commenting on line.')}

          <span style="color:#577632" class="tooltip">${_('Comments are in plain text. Use @username inside this text to notify another user.')|n}</span>

        </div>

        <div class="mentions-container"></div>

        <textarea name="text" class="comment-block-ta yui-ac-input"></textarea>

        <div id="status_block_container" class="status-block general-only hidden">

                %if c.pull_request is None:

                  ${_('Set changeset status')}:

                %else:

                  ${_('Vote for pull request status')}:

                %endif

                <span class="general-only cs-only">

                </span>

                <input type="radio" class="status_change_radio" name="changeset_status" id="changeset_status_unchanged" value="" checked="checked" />

                <label for="changeset_status_unchanged">

                  ${_('No change')}

                </label>

                %for status, lbl in c.changeset_statuses:

                    <label>

                      <input type="radio" class="status_change_radio" name="changeset_status" id="${status}" value="${status}">

                      ${lbl}<i class="icon-circle changeset-status-${status}" /></i>

                    </label>

                %endfor

                %if c.pull_request is not None and ( \

                    h.HasPermissionAny('hg.admin')() or h.HasRepoPermissionAny('repository.admin')(c.repo_name) \

                    or c.pull_request.owner.user_id == c.authuser.user_id):

                  <label>

                    <input id="save_close" type="checkbox" name="save_close">

                    ${_("Close")}

                  </label>

                %endif

        </div>

      </div>

      <div class="comment-button">

        <div class="submitting-overlay">${_('Submitting ...')}</div>

        ${h.submit('save', _('Comment'), class_='btn btn-small save-inline-form')}

        ${h.reset('hide-inline-form', _('Cancel'), class_='btn btn-small hide-inline-form')}

      </div>

    ${h.end_form()}

  %else:

      ${h.form('')}

      <div class="clearfix">

          <div class="comment-help">

            ${_('You need to be logged in to comment.')} <a href="${h.url('login_home', came_from=request.path_qs)}">${_('Login now')}</a>

          </div>

      </div>

      <div class="comment-button">

      ${h.reset('hide-inline-form', _('Hide'), class_='btn btn-small hide-inline-form')}

      </div>

      ${h.end_form()}

  %endif

  </div>

</div>

</%def>

## show comment count as "x comments (y inline, z general)"

<%def name="comment_count(inline_cnt, general_cnt)">

    ${'%s (%s, %s)' % (

        ungettext("%d comment", "%d comments", inline_cnt + general_cnt) % (inline_cnt + general_cnt),

        ungettext("%d inline", "%d inline", inline_cnt) % inline_cnt,

        ungettext("%d general", "%d general", general_cnt) % general_cnt

    )}

    <span class="firstlink"></span>

</%def>

## generate inline comments and the main ones

<%def name="generate_comments()">

  %for f_path, lines in c.inline_comments:

    %for line_no, comments in lines.iteritems():

      <div class="comments-list-chunk" data-f_path="${f_path}" data-line_no="${line_no}" data-target-id="${h.safeid(h.safe_unicode(f_path))}_${line_no}">

        %for co in comments:

            ${comment_block(co)}

        %endfor

      </div>

    %endfor

  %endfor

      <div class="comments-list-chunk" data-f_path="" data-line_no="" data-target-id="general-comments">

        %for co in c.comments:

            ${comment_block(co)}

        %endfor

      </div>

</div>

</%def>

## MAIN COMMENT FORM

<%def name="comments(change_status=True)">

## global, shared for all edit boxes

<div class="mentions-container" id="mentions_container"></div>

<div class="inline-comments inline-comments-general

            ${'show-general-status' if change_status else ''}">

  <div id="comments-general-comments" class="">

  ## comment_div for general comments

  </div>

</div>

<script>

$(document).ready(function () {

   $(window).on('beforeunload', function(){

      var $textareas = $('.comment-inline-form textarea[name=text]');

      if($textareas.size() > 1 ||

         $textareas.val()) {

         // this message will not be displayed on all browsers

         // (e.g. some versions of Firefox), but the user will still be warned

         return 'There are uncommitted comments.';

      }

   });

});

</script>

</%def>