updated to use bootstrap 4 classes, cleaned up layout

applications/welcome/controllers/appadmin.py

@@ -224,15 +224,15 @@ def select():
     session.last_orderby = orderby
     session.last_query = request.vars.query
     form = FORM(TABLE(TR(T('Query:'), '', INPUT(_style='width:400px',
-                _name='query', _value=request.vars.query or '',
+                _name='query', _value=request.vars.query or '', _class="form-control",
                 requires=IS_NOT_EMPTY(
                     error_message=T("Cannot be empty")))), TR(T('Update:'),
                 INPUT(_name='update_check', _type='checkbox',
                 value=False), INPUT(_style='width:400px',
                 _name='update_fields', _value=request.vars.update_fields
-                                    or '')), TR(T('Delete:'), INPUT(_name='delete_check',
+                                    or '', _class="form-control")), TR(T('Delete:'), INPUT(_name='delete_check',
                 _class='delete', _type='checkbox', value=False), ''),
-                TR('', '', INPUT(_type='submit', _value=T('submit')))),
+                TR('', '', INPUT(_type='submit', _value=T('submit'), _class="btn btn-primary"))),
                 _action=URL(r=request, args=request.args))
 
     tb = None
@@ -274,7 +274,7 @@ def select():
         formcsv = FORM(str(T('or import from csv file')) + " ",
                        INPUT(_type='file', _name='csvfile'),
                        INPUT(_type='hidden', _value=csv_table, _name='table'),
-                       INPUT(_type='submit', _value=T('import')))
+                       INPUT(_type='submit', _value=T('import'), _class="btn btn-primary"))
     else:
         formcsv = None
     if formcsv and formcsv.process().accepted:

applications/welcome/views/appadmin.html

@@ -13,12 +13,12 @@
 <h2>{{=T("Available Databases and Tables")}}</h2>
   {{if not databases:}}{{=T("No databases in this application")}}{{pass}}
   <ul class="nav nav-tabs" id="myTab">
-  <li class="active" ><a href="#alltables" data-toggle="tab">Tables</a></li>
+    <li class="nav-item"><a href="#alltables" data-toggle="tab" class="nav-link active">Tables</a></li>
-  <li><a href="#hooks" data-toggle="tab">Hooks</a></li>
+    <li class="nav-item"><a href="#hooks" data-toggle="tab" class="nav-link">Hooks</a></li>
   </ul>
   <div class="tab-content">
       <div class="tab-pane active" id="alltables">
-        <table class="table">
+        <table class="table table-striped">
           {{for db in sorted(databases):}}
             {{for table in databases[db].tables:}}
               {{qry='%s.%s.id>0'%(db,table)}}
@@ -37,10 +37,10 @@
               {{pass}}
           <tr>
             <th style="font-size: 1.75em;">
-              {{=A("%s.%s" % (db,table),_href=URL('select',args=[db],vars=dict(query=qry)))}}
+              &raquo; {{=A("%s.%s" % (db,table),_href=URL('select',args=[db],vars=dict(query=qry)))}}
             </th>
             <td>
-              {{=A(str(T('New Record')),_href=URL('insert',args=[db,table]),_class="btn btn-default")}}
+              {{=A(str(T('New Record')),_href=URL('insert',args=[db,table]),_class="btn btn-primary")}}
             </td>
           </tr>
           {{pass}}
@@ -61,28 +61,31 @@
   </pre>
   {{pass}}
   {{if table:}}
-  {{=A(str(T('New Record')),_href=URL('insert',args=[request.args[0],table]),_class="btn btn-default")}}<br/><br/>
+  {{=A(str(T('New Record')),_href=URL('insert',args=[request.args[0],table]),_class="btn btn-primary", _role="button")}}<br/><br/>
+  <hr />
     <h3>{{=T("Rows in Table")}}</h3><br/>
    {{else:}}
     <h3>{{=T("Rows selected")}}</h3><br/>
    {{pass}}
    {{=form}}
-   <p>{{=T('The "query" is a condition like "db.table1.field1==\'value\'". Something like "db.table1.field1==db.table2.field2" results in a SQL JOIN.')}}<br/>
+   <p class="text-muted">{{=T('The "query" is a condition like "db.table1.field1==\'value\'". Something like "db.table1.field1==db.table2.field2" results in a SQL JOIN.')}}<br/>
       {{=T('Use (...)&(...) for AND, (...)|(...) for OR, and ~(...)  for NOT to build more complex queries.')}}<br/>
       {{=T('"update" is an optional expression like "field1=\'newvalue\'". You cannot update or delete the results of a JOIN')}}</p>
     <br/><br/>
     <h4>{{=T("%s selected", nrows)}}</h4>
-    {{if start>0:}}{{=A(T('previous %s rows') % step,_href=URL('select',args=request.args[0],vars=dict(start=start-step)),_class="btn btn-default")}}{{pass}}
+    {{if start>0:}}{{=A(T('previous %s rows') % step,_href=URL('select',args=request.args[0],vars=dict(start=start-step)),_class="btn btn-primary")}}{{pass}}
-    {{if stop<nrows:}}{{=A(T('next %s rows') % step,_href=URL('select',args=request.args[0],vars=dict(start=start+step)),_class="btn btn-default")}}{{pass}}
+    {{if stop<nrows:}}{{=A(T('next %s rows') % step,_href=URL('select',args=request.args[0],vars=dict(start=start+step)),_class="btn btn-primary")}}{{pass}}
     {{if rows:}}
        <div style="overflow:auto; width:80%;">
        {{linkto = lambda f, t, r: URL('update', args=[request.args[0], r, f]) if f else "#"}}
        {{upload=URL('download',args=request.args[0])}}
-       {{=SQLTABLE(rows,linkto,upload,orderby=True,_class='sortable')}}
+       {{=SQLTABLE(rows,linkto,upload,orderby=True,_class='table table-striped table-bordered sortable')}}
        </div>
     {{pass}}
-    <br/><br/><h3>{{=T("Import/Export")}}</h3><br/>
+    <br/><br/>
-    <a href="{{=URL('csv',args=request.args[0],vars=dict(query=query))}}" class="btn btn-default">{{=T("export as csv file")}}</a>
+    <hr />
+    <h3>{{=T("Import/Export")}}</h3><br/>
+    <a href="{{=URL('csv',args=request.args[0],vars=dict(query=query))}}" class="btn btn-primary">{{=T("export as csv file")}}</a>
   {{=formcsv or ''}}
 
 {{elif request.function=='insert':}}