The Reference Universe widget now specifies to use the correct target.

[mkws-moved-to-github.git] / examples / htdocs / topic.css

diff --git a/examples/htdocs/topic.css b/examples/htdocs/topic.css
index 303942a..9e0e181 100644 (file)
--- a/examples/htdocs/topic.css
+++ b/examples/htdocs/topic.css
@@ -37,23 +37,30 @@ b, strong {
   padding: 10px 15px; 
 }
 
-.mkwsFacetTitle {
+.mkws-facet-title {
   font-style: italic;
   font-weight: 400;
 }
-  .mkwsTerm {
+  .mkws-term {
     padding: .1em 0;
   }
-  .mkwsTerm a {
+  .mkws-term a {
     padding-right: .5em; 
     font-weight: 400;
   }
 
-.mkwsSummary {
-  padding: .5em 0;
+.mkws-summary {
+  margin: .5em 0;
   line-height: 1.35;
+  min-height: 60px;
 }
-.mkwsSummary:last-child {
+.articles .mkws-summary, .alltargets .mkws-summary {
+  min-height: 0;
+}
+.articles .mkws-field-thumb, .alltargets .mkws-field-thumb {
+  display: none;
+}
+.mkws-summary:last-child {
   padding-bottom: 0;
 }
   
@@ -63,24 +70,24 @@ b, strong {
   box-shadow: none;
   color: black;
 }  
-  .jumbotron .mkwsSummary {
+  .jumbotron .mkws-summary {
     line-height: 1.5;  
   }
   .jumbotron p{
     font-size: 150%; 
   }
-  .mkwsCredit {
+  .mkws-credit {
     font-size: 125% !important;
     font-style: italic;
   }
   
-.mkwsGoogleImage .mkwsSummary {
+.mkws-google-image .mkws-summary {
   padding: 0;
   font-weight: 400;
 }
-  .mkwsGoogleImage img {
+  .mkws-google-image img {
     max-width: 100%;
-    max-height: 200px;
+    max-height: 180px;
     padding: 1em 0 .5em;
   }
 .list-group-item {
@@ -90,6 +97,25 @@ b, strong {
   box-shadow: none;
   -webkit-box-shadow: none;
 }
+
+/* Fields */
+.mkws-field-thumb {
+  height: 60px;
+  width: 80px;
+  overflow: hidden;
+  margin-right: 1em;
+  float: left;
+}
+.mkws-field-thumb > img {
+  height: 60px;
+  max-width: 80px;
+} 
+.mkws-field-description {
+  overflow: hidden; 
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 @media screen and (min-width:700px) {
   .multicol {
     column-count: 2;
@@ -100,3 +126,13 @@ b, strong {
     -webkit-column-gap: 20px;
   }
 }
+@media screen and (min-width:900px) {
+  .multicol {
+    column-count: 3;
+    column-gap: 20px;
+    -moz-column-count: 3;
+    -moz-column-gap: 20px;
+    -webkit-column-count: 3;
+    -webkit-column-gap: 20px;
+  }
+}