drg_cms 0.6.1.0 → 0.6.1.6

data/app/assets/stylesheets/drg_cms/drg_cms.css

@@ -23,7 +23,43 @@
 #++
 */
 
-@import url('https://fonts.googleapis.com/css2?family=Exo:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet"');
+@font-face {
+  font-family: DrgSans;
+  font-style: normal;
+  font-weight: 300;
+  src: url('ibm-plex-sans-300.woff2') format('woff2')
+}
+@font-face {
+  font-family: DrgSans;
+  font-style: normal;
+  font-weight: 400;
+  src: url('ibm-plex-sans-400.woff2') format('woff2')
+}
+@font-face {
+  font-family: DrgSans;
+  font-style: normal;
+  font-weight: 500;
+  src: url('ibm-plex-sans-500.woff2') format('woff2')
+}
+@font-face {
+  font-family: DrgSans;
+  font-style: normal;
+  font-weight: 600;
+  src: url('ibm-plex-sans-600.woff2') format('woff2')
+}
+@font-face {
+  font-family: DrgSans;
+  font-style: normal;
+  font-weight: 700;
+  src: url('ibm-plex-sans-700.woff2') format('woff2')
+}
+
+@font-face {
+  font-family: DrgSans;
+  font-style: italic;
+  font-weight: 400;
+  src: url('ibm-plex-sans-italic.woff2') format('woff2')
+}
 
 /* Web reset. Countributed by
 /* http://meyerweb.com/eric/tools/css/reset/ 
@@ -78,8 +114,8 @@ table {
 /* END */
 
 body {
-font-family: Exo,arial,sans-serif;
-font-size: 14px;
+font-family: DrgSans,arial,sans-serif;
+font-size: 15px;
 margin: 0;
 vertical-align: middle;
 color: #000;
@@ -87,7 +123,7 @@ font-weight: 400;
 }
 
 button {
-font-family: Exo,arial,sans-serif;
+font-family: DrgSans,arial,sans-serif;
 }
 
 
@@ -97,7 +133,7 @@ padding: 6px 4px;
 margin-left: 1px;
 border: 1px dashed #888;;
 border-radius: 2px;
-font: 14px Exo,arial,sans-serif;
+font: 15px DrgSans,arial,sans-serif;
 max-width: 100%;
 vertical-align: middle;
 }
@@ -175,12 +211,6 @@ img { vertical-align:bottom; }
   padding: 7px;
 }
 
