@pleodigital/design-system-votey 1.0.138 → 1.0.140

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/angular/fesm2022/pleodigital-design-system-votey-angular.mjs +23 -4
  2. package/dist/angular/fesm2022/pleodigital-design-system-votey-angular.mjs.map +1 -1
  3. package/dist/angular/types/pleodigital-design-system-votey-angular.d.ts +15 -4
  4. package/dist/css/tokens.angular.css +69 -1
  5. package/package.json +1 -1
package/dist/angular/fesm2022/pleodigital-design-system-votey-angular.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import { DOCUMENT, isPlatformBrowser } from '@angular/common';
2
2
  import * as i0 from '@angular/core';
3
- import { inject, PLATFORM_ID, Injectable, provideEnvironmentInitializer } from '@angular/core';
3
+ import { InjectionToken, inject, PLATFORM_ID, Injectable, makeEnvironmentProviders, provideEnvironmentInitializer } from '@angular/core';
4
4
  import DeviceDetector from 'node-device-detector';
5
5
  import { BehaviorSubject } from 'rxjs';
6
6
 
@@ -12,16 +12,27 @@ const DEFAULT_DIMENSIONS = {
12
12
  laptopBreakpoint: 1280,
13
13
  desktopBreakpoint: 1920,
14
14
  };
15
+ const VOTEY_DEFAULT_GRID_CONFIG = Object.freeze({
16
+ desktop: 12,
17
+ tablet: 8,
18
+ mobile: 4,
19
+ });
20
+ const VOTEY_GRID_CONFIG = new InjectionToken("VoteyGridConfig");
15
21
  class VoteyDeviceService {
16
22
  document = inject(DOCUMENT);
23
+ gridConfig = inject(VOTEY_GRID_CONFIG, { optional: true }) ??
24
+ VOTEY_DEFAULT_GRID_CONFIG;
17
25
  platformId = inject(PLATFORM_ID);
18
26
  deviceTypeSubject = new BehaviorSubject(null);
19
27
  dimensionsSubject = new BehaviorSubject(DEFAULT_DIMENSIONS);
20
28
  initializedSubject = new BehaviorSubject(false);
29
+ columnsAmountSubject = new BehaviorSubject(0);
21
30
  listeningForResize = false;
22
31
  deviceType$ = this.deviceTypeSubject.asObservable();
23
32
  deviceDimensions$ = this.dimensionsSubject.asObservable();
24
33
  initialized$ = this.initializedSubject.asObservable();
34
+ columnsAmount$ = this.columnsAmountSubject.asObservable();
35
+ columnsAmount = 0;
25
36
  currentDevice = null;
26
37
  deviceOrientation = "vertical";
27
38
  isMobileDevice = false;
@@ -97,6 +108,8 @@ class VoteyDeviceService {
97
108
  : this.isTabletDevice
98
109
  ? "tablet"
99
110
  : "desktop";
111
+ this.columnsAmount = this.gridConfig[this.currentDevice];
112
+ this.columnsAmountSubject.next(this.columnsAmount);
100
113
  }
101
114
  applyDocumentState(innerHeight) {
102
115
  if (!this.currentDevice) {
@@ -116,13 +129,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
116
129
  providedIn: "root",
117
130
  }]
118
131
  }] });
