UI improvements (same colors of buttons, etc.)

Changed Editable default value

cps/static/css/style.css

@@ -51,7 +51,22 @@ body h2 {
   color:#444;
 }
 
-a { color: #45b29d; }
+a, .danger, .editable-empty, .editable-empty:hover { color: #45b29d; }
+
+.danger:hover { color: #23527c; }
+
+.btn-default a { color: #444; }
+
+.btn-default a:hover {
+    color: #45b29d;
+    text-decoration: None;
+}
+
+.btn-default:hover {
+    color: #45b29d;
+}
+
+.editable-click, a.editable-click, a.editable-click:hover  { border-bottom: None; }
 
 .navigation .nav-head {
   text-transform: uppercase;
@@ -63,6 +78,7 @@ a { color: #45b29d; }
   border-top: 1px solid #ccc;
   padding-top: 20px;
 }
+
 .navigation li a {
   color: #444;
   text-decoration: none;

cps/static/js/table.js

@@ -250,7 +250,7 @@ function RestrictionActions (value, row) {
 /* Function for deleting books */
 function EbookActions (value, row) {
     return [
-        "<div class='danger remove' data-toggle='modal' data-target=\"#deleteModal\" data-delete-id=\"" + row.id + "\" title=\"Remove\">",
+        "<div class=\"danger remove\" data-toggle=\"modal\" data-target=\"#deleteModal\" data-delete-id=\"" + row.id + "\" title=\"Remove\">",
         "<i class=\"glyphicon glyphicon-trash\"></i>",
         "</div>"
     ].join("");

cps/templates/admin.html

@@ -155,8 +155,8 @@
       </table>
 
       <div class="hidden" id="update_error"> <span>{{update_error}}</span></div>
-      <div class="btn btn-default" id="check_for_update">{{_('Check for Update')}}</div>
+      <div class="btn btn-primary" id="check_for_update">{{_('Check for Update')}}</div>
-      <div class="btn btn-default hidden" id="perform_update" data-toggle="modal" data-target="#StatusDialog">{{_('Perform Update')}}</div>
+      <div class="btn btn-primary hidden" id="perform_update" data-toggle="modal" data-target="#StatusDialog">{{_('Perform Update')}}</div>
     </div>
   </div>
 </div>

cps/templates/book_table.html

@@ -20,7 +20,9 @@
            data-show-search-button="false"
            data-search-on-enter-key="true"
            data-checkbox-header="false"
-           data-maintain-meta-data="true">
+           data-maintain-meta-data="true"
+           data-editable-emptytext="<span class='glyphicon glyphicon-plus'></span>">
+
       <thead>
         <tr>
             <!--th data-field="title" id="title" data-editable-type="text" data-editable-url="{{ url_for('web.edit_list_book')}}" data-editable="true" data-editable-title="{{_('Enter title')}}"></th-->
@@ -34,7 +36,7 @@
             <th data-field="authors" id="authors" data-sortable="true" {% if g.user.role_edit() %}data-editable-type="text" data-editable-url="{{ url_for('web.edit_list_book')}}" data-editable="true" data-editable-title="{{_('Enter title')}}"{% endif %}>Authors</th>
             <th data-field="tags" id="tags" data-sortable="true" {% if g.user.role_edit() %}data-editable-type="text" data-editable-url="{{ url_for('web.edit_list_book')}}" data-editable="true" data-editable-title="{{_('Enter title')}}"{% endif %}>Tags</th>
             <th data-field="series" id="series" data-sortable="true" {% if g.user.role_edit() %}data-editable-type="text" data-editable-url="{{ url_for('web.edit_list_book')}}" data-editable="true" data-editable-title="{{_('Enter title')}}"{% endif %}>Series</th>
-            <th data-field="series_index" id="series_index" data-sortable="true" >Series Index</th>
+            <th data-field="series_index" id="series_index" data-sortable="true" {% if g.user.role_edit() %} data-editable-type="number" data-editable-placeholder="1" data-editable-step="0.01" data-editable-min="0" data-editable-url="{{ url_for('web.edit_list_book')}}" data-editable="true" data-editable-title="{{_('Enter title')}}"{% endif %}>Series Index</th>
             <th data-field="languages" id="languages" data-sortable="true" {% if g.user.role_edit() %}data-editable-type="text" data-editable-url="{{ url_for('web.edit_list_book')}}" data-editable="true" data-editable-title="{{_('Enter title')}}"{% endif %}>Language</th>
             <th data-field="pubdate" id="pubdate" data-sortable="true">Publishing Date</th>
             <th data-field="publishers" id="publishers" data-sortable="true" {% if g.user.role_edit() %}data-editable-type="text" data-editable-url="{{ url_for('web.edit_list_book')}}" data-editable="true" data-editable-title="{{_('Enter title')}}"{% endif %}>Publishers</th>

cps/templates/detail.html

@@ -273,7 +273,7 @@
       {% if g.user.role_edit() %}
       <div class="btn-toolbar" role="toolbar">
         <div class="btn-group" role="group" aria-label="Edit/Delete book">
-          <a href="{{ url_for('editbook.edit_book', book_id=entry.id) }}" class="btn btn-sm btn-warning" id="edit_book" role="button"><span class="glyphicon glyphicon-edit"></span> {{_('Edit Metadata')}}</a>
+          <a href="{{ url_for('editbook.edit_book', book_id=entry.id) }}" class="btn btn-sm btn-primary" id="edit_book" role="button"><span class="glyphicon glyphicon-edit"></span> {{_('Edit Metadata')}}</a>
         </div>
       </div>
       {% endif %}

cps/templates/layout.html

@@ -155,29 +155,28 @@
           {% if pagination and (pagination.has_next or pagination.has_prev) %}
             <div class="pagination">
               {% if pagination.has_prev %}
-              <a class="previous" href="{{ (pagination.page - 1)|url_for_other_page
+              <li class="page-item page-next"><a class="page-link" aria-label="next page" href="{{ (pagination.page - 1)|url_for_other_page
-                }}">&laquo; {{_('Previous')}}</a>
+                }}">&laquo; {{_('Previous')}}</a></li>
               {% endif %}
             {% for page in pagination.iter_pages() %}
               {% if page %}
                 {% if page != pagination.page %}
-                  <a href="{{ (page)|url_for_other_page }}">{{ page }}</a>
+                  <li class="page-item"><a class="page-link" aria-label="to page {{ page }}" href="{{ (page)|url_for_other_page }}">{{ page }}</a></li>
                 {% else %}
-                  <strong>{{ page }}</strong>
+                  <li class="page-item active"><a class="page-link" aria-label="to page {{ page }}" href="{{ (page)|url_for_other_page }}">{{ page }}</a></li>
                 {% endif %}
               {% else %}
-                <span class="ellipsis">…</span>
+                <li class="page-item page-last-separator disabled"><a class="page-link" aria-label="">…</a></li>
               {% endif %}
             {% endfor %}
             {% if pagination.has_next %}
-              <a class="next" href="{{ (pagination.page + 1)|url_for_other_page
+              <li class="page-item page-next"><a class="page-link" aria-label="next page" href="{{ (pagination.page + 1)|url_for_other_page
-                }}">{{_('Next')}} &raquo;</a>
+                }}">{{_('Next')}} &raquo;</a></li>
             {% endif %}
             </div>
           {% endif %}
       </div>
     </div>
-    </div>
     <div class="modal fade" id="bookDetailsModal" tabindex="-1" role="dialog" aria-labelledby="bookDetailsModalLabel">
       <div class="modal-dialog modal-lg" role="document">
         <div class="modal-content">
@@ -196,7 +195,6 @@
 
 
     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
-    <!--script src="https://code.jquery.com/jquery.js"></script-->
     <script src="{{ url_for('static', filename='js/libs/jquery.min.js') }}"></script>
     <!-- Include all compiled plugins (below), or include individual files as needed -->
     <script src="{{ url_for('static', filename='js/libs/bootstrap.min.js') }}"></script>