@vaadin/vaadin-lumo-styles - npm Package Compare versions

Comparing version 21.0.0-beta1 to 22.0.0-alpha1

package.json

 {
   "name": "@vaadin/vaadin-lumo-styles",
-  "version": "21.0.0-beta1",
+  "version": "22.0.0-alpha1",
   "description": "Lumo is a design system foundation for modern web applications, used by Vaadin components",
@@ -37,4 +37,4 @@ "main": "all-imports.js",
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/vaadin-icon": "21.0.0-beta1",
-    "@vaadin/vaadin-themable-mixin": "21.0.0-beta1"
+    "@vaadin/vaadin-icon": "^22.0.0-alpha1",
+    "@vaadin/vaadin-themable-mixin": "^22.0.0-alpha1"
   },
@@ -51,3 +51,3 @@ "devDependencies": {
   },
-  "gitHead": "7d08834d03228105c2ea72213a385ddf35125f79"
+  "gitHead": "c9694d6549bff1f7fffb9ece26178e57fc228a51"
 }

typography.d.ts

@@ -5,2 +5,4 @@ import { CSSResult } from 'lit';
 
+export const inputs: CSSResult;
+
 export const typography: CSSResult;

typography.js

@@ -31,6 +31,2 @@ /**
 
-const $tpl = document.createElement('template');
-$tpl.innerHTML = `<style>${font.toString().replace(':host', 'html')}</style>`;
-document.head.appendChild($tpl.content);
-
 const typography = css`
@@ -144,3 +140,2 @@ html {
   /* RTL specific styles */
-
   blockquote[dir='rtl'] {
@@ -154,2 +149,30 @@ border-left: none;
 
-export { font, typography };
+const inputs = css`
+  /* Slotted input styles */
+  input[slot='input']::placeholder,
+  textarea[slot='textarea']::placeholder {
+    color: inherit;
+    transition: opacity 0.175s 0.1s;
+    opacity: 0.5;
+  }
+
+  [readonly] > input[slot='input']::placeholder,
+  [readonly] > textarea[slot='textarea']::placeholder,
+  [disabled] > input[slot='input']::placeholder,
+  [disabled] > textarea[slot='textarea']::placeholder {
+    opacity: 0;
+  }
+
+  /* Hide the native arrow icons */
+  input[slot='input']::-webkit-outer-spin-button,
+  input[slot='input']::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+  }
+`;
+
+const $tpl = document.createElement('template');
+$tpl.innerHTML = `<style>${font.toString().replace(':host', 'html')}${inputs.toString()}</style>`;
+document.head.appendChild($tpl.content);
+
+export { font, inputs, typography };

version.js

@@ -8,3 +8,3 @@ /**
   static get version() {
-    return '21.0.0-beta1';
+    return '22.0.0-alpha1';
   }
@@ -11,0 +11,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

130028

increased by0.54%

Lines of code

3116

increased by0.71%

Dependency changes

• + Added@open-wc/dedupe-mixin@1.4.0(transitive)

• + Added@vaadin/component-base@22.1.0(transitive)

• + Added@vaadin/icon@22.1.0(transitive)

• + Added@vaadin/vaadin-icon@22.1.0(transitive)

• + Added@vaadin/vaadin-lumo-styles@22.1.0(transitive)

• + Added@vaadin/vaadin-themable-mixin@22.1.0(transitive)

• - Removed@vaadin/vaadin-element-mixin@21.0.0-beta1(transitive)

• - Removed@vaadin/vaadin-icon@21.0.0-beta1(transitive)

• - Removed@vaadin/vaadin-themable-mixin@21.0.0-beta1(transitive)

• Updated@vaadin/vaadin-icon@^22.0.0-alpha1

• Updated@vaadin/vaadin-themable-mixin@^22.0.0-alpha1