kallithea Changeset - 11f829761032

Changeset - 11f829761032

Parent rev.

Child rev.

[Not reviewed]

default

0 2 0

Mads Kiilerich - 8 years ago 2018-04-23 00:44:13
mads@kiilerich.com

repos: clean up table button markup to give proper spacing

Before, it used multiple divs with pull-left to make plain buttons and buttons
within forms render horizontally. But by doing so, they were rendered without
any space between the buttons.

Instead, style forms after buttons to be shown inline. The whitespace will thus
give the necessary spacing.

The redundant divs are thus removed.

2 files changed with 9 insertions and 26 deletions:

kallithea/public/less/style.less

kallithea/templates/data_table/_dt_elements.html

0 comments (0 inline, 0 general)

kallithea/public/less/style.less

➞

Show inline comments

@@ @@ -146,24 +146,33 @@ table.dataTable { @@
     font-family: "kallithea";
     content: "\2195";
     padding-right: 8px;
     opacity: 0.5;
+  }
   .sorting_asc:after,
   .sorting_desc:after,
   .sorting:after {
     content: "" !important;
+  }
+}
 /* _dt_elements.html styling - some submit buttons have their own form but should still be shown inline */
 table.dataTable td > .btn + form {
   display: inline;
+}
 table.dataTable .dt_repo_pending {
   opacity: 0.5;
+}
 /* language bars (summary page) */
 #lang_stats {
   .progress-bar {
     min-width: 15px;
     border-top-right-radius: 8px;
     border-bottom-right-radius: 8px;
+  }
   td {
     padding: 1px 0 !important;
+  }
+}
@@ @@ -186,28 +195,24 @@ table.changesets { @@
 textarea.form-control {
   min-height: 100px;
   min-width: 400px;
+}
 /* add some space between the code-browser icons and the file names */
 .browser-dir > i[class^='icon-'],
 .submodule-dir > i[class^='icon-'],
 .browser-file > i[class^='icon-'] {
   padding-right: 0.3em;
+}
 .dt_repo_pending {
   opacity: 0.5;
+}
 div.panel-primary {
   border: none;
+}
 /* no extra vertical margin */
 #content div.panel ul.pagination {
   margin: 0;
+}
 /* remove margin below footer */
 .navbar.footer {
   margin-bottom: 0;

kallithea/templates/data_table/_dt_elements.html

➞

Show inline comments

@@ @@ -27,132 +27,110 @@ @@
     %endif
     %if rstate == 'repo_state_pending':
       <i class="icon-wrench" title="${_('Repository creation in progress...')}"></i>
     %endif
   </div>
 </%def>
 <%def name="last_change(last_change)">
   <span data-toggle="tooltip" title="${h.fmt_date(last_change)}" date="${last_change}">${h.age(last_change)}</span>
 </%def>
 <%def name="revision(name,rev,tip,author,last_msg)">
   <div>
   %if rev >= 0:
       <a data-toggle="popover" title="${author | entity}" data-content="${last_msg | entity}" class="changeset_hash" href="${h.url('changeset_home',repo_name=name,revision=tip)}">${'r%s:%s' % (rev,h.short_id(tip))}</a>
   %else:
       ${_('No changesets yet')}
   %endif
   </div>
 </%def>
 <%def name="rss(name)">
   %if request.authuser.username != 'default':
     <a title="${_('Subscribe to %s rss feed')% name}" href="${h.url('rss_feed_home',repo_name=name,api_key=request.authuser.api_key)}"><i class="icon-rss-squared"></i></a>
   %else:
     <a title="${_('Subscribe to %s rss feed')% name}" href="${h.url('rss_feed_home',repo_name=name)}"><i class="icon-rss-squared"></i></a>
   %endif
 </%def>
 <%def name="atom(name)">
   %if request.authuser.username != 'default':
     <a title="${_('Subscribe to %s atom feed')% name}" href="${h.url('atom_feed_home',repo_name=name,api_key=request.authuser.api_key)}"><i class="icon-rss-squared"></i></a>
   %else:
     <a title="${_('Subscribe to %s atom feed')% name}" href="${h.url('atom_feed_home',repo_name=name)}"><i class="icon-rss-squared"></i></a>
   %endif
 </%def>
 <%def name="repo_actions(repo_name)">
   <div>
     <div class="pull-left">
       <a href="${h.url('edit_repo',repo_name=repo_name)}" title="${_('Edit')}" class="btn btn-default btn-xs">
         <i class="icon-pencil"></i>${_('Edit')}
       </a>
     </div>
     <div class="pull-left">
       ${h.form(h.url('delete_repo', repo_name=repo_name))}
         <button name="${'remove_%s' % repo_name}" class="btn btn-default btn-xs"
             onclick="return confirm('${_('Confirm to delete this repository: %s') % repo_name}');">
           <i class="icon-trashcan"></i>${_('Delete')}
         </button>
       ${h.end_form()}
     </div>
   </div>
 </%def>
 <%def name="repo_state(repo_state)">
   <div>
     %if repo_state == u'repo_state_pending':
         <div class="label label-info">${_('Creating')}</div>
     %elif repo_state == u'repo_state_created':
         <div class="label label-success">${_('Created')}</div>
     %else:
         <div class="label label-danger" title="${repo_state}">invalid</div>
     %endif
   </div>
 </%def>
 <%def name="user_actions(user_id, username)">
  <div class="pull-left">
    <a href="${h.url('edit_user',id=user_id)}" title="${_('Edit')}" class="btn btn-default btn-xs">
      <i class="icon-pencil"></i>${_('Edit')}
    </a>
  </div>
  <div class="pull-left">
   ${h.form(h.url('delete_user', id=user_id))}
     <button id="${'remove_user_%s' % user_id}" name="${'remove_user_%s' % repo_name}" class="btn btn-default btn-xs" title="${_('Delete')}"
         onclick="return confirm('${_('Confirm to delete this user: %s') % username}');">
       <i class="icon-trashcan"></i>${_('Delete')}
     </button>
   ${h.end_form()}
  </div>
 </%def>
 <%def name="user_group_actions(user_group_id, user_group_name)">
  <div class="pull-left">
     <a href="${h.url('edit_users_group', id=user_group_id)}" title="${_('Edit')}" class="btn btn-default btn-xs">
       <i class="icon-pencil"></i>${_('Edit')}
     </a>
  </div>
  <div class="pull-left">
     ${h.form(h.url('delete_users_group', id=user_group_id))}
       <button id="${'remove_group_%s' % user_group_id}" name="${'remove_user_%s' % repo_name}" class="btn btn-default btn-xs" title="${_('Delete')}"
           onclick="return confirm('${_('Confirm to delete this user group: %s') % user_group_name}');">
         <i class="icon-trashcan"></i>${_('Delete')}
       </button>
     ${h.end_form()}
  </div>
 </%def>
 <%def name="group_name_html(group_name,name)">
   <div class="dt_repo">
     <i class="icon-folder"></i>
     <a href="${h.url('repos_group_home',group_name=group_name)}">${name}</a>
   </div>
 </%def>
 <%def name="repo_group_actions(repo_group_id, repo_group_name, gr_count)">
  <div class="pull-left">
     <a href="${h.url('edit_repo_group',group_name=repo_group_name)}" title="${_('Edit')}" class="btn btn-default btn-xs">
       <i class="icon-pencil"></i>${_('Edit')}
     </a>
  </div>
  <div class="pull-left">
     ${h.form(h.url('delete_repo_group', group_name=repo_group_name))}
       <button id="${'remove_%s' % repo_group_name}" name="${'remove_%s' % repo_group_name}" class="btn btn-default btn-xs" title="${_('Delete')}"
           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)}')">
         <i class="icon-trashcan"></i>${_('Delete')}
       </button>
     ${h.end_form()}
  </div>
 </%def>
 <%def name="user_name(user_id, username)">
     ${h.link_to(username,h.url('edit_user', id=user_id))}
 </%def>
 <%def name="repo_group_name(repo_group_name, children_groups)">
   <div class="text-nowrap">
   <a href="${h.url('repos_group_home',group_name=repo_group_name)}">
     <i class="icon-folder" title="${_('Repository group')}"></i>${h.literal(' &raquo; '.join(children_groups))}</a>
   </div>
 </%def>

0 comments (0 inline, 0 general)