Topic bootstrap: CSS columns and some theme links.

diff --git a/examples/htdocs/topic-bootstrap.css b/examples/htdocs/topic-bootstrap.css
index 30d733e..303942a 100644 (file)
--- a/examples/htdocs/topic-bootstrap.css
+++ b/examples/htdocs/topic-bootstrap.css
@@ -90,3 +90,13 @@ b, strong {
   box-shadow: none;
   -webkit-box-shadow: none;
 }
+@media screen and (min-width:700px) {
+  .multicol {
+    column-count: 2;
+    column-gap: 20px;
+    -moz-column-count: 2;
+    -moz-column-gap: 20px;
+    -webkit-column-count: 2;
+    -webkit-column-gap: 20px;
+  }
+}

diff --git a/examples/htdocs/topic-bootstrap.html b/examples/htdocs/topic-bootstrap.html
index 1464408..7c11553 100644 (file)
--- a/examples/htdocs/topic-bootstrap.html
+++ b/examples/htdocs/topic-bootstrap.html
@@ -8,6 +8,10 @@
   <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
   <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
   <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
+  <!-- http://www.bootstrapcdn.com/#bootswatch_tab has some themes that look mediumly okay -->
+  <!-- <link href="//maxcdn.bootstrapcdn.com/bootswatch/3.1.1/cyborg/bootstrap.min.css" rel="stylesheet"> -->
+  <!-- <link href="//maxcdn.bootstrapcdn.com/bootswatch/3.1.1/amelia/bootstrap.min.css" rel="stylesheet"> -->
+  <!-- <link href="//maxcdn.bootstrapcdn.com/bootswatch/3.1.1/united/bootstrap.min.css" rel="stylesheet"> -->
   <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
   <script type="text/javascript">
     var mkws_config = { service_proxy_auth: "//mkws.indexdata.com/service-proxy-credoauth" }
@@ -62,7 +66,7 @@
              data-mkws-config='{"paragraphs":1}'></div>
       </div>
       <!-- related topics -->
-      <div class="col-lg-offset-1 col-lg-3 col-md-4"><div class="panel panel-default">
+      <div class="col-md-offset-1 col-md-3"><div class="panel panel-default">
         <div class="panel-heading title">
           <h3 class="panel-title">Related Topics</h3>
         </div>
@@ -85,40 +89,38 @@
 
     <!-- sources -->
     <div class="row">
-      <div class="col-lg-6 col-md-8 col-sm-6">
-        <div class="col-md-6 col-sm-12"><div class="panel panel-default">
+        <div class="col-md-4 col-sm-6"><div class="panel panel-default">
           <div class="panel-heading title">
             <h3 class="panel-title">News</h3>
           </div>
           <div class="panel-body mkwsRecords mkwsTeam_news" autosearch="!param!q"
                data-mkws-config='{"targetfilter":"categories=news",
-                                  "perpage":10}'></div>
+                                  "perpage":7}'></div>
         </div></div>
-        <div class="col-md-6 col-sm-12"><div class="panel panel-default">
+        <div class="col-md-4 col-sm-6"><div class="panel panel-default">
           <div class="panel-heading title">
             <h3 class="panel-title">Articles</h3>
           </div>
           <div class="panel-body mkwsRecords mkwsTeam_articles" autosearch="!param!q"
                data-mkws-config='{"targetfilter":"categories=articles",
-                                  "perpage":10}'></div>
+                                  "perpage":7}'></div>
         </div></div>
-        <div class="col-md-6 col-sm-12"><div class="panel panel-default">
+        <div class="col-md-4 col-sm-6"><div class="panel panel-default">
           <div class="panel-heading title">
             <h3 class="panel-title">Books</h3>
           </div>
           <div class="panel-body mkwsRecords mkwsTeam_books" autosearch="!param!q"
                data-mkws-config='{"targetfilter":"categories=books",
-                                  "perpage":10}'></div>
+                                  "perpage":7}'></div>
         </div></div>
-      </div>
-      <div class="col-lg-6 col-md-4 col-sm-6">
-          <div class="panel panel-default">
+    </div>
+    <div class="row">
+        <div class="col-md-12"><div class="panel panel-default">
           <div class="panel-heading title">
             <h3 class="panel-title">Results from all targets</h3>
           </div>
-          <div class="panel-body mkwsRecords mkwsTeam_main"></div>
-        </div>
-      </div>
+          <div class="panel-body multicol mkwsRecords mkwsTeam_main"></div>
+        </div></div>
     </div>
   </div>
 </body>