@aquera/nile-elements 0.1.39-beta-1.2 → 0.1.40-beta-1.1

package/dist/src/nile-vertical-stepper-item/nile-vertical-stepper-item.css.js

@@ -58,13 +58,13 @@ export const styles = css `
 	.stepper__item__bulletin {
 		display:grid;
 		place-content:center;
-		
+
 		margin-top: var(--nile-spacing-one-half-x, var(--ng-spacing-none));
 		margin-bottom: var(--nile-spacing-one-half-x, var(--ng-spacing-none));
 	}
 
 	.stepper__item--selected .stepper-item__connector-content{
-		margin-left: var(--nile-spacing-none, calc( var(--ng-spacing-xxs) * -1 ))
+    margin-left: var(--nile-spacing-none, calc(var(--ng-spacing-xxs) * -1px));
 	}
 
 	.stepper__item--selected .stepper__item__bulletin{
@@ -97,7 +97,7 @@ export const styles = css `
 		background-color:var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));
 		overflow:hidden;
 	}
-	
+
 	.stepper__bulletin__icon--active {
 		border: var(--lines-thickness) solid var(--nile-colors-primary-500,var(--ng-colors-border-brand));
 		width: calc(var(--circle-height) + calc( var(--lines-thickness) * 2));
@@ -142,7 +142,7 @@ export const styles = css `
 
 	.stepper__content__title--active{
 		color:var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700));
-		font-weight: var(--nile-font-weight-semi-bold,var(--ng-font-weight-semi-bold));
+		font-weight: var(--nile-font-weight-semi-bold,var(--ng-font-weight-semibold));
 	}
 
 	.stepper__content__subtitle {

package/dist/src/nile-vertical-stepper-item/nile-vertical-stepper-item.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-vertical-stepper-item.css.js","sourceRoot":"","sources":["../../../src/nile-vertical-stepper-item/nile-vertical-stepper-item.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoJxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n* Copyright Aquera Inc 2023\n*\n* This source code is licensed under the BSD-3-Clause license found in the\n* LICENSE file in the root directory of this source tree.\n*/\n\nimport {css} from 'lit';\n\n/**\n * VerticalStepperItem CSS\n */\nexport const styles = css`\n\t:host {\n\t\t--vertical-stepper-flex-val:1;\n\t\tflex-grow:var(--vertical-stepper-flex-val);\n\t\t--bulletin--dot--seperation:30%;\n\t\t--min-line-container-height:25px;\n\t\t--lines-thickness: 1px;\n\t\t-webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\t}\n\n\t.stepper__item {\n\t\tdisplay:flex;\n\t\tcolumn-gap:var(--item-spacing);\n\t\theight: 100%;\n\t}\n\n\t.stepper__item--sm {\n\t\t--item-spacing: var(--nile-spacing-md, var(--ng-spacing-md));\n\t\t--stepper-item-title-size: var(--nile-type-scale-2, var(--ng-font-size-text-sm));\n\t\t--stepper-item-subtitle-size: var(--nile-type-scale-1,var(--ng-font-size-text-sm));\n\t\t--stepper-item-text-line-height:var(--nile-line-height-xsmall,var(--ng-line-height-text-sm));\n\t\t--circle-height:18px;\n\t}\n\n\t.stepper__item--lg {\n\t\t--item-spacing: var(--nile-spacing-md, var(--ng-spacing-md));\n\t\t--stepper-item-title-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n\t\t--stepper-item-subtitle-size: var(--nile-type-scale-2, var(--ng-font-size-text-md));\n\t\t--stepper-item-text-line-height:var(--nile-line-height-small, var(--ng-line-height-text-md));\n\t\t--circle-height: 22px;\n\t}\n\n\t.stepper__item--xl {\n\t\t--item-spacing: var(--nile-type-scale-2, var(--ng-spacing-2xl));\n\t\t--stepper-item-title-size: var( --nile-type-scale-4, var(--ng-font-size-text-md));\n\t\t--stepper-item-subtitle-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n\t\t--stepper-item-text-line-height:var(--nile-line-height-medium, var(--ng-line-height-text-lg));\n\t\t--circle-height:26px;\n\t}\n\n\t.stepper-item__connector-content{\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.stepper__item__bulletin {\n\t\tdisplay:grid;\n\t\tplace-content:center;\n\t\t\n\t\tmargin-top: var(--nile-spacing-one-half-x, var(--ng-spacing-none));\n\t\tmargin-bottom: var(--nile-spacing-one-half-x, var(--ng-spacing-none));\n\t}\n\n\t.stepper__item--selected .stepper-item__connector-content{\n\t\tmargin-left: var(--nile-spacing-none, calc( var(--ng-spacing-xxs) * -1 ))\n\t}\n\n\t.stepper__item--selected .stepper__item__bulletin{\n\t\tpadding: 1px;\n\t\tborder: 1px solid var(--ng-colors-effects-focus-ring);\n\t\tborder-radius: 50%;\n\t}\n\n\t.stepper__bulletin--dot {\n\t\twidth: var(--circle-height);\n\t\taspect-ratio: 1 / 1;\n\t\tborder-radius: 50%;\n\t\tbackground: radial-gradient(var(--nile-colors-neutral-500, var(--ng-colors-border-secondary)) var(--bulletin--dot--seperation), var(--nile-colors-dark-200, var(--ng-colors-bg-primary)) var(--bulletin--dot--seperation));\n\t\tborder: var(--lines-thickness) solid var(--nile-colors-neutral-500, var(--ng-colors-border-secondary));\n\t}\n\n\t.stepper__bulletin__dot--active{\n\t\tbackground: radial-gradient(var(--nile-colors-white-base, var(--ng-colors-bg-primary)) var(--bulletin--dot--seperation), var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid)) var(--bulletin--dot--seperation));\n\t\tborder: var(--lines-thickness) solid var(--nile-colors-primary-500,var(--ng-colors-bg-brand-solid));\n\t\twidth: calc( var(--circle-height) + calc( var(--lines-thickness) * 2 ) );\n\t}\n\n\t.stepper__bulletin--icon {\n\t\tdisplay:grid;\n\t\tplace-content:center;\n\t\twidth: var(--circle-height);\n\t\tborder: var(--lines-thickness) solid var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n\t\taspect-ratio: 1 / 1;\n\t\tborder-radius: 50%;\n\t\tbackground-color:var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n\t\toverflow:hidden;\n\t}\n\t\n\t.stepper__bulletin__icon--active {\n\t\tborder: var(--lines-thickness) solid var(--nile-colors-primary-500,var(--ng-colors-border-brand));\n\t\twidth: calc(var(--circle-height) + calc( var(--lines-thickness) * 2));\n\t}\n\n\t.stepper__item__line__container{\n\t\tflex-grow: 1;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\tpadding: 2px;\n\t\tmin-height: var(--min-line-container-height);\n\t}\n\n\t.stepper__item__line{\n\t\theight:100%;\n\t\tborder-left: var(--lines-thickness) solid var(--nile-colors-neutral-500, var(--ng-colors-border-secondary));\n\t}\n\t.stepper__item__line--active{\n\t\tborder-left: var(--lines-thickness) solid var(--nile-colors-primary-600, var(--ng-colors-border-brand-alt));\n\t}\n\n\t.stepper__item__content{\n\t\tdisplay:flex;\n\t\tflex-direction:column;\n\t\tjustify-content:start;\n\t}\n\t.stepper__content__title {\n\t\tcolor:var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n\t\tfont-size: var(--stepper-item-title-size);\n\t\tline-height: var(--stepper-item-text-line-height);\n\t\tfont-family: var(--nile-font-family-medium, var(--ng-font-family-body));\n\t\tfont-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n\t}\n\n\t.stepper__content__title--alone{\n\t\tmargin-top: 25%;\n\t}\n\n\t.stepper__content__subtitle--alone{\n\t\tmargin-top: 6.25%;\n\t}\n\n\t.stepper__content__title--active{\n\t\tcolor:var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700));\n\t\tfont-weight: var(--nile-font-weight-semi-bold,var(--ng-font-weight-semi-bold));\n\t}\n\n\t.stepper__content__subtitle {\n\t\tcolor:var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n\t\tfont-size: var(--stepper-item-subtitle-size);\n\t\tline-height: var(--stepper-item-text-line-height);\n\t\tfont-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n\t\tfont-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n\t}\n\n\t.stepper__content__subtitle--active{\n\t\tcolor:var(--nile-colors-primary-600, var(--ng-colors-text-brand-tertiary-600));\n\t}\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-vertical-stepper-item.css.js","sourceRoot":"","sources":["../../../src/nile-vertical-stepper-item/nile-vertical-stepper-item.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoJxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n* Copyright Aquera Inc 2023\n*\n* This source code is licensed under the BSD-3-Clause license found in the\n* LICENSE file in the root directory of this source tree.\n*/\n\nimport {css} from 'lit';\n\n/**\n * VerticalStepperItem CSS\n */\nexport const styles = css`\n\t:host {\n\t\t--vertical-stepper-flex-val:1;\n\t\tflex-grow:var(--vertical-stepper-flex-val);\n\t\t--bulletin--dot--seperation:30%;\n\t\t--min-line-container-height:25px;\n\t\t--lines-thickness: 1px;\n\t\t-webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\t}\n\n\t.stepper__item {\n\t\tdisplay:flex;\n\t\tcolumn-gap:var(--item-spacing);\n\t\theight: 100%;\n\t}\n\n\t.stepper__item--sm {\n\t\t--item-spacing: var(--nile-spacing-md, var(--ng-spacing-md));\n\t\t--stepper-item-title-size: var(--nile-type-scale-2, var(--ng-font-size-text-sm));\n\t\t--stepper-item-subtitle-size: var(--nile-type-scale-1,var(--ng-font-size-text-sm));\n\t\t--stepper-item-text-line-height:var(--nile-line-height-xsmall,var(--ng-line-height-text-sm));\n\t\t--circle-height:18px;\n\t}\n\n\t.stepper__item--lg {\n\t\t--item-spacing: var(--nile-spacing-md, var(--ng-spacing-md));\n\t\t--stepper-item-title-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n\t\t--stepper-item-subtitle-size: var(--nile-type-scale-2, var(--ng-font-size-text-md));\n\t\t--stepper-item-text-line-height:var(--nile-line-height-small, var(--ng-line-height-text-md));\n\t\t--circle-height: 22px;\n\t}\n\n\t.stepper__item--xl {\n\t\t--item-spacing: var(--nile-type-scale-2, var(--ng-spacing-2xl));\n\t\t--stepper-item-title-size: var( --nile-type-scale-4, var(--ng-font-size-text-md));\n\t\t--stepper-item-subtitle-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n\t\t--stepper-item-text-line-height:var(--nile-line-height-medium, var(--ng-line-height-text-lg));\n\t\t--circle-height:26px;\n\t}\n\n\t.stepper-item__connector-content{\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.stepper__item__bulletin {\n\t\tdisplay:grid;\n\t\tplace-content:center;\n\n\t\tmargin-top: var(--nile-spacing-one-half-x, var(--ng-spacing-none));\n\t\tmargin-bottom: var(--nile-spacing-one-half-x, var(--ng-spacing-none));\n\t}\n\n\t.stepper__item--selected .stepper-item__connector-content{\n    margin-left: var(--nile-spacing-none, calc(var(--ng-spacing-xxs) * -1px));\n\t}\n\n\t.stepper__item--selected .stepper__item__bulletin{\n\t\tpadding: 1px;\n\t\tborder: 1px solid var(--ng-colors-effects-focus-ring);\n\t\tborder-radius: 50%;\n\t}\n\n\t.stepper__bulletin--dot {\n\t\twidth: var(--circle-height);\n\t\taspect-ratio: 1 / 1;\n\t\tborder-radius: 50%;\n\t\tbackground: radial-gradient(var(--nile-colors-neutral-500, var(--ng-colors-border-secondary)) var(--bulletin--dot--seperation), var(--nile-colors-dark-200, var(--ng-colors-bg-primary)) var(--bulletin--dot--seperation));\n\t\tborder: var(--lines-thickness) solid var(--nile-colors-neutral-500, var(--ng-colors-border-secondary));\n\t}\n\n\t.stepper__bulletin__dot--active{\n\t\tbackground: radial-gradient(var(--nile-colors-white-base, var(--ng-colors-bg-primary)) var(--bulletin--dot--seperation), var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid)) var(--bulletin--dot--seperation));\n\t\tborder: var(--lines-thickness) solid var(--nile-colors-primary-500,var(--ng-colors-bg-brand-solid));\n\t\twidth: calc( var(--circle-height) + calc( var(--lines-thickness) * 2 ) );\n\t}\n\n\t.stepper__bulletin--icon {\n\t\tdisplay:grid;\n\t\tplace-content:center;\n\t\twidth: var(--circle-height);\n\t\tborder: var(--lines-thickness) solid var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n\t\taspect-ratio: 1 / 1;\n\t\tborder-radius: 50%;\n\t\tbackground-color:var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n\t\toverflow:hidden;\n\t}\n\n\t.stepper__bulletin__icon--active {\n\t\tborder: var(--lines-thickness) solid var(--nile-colors-primary-500,var(--ng-colors-border-brand));\n\t\twidth: calc(var(--circle-height) + calc( var(--lines-thickness) * 2));\n\t}\n\n\t.stepper__item__line__container{\n\t\tflex-grow: 1;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\tpadding: 2px;\n\t\tmin-height: var(--min-line-container-height);\n\t}\n\n\t.stepper__item__line{\n\t\theight:100%;\n\t\tborder-left: var(--lines-thickness) solid var(--nile-colors-neutral-500, var(--ng-colors-border-secondary));\n\t}\n\t.stepper__item__line--active{\n\t\tborder-left: var(--lines-thickness) solid var(--nile-colors-primary-600, var(--ng-colors-border-brand-alt));\n\t}\n\n\t.stepper__item__content{\n\t\tdisplay:flex;\n\t\tflex-direction:column;\n\t\tjustify-content:start;\n\t}\n\t.stepper__content__title {\n\t\tcolor:var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n\t\tfont-size: var(--stepper-item-title-size);\n\t\tline-height: var(--stepper-item-text-line-height);\n\t\tfont-family: var(--nile-font-family-medium, var(--ng-font-family-body));\n\t\tfont-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n\t}\n\n\t.stepper__content__title--alone{\n\t\tmargin-top: 25%;\n\t}\n\n\t.stepper__content__subtitle--alone{\n\t\tmargin-top: 6.25%;\n\t}\n\n\t.stepper__content__title--active{\n\t\tcolor:var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700));\n\t\tfont-weight: var(--nile-font-weight-semi-bold,var(--ng-font-weight-semibold));\n\t}\n\n\t.stepper__content__subtitle {\n\t\tcolor:var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n\t\tfont-size: var(--stepper-item-subtitle-size);\n\t\tline-height: var(--stepper-item-text-line-height);\n\t\tfont-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n\t\tfont-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n\t}\n\n\t.stepper__content__subtitle--active{\n\t\tcolor:var(--nile-colors-primary-600, var(--ng-colors-text-brand-tertiary-600));\n\t}\n`;\n\nexport default [styles];\n"]}