1.0.103

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@designestate/dees-catalog",
-  "version": "1.0.101",
+  "version": "1.0.103",
   "private": false,
   "description": "website for lossless.com",
   "main": "dist_ts_web/index.js",

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@designestate/dees-catalog',
-  version: '1.0.101',
+  version: '1.0.103',
   description: 'website for lossless.com'
 }

ts_web/elements/dees-icon.ts

@@ -86,6 +86,9 @@ export class DeesIcon extends DeesElement {
           display: block;
           line-height: inherit;
           font-size: inherit;
+          margin: 0px;
+          padding: 0px;
+          white-space: nowrap;
         }
         #iconContainer svg {
           display: inline-block;

ts_web/elements/dees-input-fileupload.ts

@@ -19,7 +19,7 @@ declare global {
 
 @customElement('dees-input-fileupload')
 export class DeesInputFileupload extends DeesElement {
-  public static demo = () => html`<dees-input-fileupload></dees-input-fileupload>`;
+  public static demo = () => html`<dees-input-fileupload .label=${'Attachments'}></dees-input-fileupload>`;
 
   // INSTANCE
   public changeSubject = new domtools.rxjs.Subject();
@@ -73,6 +73,7 @@ export class DeesInputFileupload extends DeesElement {
 
       .maincontainer {
         color: ${cssManager.bdTheme('#333', '#ccc')};
+        
       }
 
       .label {
@@ -89,6 +90,12 @@ export class DeesInputFileupload extends DeesElement {
         border-radius: 3px;
         text-align: center;
       }
+
+      .uploadButton:hover {
+        color: #fff;
+        background: rgb(3, 155, 229);
+      }
+
       .uploadButton::after {
         top: 2px;
         right: 2px;
@@ -109,10 +116,16 @@ export class DeesInputFileupload extends DeesElement {
       .uploadCandidate {
         text-align: left;
         border-bottom: 1px dashed #444;
-        color: #fff;
+        color: ${cssManager.bdTheme('#666', '#ccc')};
         padding: 8px;
         font-family: 'Roboto Mono';
       }
+
+      .uploadButton:hover .uploadCandidate {
+        color: ${cssManager.bdTheme('#fff', '#fff')};
+        border-bottom: 1px dashed #fff;
+      }
+
       .uploadCandidate:last-child {
         margin-bottom: 8px;
       }

ts_web/elements/dees-table.ts

@@ -19,7 +19,7 @@ declare global {
 
 export interface IDataAction<T = any> {
   name: string;
-  icon: string;
+  iconName: string;
   useTableBehaviour?: 'upload' | 'cancelUpload' | 'none';
   actionFunc: (itemArg: T) => Promise<any>;
 }
@@ -70,7 +70,7 @@ export class DeesTable<T> extends DeesElement {
         ]}
         .dataActions="${[{
           name: 'upload',
-          icon: 'upload',
+          iconName: 'upload',
           useTableBehaviour: 'upload',
           actionFunc: async (itemArg: any) => {
 
@@ -200,6 +200,7 @@ export class DeesTable<T> extends DeesElement {
       .action {
         margin: -8px 0px;
         padding: 8px;
+        line-height: 16px;
       }
 
       .action:first-child {
@@ -208,7 +209,7 @@ export class DeesTable<T> extends DeesElement {
       }
 
       .action:hover {
-        background: #111;
+        background: ${cssManager.bdTheme('#CCC', '#111')};
       }
 
       .tableStatistics {
@@ -294,7 +295,9 @@ export class DeesTable<T> extends DeesElement {
                                   ${(() => {
                                     const actions: TemplateResult[] = [];
                                     for (const action of this.dataActions) {
-                                      actions.push(html`<div class="action">${action.name}</div>`)
+                                      actions.push(html`<div class="action">${action.iconName ? html`
+                                        <dees-icon .iconName=${'upload_file'}></dees-icon>
+                                      ` : action.name}</div>`)
                                     }
                                     return actions;
                                   })()}