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

Comparing version 24.0.0-alpha9 to 24.0.0-beta1

badge.js

@@ -28,2 +28,3 @@ /**
     min-width: calc(var(--lumo-line-height-xs) * 1em + 0.45em);
+    flex-shrink: 0;
   }
@@ -30,0 +31,0 @@

mixins/required-field.js

@@ -48,3 +48,3 @@ /**
   :host([required]) [part='required-indicator']::after {
-    content: var(--lumo-required-field-indicator, '•');
+    content: var(--lumo-required-field-indicator, '\\2022');
     transition: opacity 0.2s;
@@ -51,0 +51,0 @@ color: var(--lumo-required-field-indicator-color, var(--lumo-primary-text-color));

package.json

 {
   "name": "@vaadin/vaadin-lumo-styles",
-  "version": "24.0.0-alpha9",
+  "version": "24.0.0-beta1",
   "publishConfig": {
@@ -44,4 +44,4 @@ "access": "public"
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/icon": "24.0.0-alpha9",
-    "@vaadin/vaadin-themable-mixin": "24.0.0-alpha9"
+    "@vaadin/icon": "24.0.0-beta1",
+    "@vaadin/vaadin-themable-mixin": "24.0.0-beta1"
   },
@@ -55,3 +55,3 @@ "devDependencies": {
   },
-  "gitHead": "cc3f747164041566b300bde4b105d2475649e93f"
+  "gitHead": "c5b48921a62482746df8e46994b37e1490fec27e"
 }

style.d.ts

 import type { CSSResult } from 'lit';
 
+export const globals: CSSResult;
+
 export const style: CSSResult;

style.js

@@ -28,6 +28,17 @@ /**
 
+/**
+ * Default values for component-specific custom properties.
+ */
+const globals = css`
+  html {
+    --vaadin-checkbox-size: calc(var(--lumo-size-m) / 2);
+    --vaadin-radio-button-size: calc(var(--lumo-size-m) / 2);
+    --vaadin-input-container-border-radius: var(--lumo-border-radius-m);
+  }
+`;
+
 const $tpl = document.createElement('template');
-$tpl.innerHTML = `<style>${style.toString().replace(':host', 'html')}</style>`;
+$tpl.innerHTML = `<style>${style.toString().replace(':host', 'html')}$</style>`;
 document.head.appendChild($tpl.content);
 
-export { style };
+export { globals, style };

typography.js

@@ -53,41 +53,30 @@ /**
 
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
+  :where(h1, h2, h3, h4, h5, h6) {
     font-weight: 600;
     line-height: var(--lumo-line-height-xs);
-    margin-top: 1.25em;
+    margin: 0;
   }
 
-  h1 {
+  :where(h1) {
     font-size: var(--lumo-font-size-xxxl);
-    margin-bottom: 0.75em;
   }
 
-  h2 {
+  :where(h2) {
     font-size: var(--lumo-font-size-xxl);
-    margin-bottom: 0.5em;
   }
 
-  h3 {
+  :where(h3) {
     font-size: var(--lumo-font-size-xl);
-    margin-bottom: 0.5em;
   }
 
-  h4 {
+  :where(h4) {
     font-size: var(--lumo-font-size-l);
-    margin-bottom: 0.5em;
   }
 
-  h5 {
+  :where(h5) {
     font-size: var(--lumo-font-size-m);
-    margin-bottom: 0.25em;
   }
 
-  h6 {
+  :where(h6) {
     font-size: var(--lumo-font-size-xs);
-    margin-bottom: 0;
     text-transform: uppercase;
@@ -94,0 +83,0 @@ letter-spacing: 0.03em;

vaadin-iconset.js

@@ -6,10 +6,8 @@ /**
  */
-import '@vaadin/icon/vaadin-iconset.js';
 import './version.js';
+import { Iconset } from '@vaadin/icon/vaadin-iconset.js';
 
 const template = document.createElement('template');
 
-template.innerHTML = `<vaadin-iconset name="lumo" size="1000">
-<svg xmlns="http://www.w3.org/2000/svg">
-<defs>
+template.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg"><defs>
 <g id="lumo:align-center"><path d="M167 217c0-18 17-33 38-34H795c21 0 38 15 38 34 0 18-17 33-38 33H205C184 250 167 235 167 217z m83 191c0-18 13-33 29-33H721c16 0 29 15 29 33 0 18-13 33-29 34H279C263 442 250 427 250 408zM250 792c0-18 13-33 29-34H721c16 0 29 15 29 34s-13 33-29 33H279C263 825 250 810 250 792z m-83-192c0-18 17-33 38-33H795c21 0 38 15 38 33s-17 33-38 33H205C184 633 167 618 167 600z" fill-rule="evenodd" clip-rule="evenodd"></path></g>
@@ -57,6 +55,4 @@ <g id="lumo:align-left"><path d="M167 217c0-18 17-33 38-34H795c21 0 38 15 38 34 0 18-17 33-38 33H205C184 250 167 235 167 217z m0 191c0-18 13-33 28-33H638c16 0 29 15 29 33 0 18-13 33-29 34H195C179 442 167 427 167 408zM167 792c0-18 13-33 28-34H638c16 0 29 15 29 34s-13 33-29 33H195C179 825 167 810 167 792z m0-192c0-18 17-33 38-33H795c21 0 38 15 38 33s-17 33-38 33H205C184 633 167 618 167 600z" fill-rule="evenodd" clip-rule="evenodd"></path></g>
 <g id="lumo:user"><path d="M500 500c-69 0-125-56-125-125s56-125 125-125 125 56 125 125-56 125-125 125z m-292 292c0-115 131-208 292-209s292 93 292 209H208z"></path></g>
-</defs>
-</svg>
-</vaadin-iconset>`;
+</defs></svg>`;
 
-document.head.appendChild(template.content);
+Iconset.register('lumo', 1000, template);

version.js

@@ -15,3 +15,3 @@ /**
   static get version() {
-    return '24.0.0-alpha9';
+    return '24.0.0-beta1';
   }
@@ -18,0 +18,0 @@ }

No alert changes

Improved metrics

Total package byte prevSize

146391

increased by0.26%

Number of downloads

121957

increased by1.02%

Dependency changes

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

• + Added@vaadin/icon@24.0.0-beta1(transitive)

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

• - Removed@vaadin/component-base@24.0.0-alpha9(transitive)

• - Removed@vaadin/icon@24.0.0-alpha9(transitive)

• - Removed@vaadin/vaadin-themable-mixin@24.0.0-alpha9(transitive)

• Updated@vaadin/icon@24.0.0-beta1

• Updated@vaadin/vaadin-themable-mixin@24.0.0-beta1