-.dc-link a:hover, .dc-animate a:hover, .dc-result a:hover  { 
-  background: #f8f8f8;
-  transition: 0.3s;
-  color: #000;
-}
-
 a.dc-animate:hover { color: #000; background: transparent;}
 
 .dc-link a img { border: none; }
@@ -188,7 +218,7 @@ a.dc-animate:hover { color: #000; background: transparent;}
 .dc-image-preview img { max-height: 2rem; padding-left: 0.5rem;}
 .dc-image-preview img:hover { cursor: zoom-in;}
 
-.text-with-select { width: 24px; }
+.text-with-select { width: 20px; }
 
 .no-borders {
   padding:  0;
@@ -206,12 +236,11 @@ width: 99.9%;
 padding:  0;
 border-spacing:  0;
 border-radius: 1px;  
-/*background-color: #f9f9f9;*/
 }
 
 .dc-result i { 
 padding: 2px;
-font-size: 14px;
+font-size: 15px;
 vertical-align: initial;
 }
 
@@ -228,7 +257,6 @@ padding: 0;
 
 .dc-result-header {
   display: flex;
-  /* background: linear-gradient(to bottom, #eee 0%, #e2e2e2 100%); */
 }
 .dc-result-data {
   display: flex;
@@ -253,12 +281,6 @@ padding: 0;
 
 .dc-result-header .spacer, .dc-result-data .spacer {
   width: 2px;
-  /*
-  font-size: 1.5em;
-  margin: 0  0;
-  padding: 4px  0;
-  resize: both;
-/*  border-left: 1px solid #ccc;*/
 }
 
 .dc-result-header a:link, .dc-result-header a:visited {
@@ -276,6 +298,10 @@ padding: 0;
   align-items: center;
 }
 
+.dc-result-data .td:last-child {
+  flex-grow: 1;
+}
+
 .dc-result-data .actions, .dc-result-header .actions {
   padding-right: 4px;
   display: flex;
@@ -283,11 +309,14 @@ padding: 0;
   justify-content: center;  
   white-space: nowrap;
 }
-
 .dc-result-header .actions {
   background-color: #666;
 }
 
+.dc-result-data.dc-even.dc-checked, .dc-result-data.dc-odd.dc-checked {
+  background-color: #dbebff;
+  background-color: rgba(76,154,255, 0.6);
+}
 
 .dc-result-data .dc-link, .dc-result-data .dc-link-ajax {
   background: none;
@@ -318,6 +347,17 @@ padding: 0;
   background-color: transparent;
 }
 
+.dc-check {
+  padding-right: 4px;
+}
+
+.dc-result-header .dc-check-all {
+  font-size: 1.2em;
+  margin-left: -1rem;
+  background-color: white;
+  padding: 6px 3px;
+}
+
 .dc-menu {
 padding: 4px 0;
 display: inline-table;
@@ -328,16 +368,15 @@ display: inline-table;
   margin-right: 3px;
 }
 
-
 #data-fields {margin: 5px;}
 
 .dc-link {
-font-weight: 600;
-color: #666;
-text-align: center;
-border-radius: 3px;
-background: transparent linear-gradient(to bottom, #fff 0%, #e2e2e2 100%);
-border: 1px solid #ddd;
+  font-weight: 600;
+  color: #666;
+  text-align: center;
+  border-radius: 3px;
+  background: transparent linear-gradient(to bottom, #fff 0%, #e2e2e2 100%);
+  border: 1px solid #eee;
 }
 
 .dc-link:hover {
@@ -362,13 +401,17 @@ border: 1px solid #ddd;
   font-weight: 600;
   padding: 7px;
   vertical-align: bottom;
-  border: 1px solid #ccc;
+  border: 1px solid #eee;
   border-radius: 3px;
   color: #777;
   text-shadow: 1px 1px #fff;
   background: #ddd !important;
 }
 
+.dc-action-menu li.dc-link.plus-link {
+  padding: 7px 0;
+}
+
 .dc-link-ajax {
   text-align: left;
   font-weight: 600;
@@ -376,31 +419,30 @@ border: 1px solid #ddd;
   border-radius: 3px;
   color: #666;
   background: transparent linear-gradient(to bottom, #fff 0%, #e2e2e2 100%) repeat scroll 0% 0%;
-  border: 1px solid #ddd;
+  border: 1px solid #eee;
 }
 
 .dc-link-ajax.with-link {padding: 7px}
-#cmsform .dc-link-ajax.with-link {padding: 0}
+.cmsform .dc-link-ajax.with-link {padding: 0}
 
 .dc-link-ajax i, .dc-link-no i {
   padding: 1px 3px 0 0;
 }
 
 .dc-link-ajax:hover, .dc-action-submit:hover {
-cursor: pointer;
-background: #eee;
-border: 1px solid #bbb;
+  cursor: pointer;
+  color: #000;
+  background: #eee;
   border: 1px solid rgba(76,154,255, 1);
   box-shadow: inset 0 0 0 1px rgba(76,154,255, 1);
-transition: 0.3s; 
-color: #000;
+  transition: 0.3s;
 }
 
 .dc-link-ajax:hover a { 
-color: #000; 
-background: transparent;
-cursor: pointer; 
-transition: 0.3s; 
+  color: #000;
+  background: transparent;
+  cursor: pointer;
+  transition: 0.3s;
 }
 
 .dc-link-img {
@@ -474,16 +516,12 @@ border: solid 1px #ccc;;
 }
 .dc-link-submit {
   text-align: left;
-  padding: 1px 8px 0.5px; 
-/* Exo  padding: 0 8px; */
-  
   border-radius: 3px;
   background-color: #eee;
   background: transparent linear-gradient(to bottom, #fff 0%, #e2e2e2 100%) repeat scroll 0% 0%;
-  border: 1px solid #ddd;
+  border: 1px solid #eee;
   display: flex;
   align-items: center;
-  
 }
 
 .dc-link-submit .fa {
@@ -509,11 +547,11 @@ border: solid 1px #ccc;;
   border: none;
   color: #666;
   font-weight: 600;
-  padding: 1px 2px 0;
+  padding: 2px 8px 1px;
   border-radius:  0;
   background: transparent;
   line-height: 30px;
-  font-size: 14px;
+  font-size: 15px;
 }
 
 .dc-submit:hover { 
@@ -618,7 +656,7 @@ color: #aaa;
 
 .dc-form-info {
   padding: 8px;
-  background-image: linear-gradient(to bottom, #dff0d8 0px, #c8e5bc 100%);
+  background-image: linear-gradient(to bottom, #dff0d8 0, #c8e5bc 100%);
   background-repeat: repeat-x;
   color: darkgreen;  
   border: 1px solid #b2dba1;  
@@ -628,19 +666,17 @@ color: #aaa;
 
 .dc-form-warning {
   padding: 8px;
-  background-image: linear-gradient(to bottom, #fcf8e3 0px, #f8efc0 100%);
+  background-image: linear-gradient(to bottom, rgba(213, 143, 218, 0.1) 0, rgba(213, 143, 218, 0.5) 100%);
   background-repeat: repeat-x;
-  color: #c84;  
-  border: 1px solid #f5e79e;  
+  color: rgba(102, 51, 153, 1);
+  border: 1px solid rgba(102, 51, 153, 0.3);
   border-radius: 2px;
   margin: 2px 0;
 }
 
 .dc-form-error {
   padding: 8px;
-  background-image: linear-gradient(to bottom, #f2dede 0px, #e7c3c3 100%);
-  background-repeat: repeat-x;
-  background-color: #f2dede;
+  background-image: linear-gradient(to bottom, #f2dede 0, #e7c3c3 100%);
   color: #a94442;
   border: 1px solid #dca7a7;
   border-radius: 2px;
@@ -702,7 +738,7 @@ color: #aaa;
 
 .dc-readonly {
   display: inline-block;
-  font-size: 14px;
+  font-size: 15px;
   font-weight: normal;
   color: #222;
   padding: 6px 4px;
@@ -724,7 +760,6 @@ color: #aaa;
 }
 .dc-form-ul {
 padding: 2px 0;
-margin-top: 6px;
 margin-bottom: -3px;
 }
 
@@ -737,7 +772,7 @@ margin-bottom: -3px;
 
 .dc-spinner {
   float:left;
-  padding: 6px 0;
+  padding: 0.8em 2px 0;
   display: none;
 }
 
@@ -749,15 +784,13 @@ margin-bottom: -3px;
   text-decoration: none;
   text-align: center;
   font-weight: 600;
-  line-height: 1.2rem;
-
-  padding:4px 15px;
-  background: #e8e8e8;
+  line-height: 1.2em;
+  padding: 0.4em 1em;
   background: #666;
-  margin-right: 2px;
+  margin: 0 1px 0 0;
   border-left: 1px solid #ddd;
   border-right: 1px solid #ddd;
-  border-radius: 4px 4px 0  0;
+  border-radius: 4px 4px 0 0;
 }
 
 .dc-form-li:hover, .dc-form-li-selected {
@@ -795,6 +828,9 @@ border-top: 1px solid #ddd;
 display: flex;
 }
 .dc-head .dc-column {
+  white-space: nowrap;
+  overflow: hidden;
+  margin-right: 2px;
 }
 .dc-head .text {
   font-weight: normal;  
@@ -809,7 +845,7 @@ display: flex;
   color: #fff;
   background-color: #000;
   font-weight: bold;
-  font-size: 14px;
+  font-size: 15px;
   box-shadow: 2px 2px 6px #666;
   border-radius: 3px;
 }
@@ -831,6 +867,8 @@ display: flex;
   color: lightcoral;
 }
 
+#menu-hamburger { display: none;}
+
 .dc-handle:before {
   font-family: 'FontAwesome';
   content: '\f0dc\20';
@@ -841,7 +879,7 @@ display: flex;
 }
 
 #cmsedit-div {
-font-family: Exo,Arial, sans-serif;
+font-family: DrgSans,Arial, sans-serif;
 font-size: 13px;
 line-height: 13px;
 }
@@ -891,20 +929,17 @@ font-size: 1.2em;
 }
 
 .cmsedit-container #menu {
-  min-width: 20%; 
+  display: inline-block;
+  min-width: 20%;
   height: 100%;
+  font-size: 15px;
+  font-weight: 600;
+  color: #222;
   background-color: #fcfcfc;
-  border: 1px solid #eee;
-  border-radius: 1px;
-}
-
-.cmsedit-container #menu {
-  display: inline-block;
   padding: 4px 0;
   margin: 4px;
-  font-size: 14px;
-  color: #222;
-  font-weight: 600;
+  border: 1px solid #eee;
+  border-radius: 1px;
 }
 
 .cmsedit-container .fa {
@@ -1213,10 +1248,33 @@ background-color: transparent;
   color: #ccc;
 }
 
+.dc-action-menu .dc-link:empty {
+  display: none;
+}
+
+.dc-action-menu li.spacer {
+  border-right: 2px solid #888;
+  border-radius: 0;
+  padding: 7px 0;
+  margin-right: 5px;
+}
+
+/*****  POPUP ******/
+
 #popup {
   min-width: 50%;
 }
 
+#popup .dc-help .help-top {
+  position: absolute;
+  bottom: 1rem;
+  right: 1rem;
+  padding: 2px 4px;
+  border: 1px dotted #ccc;
+  border-radius: 4px;
+  background: rgba(76,154,255,0.2);
+}
+
 #popup .dc-help {
   background: #fff;
   padding: 8px;
@@ -1228,8 +1286,10 @@ background-color: transparent;
 #popup .dc-help h1 {
   background: darkred;
   color: #fff;
-  font-weight: 700;
-  padding: 4px
+  font-weight: 600;
+  padding: 4px;
+  font-size: 1.2em;
+  border-radius: 2px;
 }
 
 #popup .dc-help h2 {
@@ -1246,21 +1306,12 @@ background-color: transparent;
   padding: 4px
 }
 
-/*
-#popup .dc-help .help-tab {
-  display: table;
-  padding-top: 4px;
-  border-bottom: 3px solid #000;
-  margin: 8px 0;
-  font-weight: 600;
-}
-*/
 #popup .dc-help .help-tab {
   display: table;
   margin: 8px 0 0;
   padding: 3px 12px;
   color: #fff;
-  background: #444;
+  background: #555;
   border-radius: 5px 5px 0 0;
   font-weight: 600;
 }
@@ -1268,10 +1319,15 @@ background-color: transparent;
 #popup .dc-help .help-tab-help {
   font-weight: 600;
   color: #fff;
-  background: #666;
+  background: #777;
   padding: 3px 12px;
 }
 
+#popup .dc-help .help-fields {
+  margin-top: 1rem;
+  border-top: 1px solid #222;
+}
+
 #popup .dc-help .help-field {
   display: flex;
   background-color: #eee;
@@ -1291,11 +1347,14 @@ background-color: transparent;
 }
 
 #popup .dc-help .help-body {
-  margin-top: 8px;
   border-top: 1px solid #222;
   padding-top: 8px;
 }
 
