update symbols

nielslyngsoe · nielslyngsoe · commit ca0a475a72eb · 2024-11-17T22:17:35.000+01:00
diff --git a/packages/uui-card-content-node/lib/uui-card-content-node.element.ts b/packages/uui-card-content-node/lib/uui-card-content-node.element.ts
@@ -36,8 +36,18 @@ export class UUICardContentNodeElement extends UUICardElement {
   @state()
   private _iconSlotHasContent = false;
 
-  protected fallbackIcon =
-    '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="currentColor"><path d="M396.441 138.878l-83.997-83.993-7.331-7.333H105.702v416.701h298.071V146.214l-7.332-7.336zM130.74 439.217V72.591h141.613c37.201 0 19.274 88.18 19.274 88.18s86-20.901 87.104 18.534v259.912H130.74z"></path></svg>';
+  protected fallbackIcon = `<svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="none"
+    stroke="currentColor"
+    stroke-width="1.75"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+    id="icon">
+    <path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" />
+    <path d="M14 2v4a2 2 0 0 0 2 2h4" />
+  </svg>`;
 
   private _onSlotIconChange(event: Event) {
     this._iconSlotHasContent =
diff --git a/packages/uui-ref-node/lib/uui-ref-node.element.ts b/packages/uui-ref-node/lib/uui-ref-node.element.ts
@@ -67,8 +67,18 @@ export class UUIRefNodeElement extends UUIRefElement {
   @state()
   private _iconSlotHasContent = false;
 
-  protected fallbackIcon =
-    '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="currentColor"><path d="M396.441 138.878l-83.997-83.993-7.331-7.333H105.702v416.701h298.071V146.214l-7.332-7.336zM130.74 439.217V72.591h141.613c37.201 0 19.274 88.18 19.274 88.18s86-20.901 87.104 18.534v259.912H130.74z"></path></svg>';
+  protected fallbackIcon = `<svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="none"
+    stroke="currentColor"
+    stroke-width="1.75"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+    id="icon">
+    <path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" />
+    <path d="M14 2v4a2 2 0 0 0 2 2h4" />
+  </svg>`;
 
   connectedCallback() {
     super.connectedCallback();
diff --git a/packages/uui-symbol-file/lib/uui-symbol-file.element.ts b/packages/uui-symbol-file/lib/uui-symbol-file.element.ts
@@ -1,6 +1,7 @@
 import { LitElement, html, css } from 'lit';
 import { defineElement } from '@umbraco-ui/uui-base/lib/registration';
 import { property } from 'lit/decorators.js';
+import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 
 /**
  *  @element uui-file-symbol
@@ -16,21 +17,30 @@ export class UUISymbolFileElement extends LitElement {
   type = '';
 
   render() {
-    return html`<svg
+    return html`
+      <svg
         xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 512 512"
-        width="100%"
-        fill="currentColor"
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="0.6"
+        stroke-linecap="round"
+        stroke-linejoin="round"
         id="icon">
-        <path
-          d="M396.441 138.878l-83.997-83.993-7.331-7.333H105.702v416.701h298.071V146.214l-7.332-7.336zM130.74 439.217V72.591h141.613c37.201 0 19.274 88.18 19.274 88.18s86-20.901 87.104 18.534v259.912H130.74z" />
+        <path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" />
+        <path d="M14 2v4a2 2 0 0 0 2 2h4" />
       </svg>
+
       ${this.type
-        ? html`<span id="file-type">${this.type.toUpperCase()}</span>`
-        : ''} `;
+        ? html`<small id="file-type" class="uui-small"
+            >${this.type.toUpperCase()}</small
+          >`
+        : ''}
+    `;
   }
 
   static styles = [
+    UUITextStyles,
     css`
       :host {
         position: relative;
@@ -39,8 +49,8 @@ export class UUISymbolFileElement extends LitElement {
 
       #file-type {
         position: absolute;
-        bottom: 24%;
-        left: 25.5%;
+        bottom: 20%;
+        left: 12%;
         margin-left: calc(var(--uui-size-3) * -1);
         padding: 0px var(--uui-size-3);
         font-weight: 700;
@@ -49,10 +59,12 @@ export class UUISymbolFileElement extends LitElement {
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
+        border-radius: var(--uui-border-radius);
       }
 
       #icon {
-        fill: var(--uui-color-border-standalone);
+        width: 100%;
+        color: var(--uui-color-border-standalone);
       }
     `,
   ];
diff --git a/packages/uui-symbol-folder/lib/uui-symbol-folder.element.ts b/packages/uui-symbol-folder/lib/uui-symbol-folder.element.ts
@@ -1,5 +1,6 @@
 import { LitElement, html, css } from 'lit';
 import { defineElement } from '@umbraco-ui/uui-base/lib/registration';
+import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 
 /**
  *  @element uui-folder-symbol
@@ -10,15 +11,20 @@ export class UUISymbolFolderElement extends LitElement {
   render() {
     return html`<svg
       xmlns="http://www.w3.org/2000/svg"
-      viewBox="0 0 512 512"
-      width="100%"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="0.6"
+      stroke-linecap="round"
+      stroke-linejoin="round"
       id="icon">
       <path
-        d="M450.962 169.833v-19.248c0-23.398-19.035-42.436-42.434-42.436H257.306c-5.885-16.926-21.99-29.1-40.885-29.1h-89.758c-20.545 0-37.795 14.391-42.191 33.623-13.891 7.016-23.486 21.45-23.486 37.912V169.897c-7.148 7.774-11.443 18.122-11.443 29.287v.956l.062.953c.045.704 4.639 70.713 5.469 95.492l3.137 93.62c.033 6.024.682 14.788 5.271 23.301 6.564 12.175 19.002 19.442 33.273 19.442h318.49c14.273 0 26.713-7.268 33.275-19.445 4.588-8.512 5.236-17.275 5.271-23.298l3.135-93.62c.832-24.782 5.424-94.788 5.471-95.492l.061-.953v-.956c0-11.203-4.314-21.574-11.496-29.351zM90.093 150.585c0-7.281 5.84-13.189 13.09-13.318h-.125c5.324 0 9.441-9.694 9.441-13.382l-.006-1.562c0-7.824 6.344-14.168 14.17-14.168h89.758c7.826 0 14.166 6.344 14.166 14.168v1.562c0 3.663 4.062 13.239 9.332 13.37h168.609c7.363 0 13.328 5.969 13.328 13.33v9.201H90.093v-9.201zm337.744 145.028c-.854 25.538-3.15 94.062-3.15 94.062 0 7.825-1.617 14.171-9.441 14.171H96.755c-7.822 0-9.439-6.346-9.439-14.171l-3.152-94.062c-.855-25.538-5.516-96.428-5.516-96.428 0-6.893 4.926-12.631 11.445-13.9l331.764-.009c6.547 1.251 11.494 6.998 11.494 13.909 0 .001-4.657 70.89-5.514 96.428z" />
-    </svg> `;
+        d="M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" />
+    </svg>`;
   }
 
   static styles = [
+    UUITextStyles,
     css`
       :host {
         display: block;
@@ -28,7 +34,8 @@ export class UUISymbolFolderElement extends LitElement {
       }
 
       #icon {
-        fill: var(--uui-color-border);
+        width: 100%;
+        color: var(--uui-color-border-standalone);
       }
     `,
   ];
