CSS: Cards: ellipsis on titles + mixin

Author: evoluteur

demo/index.html

@@ -85,7 +85,7 @@ <h1 id="title">Demos</h1>
             <p>The data for these demos is stored in your browser's local storage
                 (using <a href="https://github.com/jeromegn/Backbone.localStorage" target="bbls">Backbone.localStorage</a>) but Evolutility can be configured for a REST API.
 
-                Another project <a href="https://github.com/evoluteur/evolutility-server">Evolutility-Server</a> is in progress and will provide server-side a metadata-driven REST API for Evolutility (using Node.js, Express.js and PostgreSQL). 
+                Another project <a href="https://github.com/evoluteur/evolutility-server">Evolutility-Server</a> is in progress and will provide metadata-driven RESTful API for Evolutility (using Node.js, Express.js and PostgreSQL). 
               </p>
           </div>
     </div>

dist/css/evolutility.css

@@ -161,8 +161,14 @@
 .evo-plist input[type="date"] {
   max-width: 160px;
 }
+.evo-plist input[type="number"] {
+  min-width: 100px;
+}
 .evo-plist input[type="text"],
-.evo-plist textarea {
+.evo-plist input textarea {
+  min-width: 120px;
+}
+.evo-plist select {
   min-width: 120px;
 }
 .evo-plist .table {
@@ -204,6 +210,9 @@
   padding-left: 10px !important;
   margin-bottom: 6px;
 }
+.evol-fld input[type="checkbox"] {
+  font-size: 2em;
+}
 .evol-fld > .evo-rdonly > img {
   position: relative;
   top: -2px;
@@ -432,6 +441,7 @@ label {
 }
 .evol-many-list > div {
   overflow-x: auto;
+  overflow-y: hidden;
 }
 .evol-many-list > div > .table {
   margin-bottom: 0;
@@ -467,9 +477,9 @@ label {
   display: inline !important;
 }
 .evol-many-list > div > .table .evol-ellipsis {
+  white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  white-space: nowrap;
   max-width: 120px;
 }
 .evol-many-list .glyphicon.evol-last-sort {
@@ -544,6 +554,11 @@ table {
   -webkit-border-radius: 10px;
   overflow: auto;
 }
+.evol-cards-body > .panel > div > h4 {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
 .evol-cards-body > .panel > div > label {
   vertical-align: top;
 }
@@ -629,11 +644,6 @@ text.label {
   text-align: center;
   padding: 10px 20px 30px;
 }
-/*
-.evo-chart-table{
-	overflow-y: auto;
-}
-*/
 .evol-xpt {
   margin-bottom: 10px;
 }

dist/css/evolutility.min.css

@@ -17,10 +17,15 @@
     .border-radius(10px);
     overflow: auto;
 
-    >div>label{
-      vertical-align: top;
-      //text-align: right;
-      //min-width:80px;
+    >div {
+      >h4{
+        .ellipsis()
+      }
+      >label{
+        vertical-align: top;
+        //text-align: right;
+        //min-width:80px;
+      }
     }
   }
   .evol-c-center{

less/many-cards.less

@@ -53,9 +53,7 @@
 
       }
       .evol-ellipsis{
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
+        .ellipsis();
         max-width: 120px;
       }
     }

less/many.less

@@ -138,9 +138,7 @@
 }
 
 .evol-ellipsis {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
+  .ellipsis();
 }
 .evol-title-toggle{
   cursor: pointer;

less/one.less

@@ -37,6 +37,11 @@
 @color-text-footer: silver;
 
 // mixins
+.ellipsis(){
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
 .border-radius(@r){
 	border-radius: @r;
 	-moz-border-radius: @r;