+#popup .dc-help .help-buttons {
+  padding: 4px 0;
+}
+
 #popup .dc-help .dc-link {
   display: inline-flex;
 }
@@ -1412,10 +1471,21 @@ color: #669;
 }
 
 /****** MOBILE DEVICE *****/
-@media only screen and (max-width: 600px) {
+@media only screen and (max-device-width: 600px) {
+  #body-cms {font-size: 11px;}
+  #site-top div:nth-of-type(2) {padding-top: 0 !important;}
+
+  .dc-form {
+    border: none;
+    border-top: 2px solid #888;
+    border-bottom: 2px solid #888;
+    margin-top: 4px;
+  }
+
   .dc-form .row-div {
     display: block;
   }
+  .dc-form-li {margin-top: 3px;}
 
   .dc-form-label {
     text-align: left;
@@ -1423,16 +1493,70 @@ color: #669;
     padding-bottom: 2px;
     white-space: nowrap;
   }
+  .dc-form-label label {
+    font-size: 15px;
+  }
+
+  .app-menu li {margin-bottom: 4px;}
+
+  .dc-menu { padding: 0;}
+
+  .dc-submit {
+    line-height: 20px;
+    font-size: 11px;
+  }
+  .dc-link div, .dc-link-no {
+    padding: 4px 8px;
+  }
+
+  .dc-animate a:link, .dc-animate a:active, .dc-animate a:visited,
+  .dc-result a:link, .dc-result a:active, .dc-result a:visited {
+    padding: 4px 7px;
+  }
+  .dc-action-menu li {padding: 4px 6px;}
+  .dc-action-menu li.dc-link.plus-link {padding: 4px 0;}
+  .dc-title .dc-paginate {float: left;}
+
+  #result {width: 200%;}
+
+  .dc-separator {
+    margin: 8px 0 0;
+    border-top: 2px solid #888;
+  }
   
-  .dc-form-li {margin-top: 3px;}
-  .dc-menu li {margin-top: 2px;}
+  .dc-menu li {margin-bottom: 4px;}
   
   .dc-width-10, .dc-width-14, .dc-width-21, .dc-width-85, .dc-width-100 {width: 100%;}
+
+  .dc-width-100 {
+    overflow: auto;
+  }
+
+  textarea, input, select {
+    max-width: 90%;
+  }
+
+  #menu-hamburger {
+    display: block;
+    padding: 4px;
+    font-size: 2em;
+  }
+
+  .cmsedit-container {display: block;}
+  .cmsedit-container #menu {display: none;}
+  .cmsedit-container #menu.visible {
+    display: initial;
+    width: 200%;
+    font-weight: 500;
+    border: none;
+    margin: 0;
+  }
+  .cmsedit-iframe {padding-left: 2px;}
 }
 
 /******* Firefox only ********/
 @-moz-document url-prefix() {
   .dc-submit {
-    padding: 0 2px 1px;
+    /* padding: 0 2px 1px; */
   }
 }

data/app/assets/stylesheets/drg_cms/select-multiple.css

@@ -28,7 +28,7 @@
   -ms-transition: border linear 0.2s, box-shadow linear 0.2s;
   -o-transition: border linear 0.2s, box-shadow linear 0.2s;
   transition: border linear 0.2s, box-shadow linear 0.2s;
-  border: 1px solid #ddd;
+  border: 1px dashed #888;
   -webkit-border-radius: 1px;
   -moz-border-radius: 1px;
   border-radius: 1px;