119
- function provideVoteyDeviceDetection() {
120
- return provideEnvironmentInitializer(() => inject(VoteyDeviceService).initialize());
132
+ function provideVoteyDeviceDetection(gridConfig = VOTEY_DEFAULT_GRID_CONFIG) {
133
+ return makeEnvironmentProviders([
134
+ {
135
+ provide: VOTEY_GRID_CONFIG,
136
+ useValue: gridConfig,
137
+ },
138
+ provideEnvironmentInitializer(() => inject(VoteyDeviceService).initialize()),
139
+ ]);
121
140
  }
122
141
 
123
142
  /**
124
143
  * Generated bundle index. Do not edit.
125
144
  */
126
145
 
127
- export { VoteyDeviceService, provideVoteyDeviceDetection };
146
+ export { VOTEY_DEFAULT_GRID_CONFIG, VOTEY_GRID_CONFIG, VoteyDeviceService, provideVoteyDeviceDetection };
128
147
  //# sourceMappingURL=pleodigital-design-system-votey-angular.mjs.map
package/dist/angular/fesm2022/pleodigital-design-system-votey-angular.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"pleodigital-design-system-votey-angular.mjs","sources":["../../../angular/src/lib/votey-device.service.ts","../../../angular/src/pleodigital-design-system-votey-angular.ts"],"sourcesContent":["import { DOCUMENT, isPlatformBrowser } from \"@angular/common\";\nimport {\n EnvironmentProviders,\n inject,\n Injectable,\n OnDestroy,\n PLATFORM_ID,\n provideEnvironmentInitializer,\n} from \"@angular/core\";\nimport DeviceDetector from \"node-device-detector\";\nimport { BehaviorSubject, Observable } from \"rxjs\";\n\nexport type VoteyDevice = \"mobile\" | \"tablet\" | \"desktop\";\nexport type VoteyDeviceOrientation = \"vertical\" | \"horizontal\";\n\nexport interface VoteyDeviceDimensions {\n width: number;\n height: number;\n mobileBreakpoint: 375;\n tabletBreakpoint: 1024;\n laptopBreakpoint: 1280;\n desktopBreakpoint: 1920;\n}\n\nconst DEFAULT_DIMENSIONS: VoteyDeviceDimensions = {\n width: 0,\n height: 0,\n mobileBreakpoint: 375,\n tabletBreakpoint: 1024,\n laptopBreakpoint: 1280,\n desktopBreakpoint: 1920,\n};\n\n@Injectable({\n providedIn: \"root\",\n})\nexport class VoteyDeviceService implements OnDestroy {\n private readonly document: Document = inject(DOCUMENT);\n private readonly platformId: object = inject(PLATFORM_ID);\n private readonly deviceTypeSubject = new BehaviorSubject<VoteyDevice | null>(\n null,\n );\n private readonly dimensionsSubject =\n new BehaviorSubject<VoteyDeviceDimensions>(DEFAULT_DIMENSIONS);\n private readonly initializedSubject = new BehaviorSubject<boolean>(false);\n private listeningForResize = false;\n\n public readonly deviceType$: Observable<VoteyDevice | null> =\n this.deviceTypeSubject.asObservable();\n public readonly deviceDimensions$: Observable<VoteyDeviceDimensions> =\n this.dimensionsSubject.asObservable();\n public readonly initialized$: Observable<boolean> =\n this.initializedSubject.asObservable();\n\n public currentDevice: VoteyDevice | null = null;\n public deviceOrientation: VoteyDeviceOrientation = \"vertical\";\n public isMobileDevice = false;\n public isTabletDevice = false;\n public isDesktopDevice = false;\n\n private readonly handleResize = (): void => {\n const browserWindow = this.document.defaultView;\n\n if (browserWindow) {\n this.update(browserWindow.innerWidth, browserWindow.innerHeight);\n }\n };\n\n public initialize(): void {\n if (!isPlatformBrowser(this.platformId)) {\n return;\n }\n\n const browserWindow = this.document.defaultView;\n\n if (!browserWindow) {\n return;\n }\n\n this.update(browserWindow.innerWidth, browserWindow.innerHeight);\n\n if (!this.listeningForResize) {\n browserWindow.addEventListener(\"resize\", this.handleResize, {\n passive: true,\n });\n this.listeningForResize = true;\n }\n }\n\n public update(innerWidth: number, innerHeight: number): void {\n const browserWindow = this.document.defaultView;\n\n if (!browserWindow) {\n return;\n }\n\n this.dimensionsSubject.next({\n ...DEFAULT_DIMENSIONS,\n width: innerWidth,\n height: innerHeight,\n });\n this.deviceOrientation =\n innerWidth > innerHeight ? \"horizontal\" : \"vertical\";\n\n this.detectDevice(browserWindow.navigator);\n this.applyDocumentState(innerHeight);\n this.initializedSubject.next(true);\n }\n\n public ngOnDestroy(): void {\n const browserWindow = this.document.defaultView;\n\n if (browserWindow && this.listeningForResize) {\n browserWindow.removeEventListener(\"resize\", this.handleResize);\n this.listeningForResize = false;\n }\n }\n\n private detectDevice(browserNavigator: Navigator): void {\n const detector = new DeviceDetector({\n clientIndexes: true,\n deviceIndexes: true,\n osIndexes: true,\n deviceAliasCode: false,\n deviceTrusted: false,\n deviceInfo: false,\n maxUserAgentSize: 500,\n });\n const result = detector.detect(browserNavigator.userAgent);\n const isTouchMac =\n result.device.type === \"desktop\" &&\n browserNavigator.maxTouchPoints > 2 &&\n /Macintosh/.test(browserNavigator.userAgent);\n\n this.isMobileDevice =\n result.device.type === \"smartphone\" ||\n result.device.type === \"phablet\" ||\n result.device.type === \"feature phone\";\n this.isTabletDevice = result.device.type === \"tablet\" || isTouchMac;\n this.isDesktopDevice = !this.isMobileDevice && !this.isTabletDevice;\n this.currentDevice = this.isMobileDevice\n ? \"mobile\"\n : this.isTabletDevice\n ? \"tablet\"\n : \"desktop\";\n }\n\n private applyDocumentState(innerHeight: number): void {\n if (!this.currentDevice) {\n return;\n }\n\n this.deviceTypeSubject.next(this.currentDevice);\n this.document.body.setAttribute(\"data-device\", this.currentDevice);\n this.document.body.setAttribute(\n \"data-orientation\",\n this.deviceOrientation,\n );\n this.document.documentElement.style.setProperty(\n \"--vh\",\n `${innerHeight / 100}px`,\n );\n }\n}\n\nexport function provideVoteyDeviceDetection(): EnvironmentProviders {\n return provideEnvironmentInitializer((): void =>\n inject(VoteyDeviceService).initialize(),\n );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"pleodigital-design-system-votey-angular.mjs","sources":["../../../angular/src/lib/votey-device.service.ts","../../../angular/src/pleodigital-design-system-votey-angular.ts"],"sourcesContent":["import { DOCUMENT, isPlatformBrowser } from \"@angular/common\";\nimport {\n EnvironmentProviders,\n inject,\n InjectionToken,\n Injectable,\n makeEnvironmentProviders,\n OnDestroy,\n PLATFORM_ID,\n provideEnvironmentInitializer,\n} from \"@angular/core\";\nimport DeviceDetector from \"node-device-detector\";\nimport { BehaviorSubject, Observable } from \"rxjs\";\n\nexport type VoteyDevice = \"mobile\" | \"tablet\" | \"desktop\";\nexport type VoteyDeviceOrientation = \"vertical\" | \"horizontal\";\n\nexport interface VoteyGridConfig {\n readonly desktop: number;\n readonly tablet: number;\n readonly mobile: number;\n}\n\nexport interface VoteyDeviceDimensions {\n width: number;\n height: number;\n mobileBreakpoint: 375;\n tabletBreakpoint: 1024;\n laptopBreakpoint: 1280;\n desktopBreakpoint: 1920;\n}\n\nconst DEFAULT_DIMENSIONS: VoteyDeviceDimensions = {\n width: 0,\n height: 0,\n mobileBreakpoint: 375,\n tabletBreakpoint: 1024,\n laptopBreakpoint: 1280,\n desktopBreakpoint: 1920,\n};\n\nexport const VOTEY_DEFAULT_GRID_CONFIG: Readonly<VoteyGridConfig> =\n Object.freeze({\n desktop: 12,\n tablet: 8,\n mobile: 4,\n });\n\nexport const VOTEY_GRID_CONFIG = new InjectionToken<VoteyGridConfig>(\n \"VoteyGridConfig\",\n);\n\n@Injectable({\n providedIn: \"root\",\n})\nexport class VoteyDeviceService implements OnDestroy {\n private readonly document: Document = inject(DOCUMENT);\n private readonly gridConfig: VoteyGridConfig =\n inject(VOTEY_GRID_CONFIG, { optional: true }) ??\n VOTEY_DEFAULT_GRID_CONFIG;\n private readonly platformId: object = inject(PLATFORM_ID);\n private readonly deviceTypeSubject = new BehaviorSubject<VoteyDevice | null>(\n null,\n );\n private readonly dimensionsSubject =\n new BehaviorSubject<VoteyDeviceDimensions>(DEFAULT_DIMENSIONS);\n private readonly initializedSubject = new BehaviorSubject<boolean>(false);\n private readonly columnsAmountSubject = new BehaviorSubject<number>(0);\n private listeningForResize = false;\n\n public readonly deviceType$: Observable<VoteyDevice | null> =\n this.deviceTypeSubject.asObservable();\n public readonly deviceDimensions$: Observable<VoteyDeviceDimensions> =\n this.dimensionsSubject.asObservable();\n public readonly initialized$: Observable<boolean> =\n this.initializedSubject.asObservable();\n public readonly columnsAmount$: Observable<number> =\n this.columnsAmountSubject.asObservable();\n\n public columnsAmount = 0;\n public currentDevice: VoteyDevice | null = null;\n public deviceOrientation: VoteyDeviceOrientation = \"vertical\";\n public isMobileDevice = false;\n public isTabletDevice = false;\n public isDesktopDevice = false;\n\n private readonly handleResize = (): void => {\n const browserWindow = this.document.defaultView;\n\n if (browserWindow) {\n this.update(browserWindow.innerWidth, browserWindow.innerHeight);\n }\n };\n\n public initialize(): void {\n if (!isPlatformBrowser(this.platformId)) {\n return;\n }\n\n const browserWindow = this.document.defaultView;\n\n if (!browserWindow) {\n return;\n }\n\n this.update(browserWindow.innerWidth, browserWindow.innerHeight);\n\n if (!this.listeningForResize) {\n browserWindow.addEventListener(\"resize\", this.handleResize, {\n passive: true,\n });\n this.listeningForResize = true;\n }\n }\n\n public update(innerWidth: number, innerHeight: number): void {\n const browserWindow = this.document.defaultView;\n\n if (!browserWindow) {\n return;\n }\n\n this.dimensionsSubject.next({\n ...DEFAULT_DIMENSIONS,\n width: innerWidth,\n height: innerHeight,\n });\n this.deviceOrientation =\n innerWidth > innerHeight ? \"horizontal\" : \"vertical\";\n\n this.detectDevice(browserWindow.navigator);\n this.applyDocumentState(innerHeight);\n this.initializedSubject.next(true);\n }\n\n public ngOnDestroy(): void {\n const browserWindow = this.document.defaultView;\n\n if (browserWindow && this.listeningForResize) {\n browserWindow.removeEventListener(\"resize\", this.handleResize);\n this.listeningForResize = false;\n }\n }\n\n private detectDevice(browserNavigator: Navigator): void {\n const detector = new DeviceDetector({\n clientIndexes: true,\n deviceIndexes: true,\n osIndexes: true,\n deviceAliasCode: false,\n deviceTrusted: false,\n deviceInfo: false,\n maxUserAgentSize: 500,\n });\n const result = detector.detect(browserNavigator.userAgent);\n const isTouchMac =\n result.device.type === \"desktop\" &&\n browserNavigator.maxTouchPoints > 2 &&\n /Macintosh/.test(browserNavigator.userAgent);\n\n this.isMobileDevice =\n result.device.type === \"smartphone\" ||\n result.device.type === \"phablet\" ||\n result.device.type === \"feature phone\";\n this.isTabletDevice = result.device.type === \"tablet\" || isTouchMac;\n this.isDesktopDevice = !this.isMobileDevice && !this.isTabletDevice;\n this.currentDevice = this.isMobileDevice\n ? \"mobile\"\n : this.isTabletDevice\n ? \"tablet\"\n : \"desktop\";\n this.columnsAmount = this.gridConfig[this.currentDevice];\n this.columnsAmountSubject.next(this.columnsAmount);\n }\n\n private applyDocumentState(innerHeight: number): void {\n if (!this.currentDevice) {\n return;\n }\n\n this.deviceTypeSubject.next(this.currentDevice);\n this.document.body.setAttribute(\"data-device\", this.currentDevice);\n this.document.body.setAttribute(\n \"data-orientation\",\n this.deviceOrientation,\n );\n this.document.documentElement.style.setProperty(\n \"--vh\",\n `${innerHeight / 100}px`,\n );\n }\n}\n\nexport function provideVoteyDeviceDetection(\n gridConfig: VoteyGridConfig = VOTEY_DEFAULT_GRID_CONFIG,\n): EnvironmentProviders {\n return makeEnvironmentProviders([\n {\n provide: VOTEY_GRID_CONFIG,\n useValue: gridConfig,\n },\n provideEnvironmentInitializer((): void =>\n inject(VoteyDeviceService).initialize(),\n ),\n ]);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
package/dist/angular/types/pleodigital-design-system-votey-angular.d.ts CHANGED
@@ -1,9 +1,14 @@
1
1
  import * as i0 from '@angular/core';
2
- import { EnvironmentProviders, OnDestroy } from '@angular/core';
2
+ import { EnvironmentProviders, OnDestroy, InjectionToken } from '@angular/core';
3
3
  import { Observable } from 'rxjs';
4
4
 
5
5
  type VoteyDevice = "mobile" | "tablet" | "desktop";
6
6
  type VoteyDeviceOrientation = "vertical" | "horizontal";
7
+ interface VoteyGridConfig {
8
+ readonly desktop: number;
9
+ readonly tablet: number;
10
+ readonly mobile: number;
11
+ }
7
12
  interface VoteyDeviceDimensions {
8
13
  width: number;
9
14
  height: number;
@@ -12,16 +17,22 @@ interface VoteyDeviceDimensions {
12
17
  laptopBreakpoint: 1280;
13
18
  desktopBreakpoint: 1920;
14
19
  }
20
+ declare const VOTEY_DEFAULT_GRID_CONFIG: Readonly<VoteyGridConfig>;
21
+ declare const VOTEY_GRID_CONFIG: InjectionToken<VoteyGridConfig>;
15
22
  declare class VoteyDeviceService implements OnDestroy {
16
23
  private readonly document;
24
+ private readonly gridConfig;
17
25
  private readonly platformId;
18
26
  private readonly deviceTypeSubject;
19
27
  private readonly dimensionsSubject;
20
28
  private readonly initializedSubject;
29
+ private readonly columnsAmountSubject;
21
30
  private listeningForResize;
22
31
  readonly deviceType$: Observable<VoteyDevice | null>;
23
32
  readonly deviceDimensions$: Observable<VoteyDeviceDimensions>;
24
33
  readonly initialized$: Observable<boolean>;
34
+ readonly columnsAmount$: Observable<number>;
35
+ columnsAmount: number;
25
36
  currentDevice: VoteyDevice | null;
26
37
  deviceOrientation: VoteyDeviceOrientation;
27
38
  isMobileDevice: boolean;
@@ -36,7 +47,7 @@ declare class VoteyDeviceService implements OnDestroy {
36
47
  static ɵfac: i0.ɵɵFactoryDeclaration<VoteyDeviceService, never>;
37
48
  static ɵprov: i0.ɵɵInjectableDeclaration<VoteyDeviceService>;
38
49
  }
39
- declare function provideVoteyDeviceDetection(): EnvironmentProviders;
50
+ declare function provideVoteyDeviceDetection(gridConfig?: VoteyGridConfig): EnvironmentProviders;
40
51
 
41
- export { VoteyDeviceService, provideVoteyDeviceDetection };
42
- export type { VoteyDevice, VoteyDeviceDimensions, VoteyDeviceOrientation };
52
+ export { VOTEY_DEFAULT_GRID_CONFIG, VOTEY_GRID_CONFIG, VoteyDeviceService, provideVoteyDeviceDetection };
53
+ export type { VoteyDevice, VoteyDeviceDimensions, VoteyDeviceOrientation, VoteyGridConfig };
package/dist/css/tokens.angular.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Generated file. Do not edit directly.
3
- * CRM/Angular token entry point: shared color core, CRM light semantics,
3
+ * CRM/Angular token entry point: shared color core, CRM light/dark semantics,
4
4
  * fixed spacing, radius and responsive spacing/typography.
5
5
  */
6
6
  :root {
@@ -127,6 +127,43 @@
127
127
  --color-overlay-accent-end: rgba(2, 194, 149, 0);
128
128
  }
129
129
 
130
+ /* CRM dark semantic colors. */
131
+ :root[data-theme="dark"],
132
+ [data-votey-theme="dark"] {
133
+ --color-bg-page: var(--color-navy-blue-900);
134
+ --color-bg-surface: var(--color-navy-blue-800);
135
+ --color-bg-surface-raised: var(--color-navy-blue-700);
136
+ --color-bg-surface-tint: var(--color-navy-blue-700);
137
+ --color-bg-sidebar: var(--color-navy-blue-900);
138
+ --color-bg-hero: var(--color-orange-800);
139
+ --color-bg-inverse: var(--color-white);
140
+ --color-text-primary: var(--color-white);
141
+ --color-text-secondary: var(--color-navy-blue-70);
142
+ --color-text-muted: var(--color-navy-blue-100);
143
+ --color-text-inverse: var(--color-navy-blue-800);
144
+ --color-text-accent: var(--color-mint-green-400);
145
+ --color-text-on-sidebar: var(--color-white);
146
+ --color-accent-primary: var(--color-mint-green-400);
147
+ --color-accent-strong: var(--color-mint-green-500);
148
+ --color-accent-on-accent: var(--color-navy-blue-800);
149
+ --color-accent-hover: var(--color-mint-green-500);
150
+ --color-accent-soft: var(--color-mint-green-900);
151
+ --color-border-subtle: var(--color-navy-blue-600);
152
+ --color-border-strong: var(--color-navy-blue-400);
153
+ --color-border-focus: var(--color-blue-300);
154
+ --color-state-error: var(--color-red-200);
155
+ --color-state-error-bg: var(--color-red-600);
156
+ --color-state-success: var(--color-active-green-300);
157
+ --color-state-warning: var(--color-yellow-400);
158
+ --color-state-info: var(--color-blue-300);
159
+ --color-shadow-soft: rgba(1, 0, 39, 0.08);
160
+ --color-shadow-event-filter: rgba(19, 18, 93, 0.3);
161
+ --color-overlay-loader: rgba(255, 255, 255, 0.78);
162
+ --color-overlay-loader-soft: rgba(255, 255, 255, 0.68);
163
+ --color-overlay-accent-start: rgba(136, 234, 125, 0.3);
164
+ --color-overlay-accent-end: rgba(2, 194, 149, 0);
165
+ }
166
+
130
167
  /* Responsive spacing and typography. */
131
168
  :root {
132
169
  --font-family-open-sans: "Open Sans", Arial, sans-serif;
@@ -4451,3 +4488,34 @@ body[data-device=mobile] {
4451
4488
  --space-icon-gap: 12px;
4452
4489
  }
4453
4490
  }
4491
+
4492
+ /* CRM grid tokens. */
4493
+ body[data-device=mobile] {
4494
+ --grid-columns: 4;
4495
+ --grid-margin: 3.7333333333vw;
4496
+ --grid-margin-extra: 6.4vw;
4497
+ --grid-column-gap: 3.2vw;
4498
+ --grid-column-width: calc(
4499
+ (100vw - 7.4666666667vw - 9.6vw) / 4
4500
+ );
4501
+ }
4502
+
4503
+ body[data-device=tablet] {
4504
+ --grid-columns: 8;
4505
+ --grid-margin: 1.5625vw;
4506
+ --grid-margin-extra: 3.125vw;
4507
+ --grid-column-gap: 1.5625vw;
4508
+ --grid-column-width: calc(
4509
+ (100vw - 3.125vw - 10.9375vw) / 8
4510
+ );
4511
+ }
4512
+
4513
+ body[data-device=desktop] {
4514
+ --grid-columns: 12;
4515
+ --grid-margin: 1.0416666667vw;
4516
+ --grid-margin-extra: 2.0833333333vw;
4517
+ --grid-column-gap: 0.8333333333vw;
4518
+ --grid-column-width: calc(
4519
+ (100vw - 2.0833333333vw - 9.1666666667vw) / 12
4520
+ );
4521
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pleodigital/design-system-votey",
3
- "version": "1.0.138",
3
+ "version": "1.0.140",
4
4
  "description": "Centralny system tokenów projektowych generowany przez Style Dictionary.",
5
5
  "main": "dist/js/tailwind-preset.js",
6
6
  "exports": {