@aquera/nile-elements 0.1.44-beta-1.7 → 0.1.44-beta-1.8

package/package.json

@@ -3,7 +3,7 @@
   "description": "Webcomponent nile-elements following open-wc recommendations",
   "license": "MIT",
   "author": "nile-elements",
-  "version": "0.1.44-beta-1.7",
+  "version": "0.1.44-beta-1.8",
   "main": "dist/src/index.js",
   "type": "module",
   "module": "dist/src/index.js",

package/src/nile-code-editor/nile-code-editor.css.ts

@@ -24,7 +24,7 @@ export const styles = css`
 
   .code__editor__container {
     display: flex;
-    padding: var(--nile-spacing-sm, var(--ng-spacing-none));
+    padding: var(--nile-spacing-5px, var(--ng-spacing-none));
     border-radius: var(--nile-radius-sm, var(--ng-radius-md));
     border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-secondary));
     position: relative;
@@ -64,7 +64,7 @@ export const styles = css`
     right: var(--nile-spacing-none, var(--ng-spacing-1-5));
     top: 5px;
     z-index: 1;
-    padding: var(--nile-spacing-sm, var(--ng-spacing-none));
+    padding: var(--nile-spacing-5px, var(--ng-spacing-none));
     background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
   }
   

package/src/nile-input/nile-input.css.ts

@@ -137,9 +137,12 @@ export const styles = css`
     outline:var(--nile-outline-none, var(--ng-private-outline-transparent));
   }
 
+  .input--standard:hover {
+    border-color: var(--nile-colors-dark-900, var(--ng-colors-fg-quaternary-400));
+  }
+
   .input--standard.input--error:hover:not(.input--disabled) {
-    border-color: var(--nile-colors-red-500, var(--ng-colors-border-error));
-    outline: var(--nile-outline-none, var(--ng-colors-border-error));
+    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-error));
   }
 
   .input--standard.input--focused:not(.input--disabled) {
@@ -194,6 +197,10 @@ export const styles = css`
     border-color: var(--nile-colors-yellow-500, var(--ng-colors-border-warning-subtle));
   }
 
+  .input--standard.input--warning:hover {
+    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-warning));
+  }
+
   .input--standard.input--error {
     border-color: var(--nile-colors-red-500, var(--ng-colors-border-error-subtle));
   }
@@ -202,6 +209,10 @@ export const styles = css`
     border-color: var(--nile-colors-green-500, var(--ng-colors-border-success-subtle));
   }
 
+  .input--standard.input--success:hover {
+    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-success));
+  }
+
   .input--standard.input--destructive {
     border-color: var(--nile-colors-red-400);
   }

package/src/nile-list/nile-list.css.ts

@@ -14,7 +14,7 @@ export const styles = css`
   :host {
     display: flex;
     flex-direction: column;
-    gap: var(--nile-spacing-md, var(--ng-spacing-md));
+    gap: var(--nile-spacing-9px, var(--ng-spacing-md));
     padding: var(--nile-spacing-xl, var(--ng-spacing-xl));
     -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));
     -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));

package/src/nile-list-item/nile-list-item.css.ts

@@ -45,7 +45,7 @@ export const styles = css`
   .content__wrapper {
     display: flex;
     flex-direction: column;
-    gap: var(--nile-spacing-xs, var(--ng-spacing-xs));
+    gap: var(--nile-spacing-3px, var(--ng-spacing-xs));
     height: 100%;
     box-sizing: border-box;
   }

package/src/nile-textarea/nile-textarea.css.ts

@@ -96,12 +96,12 @@ export const styles = css`
 
   .textarea--standard:hover:not(.textarea--disabled) {
     background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
-    border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-primary));
+    border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-fg-quaternary-400));
     border-radius: var(--nile-radius-sm, var(--ng-radius-md));
   }
 
   .textarea--standard:hover:not(.textarea--disabled) .textarea__control {
-    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-primary));
+    border-color: var(--nile-colors-dark-900, var(--ng-colors-fg-quaternary-400));
     border-radius: var(--nile-radius-sm, var(--ng-radius-md));
   }
 
@@ -112,13 +112,29 @@ export const styles = css`
     border-width: var(--nile-border-width-1, var(--ng-border-width-2));
   }
 
+  .textarea--standard.textarea--warning:not(.textarea--disabled):hover {
+    border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-warning));
+  }
+
   .textarea--standard.textarea--warning.textarea--focused:not(.textarea--disabled) {
-    border-color: var(--nile-colors-dark-900, var(--ng-componentcolors-utility-warning-500));
+    border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-warning-subtle));
     border-width: var(--nile-border-width-1, var(--ng-border-width-2));
   }
 
+  .textarea--standard.textarea--error:not(.textarea--disabled):hover {
+    border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-error));
+  }
+
   .textarea--standard.textarea--error.textarea--focused:not(.textarea--disabled) {
-    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-error));
+    border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-error));
+  }
+
+  .textarea--standard.textarea--success:not(.textarea--disabled):hover {
+    border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-success));
+  }
+
+  .textarea--standard.textarea--success.textarea--focused:not(.textarea--disabled) {
+    border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-success));
     border-width: var(--nile-border-width-1, var(--ng-border-width-2));
   }
 
@@ -198,7 +214,7 @@ export const styles = css`
   }
 
   .textarea--standard.textarea--warning {
-    border-color: var(--nile-colors-yellow-500, var(--ng-componentcolors-utility-warning-500));
+    border-color: var(--nile-colors-yellow-500, var(--ng-colors-border-warning-subtle));
   }
 
   .textarea--standard.textarea--error {
@@ -206,8 +222,7 @@ export const styles = css`
   }
 
   .textarea--standard.textarea--success {
-    //TODO: Need Token from design system
-    border-color: var(--nile-colors-green-500);
+    border-color: var(--nile-colors-green-500, var(--ng-colors-border-success-subtle));
   }
 
   .textarea--standard.textarea--destructive {