changeset 6500:78f08233a28c

style: introduce Bootstrap list-group and list-group-item Based on work by Dominik Ruf.
author Mads Kiilerich <mads@kiilerich.com>
date Thu, 16 Feb 2017 01:54:36 +0100
parents 43a86579f8fa
children 97ec8cf362c3
files kallithea/public/css/style.css kallithea/templates/admin/notifications/notifications_data.html kallithea/templates/files/files_source.html kallithea/templates/summary/summary.html
diffstat 4 files changed, 20 insertions(+), 22 deletions(-) [+]
line wrap: on
line diff
--- a/kallithea/public/css/style.css	Thu Feb 16 01:48:31 2017 +0100
+++ b/kallithea/public/css/style.css	Thu Feb 16 01:54:36 2017 +0100
@@ -1150,19 +1150,17 @@
     min-height: 240px;
 }
 
-#summary-menu-stats {
+ul#summary-menu-stats {
     float: left;
     width: 180px;
     position: absolute;
     top: 0;
     right: 0;
-}
-
-#summary-menu-stats ul {
     display: block;
     background-color: #f9f9f9;
     border: 1px solid #d1d1d1;
     border-radius: 4px;
+    margin: 10px 20px;
 }
 
 #content #summary-menu-stats li {
--- a/kallithea/templates/admin/notifications/notifications_data.html	Thu Feb 16 01:48:31 2017 +0100
+++ b/kallithea/templates/admin/notifications/notifications_data.html	Thu Feb 16 01:54:36 2017 +0100
@@ -4,20 +4,20 @@
 unread = lambda n:{False:'unread'}.get(n)
 %>
 
-<div class="notification-list notification-table">
+<div class="notification-list notification-table list-group">
 %for notification in c.notifications:
-  <div id="notification_${notification.notification.notification_id}" class="container ${unread(notification.read)}">
-    <div class="notification-header">
+  <div id="notification_${notification.notification.notification_id}" class="list-group-item ${unread(notification.read)}">
+    <div>
       ${h.gravatar_div(notification.notification.created_by_user.email, size=24)}
       <span class="desc ${unread(notification.read)}">
         <a href="${url('notification', notification_id=notification.notification.notification_id)}">${notification.notification.description}</a>
       </span>
       <span class="delete-notifications">
-        <span id="${notification.notification.notification_id}" class="delete-notification"><i class="icon-minus-circled" style="color: #b94a48; padding: 2px;"></i></span>
+        <span id="${notification.notification.notification_id}" class="delete-notification"><i class="btn icon-minus-circled"></i></span>
       </span>
       %if not notification.read:
       <span class="read-notifications">
-        <span id="${notification.notification.notification_id}" class="read-notification"><i class="icon-ok" style="color: #4CBB17; padding: 2px;"></i></span>
+        <span id="${notification.notification.notification_id}" class="read-notification"><i class="btn icon-ok"></i></span>
       </span>
       %endif
     </div>
--- a/kallithea/templates/files/files_source.html	Thu Feb 16 01:48:31 2017 +0100
+++ b/kallithea/templates/files/files_source.html	Thu Feb 16 01:54:36 2017 +0100
@@ -54,11 +54,12 @@
         </div>
         <div class="commit">${h.urlify_text(c.changeset.message,c.repo_name)}</div>
     </div>
-    <div class="code-body">
+    <ul class="list-group">
+      <li class="list-group-item">
       %if c.file.is_browser_compatible_image():
         <img src="${h.url('files_raw_home',repo_name=c.repo_name,revision=c.changeset.raw_id,f_path=c.f_path)}" class="img-preview"/>
       %elif c.file.is_binary:
-        <div style="padding:5px">
+        <div>
           ${_('Binary file (%s)') % c.file.mimetype}
         </div>
       %else:
@@ -79,7 +80,8 @@
             </h4>
         %endif
       %endif
-    </div>
+      </li>
+    </ul>
 </div>
 
 <script>
--- a/kallithea/templates/summary/summary.html	Thu Feb 16 01:48:31 2017 +0100
+++ b/kallithea/templates/summary/summary.html	Thu Feb 16 01:54:36 2017 +0100
@@ -120,21 +120,20 @@
               </div>
             </div>
         </div>
-        <div id="summary-menu-stats">
-          <ul>
-            <li>
+        <ul id="summary-menu-stats" class="list-group">
+            <li class="list-group-item">
                <a title="${_('Owner')} ${c.db_repo.owner.email}">
                 <i class="icon-user"></i> ${c.db_repo.owner.username}
                 ${h.gravatar_div(c.db_repo.owner.email, size=18, div_style="float: right; margin: 0px 0px 0px 0px", div_title=c.db_repo.owner.full_name)}
               </a>
             </li>
-            <li>
+            <li class="list-group-item">
                <a title="${_('Followers')}" href="${h.url('repo_followers_home',repo_name=c.repo_name)}">
                 <i class="icon-heart"></i> ${_('Followers')}
                 <span class="badge" id="current_followers_count">${c.repository_followers}</span>
               </a>
             </li>
-            <li>
+            <li class="list-group-item">
               <a title="${_('Forks')}" href="${h.url('repo_forks_home',repo_name=c.repo_name)}">
                 <i class="icon-fork"></i> ${_('Forks')}
                 <span class="badge">${c.repository_forks}</span>
@@ -142,13 +141,13 @@
             </li>
 
             %if request.authuser.username != 'default':
-            <li class="repo_size clearfix">
+            <li class="list-group-item clearfix">
               <a href="#" onclick="javascript:showRepoSize('repo_size_2','${c.db_repo.repo_name}')"><i class="icon-ruler"></i> ${_('Repository Size')}</a>
               <span  class="stats-bullet" id="repo_size_2"></span>
             </li>
             %endif
 
-            <li>
+            <li class="list-group-item">
             %if request.authuser.username != 'default':
               <a href="${h.url('atom_feed_home',repo_name=c.db_repo.repo_name,api_key=request.authuser.api_key)}"><i class="icon-rss-squared"></i> ${_('Feed')}</a>
             %else:
@@ -157,14 +156,13 @@
             </li>
 
             %if c.show_stats:
-            <li>
+            <li class="list-group-item">
               <a title="${_('Statistics')}" href="${h.url('repo_stats_home',repo_name=c.repo_name)}">
                 <i class="icon-graph"></i> ${_('Statistics')}
               </a>
             </li>
             %endif
-          </ul>
-        </div>
+        </ul>
     </div>
 </div>