@policystudio/policy-studio-ui-vue 1.1.44 → 1.1.47

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.
@@ -1,6 +1,5 @@
1
1
  import { create } from '@storybook/theming';
2
2
  import logo from '../src/assets/images/policy-studio.svg';
3
- console.log('logo:', logo)
4
3
 
5
4
  export default create({
6
5
  base: 'light',
@@ -0,0 +1,3 @@
1
+ import Vue from 'vue';
2
+
3
+ export const eventBus = new Vue();
@@ -1930,6 +1930,18 @@ video {
1930
1930
  overflow: auto;
1931
1931
  }
1932
1932
 
1933
+ .psui-el-table-results-wrapper.table-flexible {
1934
+ padding-left: 1rem;
1935
+ padding-right: 1rem;
1936
+ padding-top: 0.5rem;
1937
+ padding-bottom: 0.5rem;
1938
+ border-width: 1px;
1939
+ --border-opacity: 1;
1940
+ border-color: #E6ECF2;
1941
+ border-color: rgba(230, 236, 242, var(--border-opacity));
1942
+ border-radius: 0.5rem;
1943
+ }
1944
+
1933
1945
  .psui-el-table-results {
1934
1946
  position: relative;
1935
1947
  vertical-align: top;
@@ -2116,10 +2128,11 @@ video {
2116
2128
  background-color: rgba(243, 246, 249, var(--bg-opacity));
2117
2129
  }
2118
2130
 
2119
- .psui-el-table-results.layout-comparison {
2120
- border-collapse: separate;
2121
- border-spacing: 0px 8px;
2122
- }
2131
+ .psui-el-table-results.layout-comparison.is-sticky tr:first-of-type th:first-child,
2132
+ .psui-el-table-results.layout-comparison.is-sticky td:first-child {
2133
+ box-shadow: 3px 0px 10px 0px rgba(0, 0, 0, 0.15);
2134
+ border-right-color: transparent;
2135
+ }
2123
2136
 
2124
2137
  .psui-el-table-results.layout-comparison tr th, .psui-el-table-results.layout-comparison tr td {
2125
2138
  position: relative;
@@ -2171,10 +2184,10 @@ video {
2171
2184
  .psui-el-table-results.layout-comparison thead tr:not(:first-of-type) th:after {
2172
2185
  position: absolute;
2173
2186
  top: 0;
2174
- right: 0;
2175
2187
  display: inline-block;
2176
2188
  width: 1px;
2177
2189
  content: '';
2190
+ right: -1px;
2178
2191
  height: calc(100% + 0.5rem);
2179
2192
  background-color: #C3CAD1;
2180
2193
  }
@@ -2209,6 +2222,12 @@ video {
2209
2222
 
2210
2223
  .psui-el-table-results.layout-comparison thead tr:first-of-type th:first-child {
2211
2224
  vertical-align: middle;
2225
+ position: sticky;
2226
+ z-index: 10;
2227
+ left: 0;
2228
+ --bg-opacity: 1;
2229
+ background-color: #E6ECF2;
2230
+ background-color: rgba(230, 236, 242, var(--bg-opacity));
2212
2231
  padding-left: 22px;
2213
2232
  min-width: 240px;
2214
2233
  }
@@ -2244,10 +2263,7 @@ video {
2244
2263
  }
2245
2264
 
2246
2265
  .psui-el-table-results.layout-comparison tbody tr {
2247
- transition-property: all;
2248
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2249
- transition-duration: 150ms;
2250
- box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.03), 0px 1px 2px rgba(0, 0, 0, 0.1);
2266
+ border-bottom: 8px solid transparent;
2251
2267
  }
2252
2268
 
2253
2269
  .psui-el-table-results.layout-comparison tbody tr td {
@@ -2255,6 +2271,11 @@ video {
2255
2271
  border-right: 1px solid #C8D0D9;
2256
2272
  }
2257
2273
 
2274
+ .psui-el-table-results.layout-comparison tbody tr td > div {
2275
+ position: relative;
2276
+ z-index: 3;
2277
+ }
2278
+
2258
2279
  .psui-el-table-results.layout-comparison tbody tr td .title {
2259
2280
  font-size: 14px;
2260
2281
  line-height: 130%;
@@ -2280,16 +2301,28 @@ video {
2280
2301
  background-color: #D3EFDE;
2281
2302
  }
2282
2303
 
2283
- .psui-el-table-results.layout-comparison tbody tr td:before {
2284
- display: inline-block;
2304
+ .psui-el-table-results.layout-comparison tbody tr td:before,
2305
+ .psui-el-table-results.layout-comparison tbody tr td:after {
2306
+ content: '';
2285
2307
  position: absolute;
2286
- height: 0.5rem;
2287
2308
  left: 0;
2288
- content: '';
2289
- top: -8px;
2290
- width: calc(100% + 2px);
2291
- border-right: 2px solid #C8D0D9;
2292
- background-color: #FFF;
2309
+ width: 100%;
2310
+ background-color: #fff;
2311
+ }
2312
+
2313
+ .psui-el-table-results.layout-comparison tbody tr td:before {
2314
+ top: 0;
2315
+ height: 100%;
2316
+ box-shadow: 0px 0px 4px rgb(0 0 0 / 3%), 0px 1px 2px rgb(0 0 0 / 10%);
2317
+ z-index: 1;
2318
+ }
2319
+
2320
+ .psui-el-table-results.layout-comparison tbody tr td:after {
2321
+ background-color: #fff;
2322
+ bottom: 0;
2323
+ height: 8px;
2324
+ z-index: 11;
2325
+ width: calc(100% - 1px);
2293
2326
  }
2294
2327
 
2295
2328
  .psui-el-table-results.layout-comparison tbody tr td:first-child {
@@ -2297,6 +2330,10 @@ video {
2297
2330
  padding-right: 0.75rem;
2298
2331
  border-top-left-radius: 0.375rem;
2299
2332
  border-bottom-left-radius: 0.375rem;
2333
+ background-color: #ffffff ;
2334
+ position: sticky;
2335
+ z-index: 10;
2336
+ left: 0;
2300
2337
  border-right-width: 2px;
2301
2338
  }
2302
2339
 
@@ -2305,24 +2342,267 @@ video {
2305
2342
  padding-right: 0.75rem;
2306
2343
  border-top-right-radius: 0.375rem;
2307
2344
  border-bottom-right-radius: 0.375rem;
2345
+ border-right-width: 0;
2308
2346
  }
2309
2347
 
2310
- .psui-el-table-results.layout-comparison tbody tr.is-first td:before {
2311
- display: none;
2348
+ .psui-el-table-results.layout-comparison tbody tr.opened td:before {
2349
+ box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.04), 0px 5px 6px rgba(0, 0, 0, 0.1);
2312
2350
  }
2313
2351
 
2314
2352
  .psui-el-table-results.layout-comparison tbody tr.is-first.opened td:first-child {
2315
2353
  border-bottom-left-radius: 0;
2316
2354
  }
2317
2355
 
2318
- .psui-el-table-results.layout-comparison tbody tr.opened {
2319
- box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.04), 0px 5px 6px rgba(0, 0, 0, 0.1);
2320
- }
2356
+ .psui-el-table-results.layout-comparison tbody tr.is-first.opened td:last-child {
2357
+ border-bottom-right-radius: 0;
2358
+ }
2321
2359
 
2322
2360
  .psui-el-table-results.layout-comparison tbody tr:not(.is-first) td:first-child {
2323
2361
  border-top-left-radius: 0;
2324
2362
  }
2325
2363
 
2364
+ .psui-el-table-results.layout-comparison tbody tr:not(.is-first) td:last-child {
2365
+ border-top-right-radius: 0;
2366
+ }
2367
+
2368
+ .psui-el-table-results.layout-comparison tbody tr:not(.is-first).opened {
2369
+ border-bottom-width: 14px;
2370
+ }
2371
+
2372
+ .psui-el-table-results.layout-flexible tr th:last-child, .psui-el-table-results.layout-flexible tr td:last-child {
2373
+ padding-right: 0.5rem;
2374
+ }
2375
+
2376
+ .psui-el-table-results.layout-flexible thead {
2377
+ background-color: #ffffff ;
2378
+ align-items: flex-start;
2379
+ z-index: 15;
2380
+ }
2381
+
2382
+ .psui-el-table-results.layout-flexible thead:after {
2383
+ content: '';
2384
+ display: inline-block;
2385
+ position: absolute;
2386
+ top: 0;
2387
+ width: 0.5rem;
2388
+ height: 100%;
2389
+ background-color: #ffffff ;
2390
+ right: -8px;
2391
+ }
2392
+
2393
+ .psui-el-table-results.layout-flexible thead tr .title {
2394
+ font-size: 14px;
2395
+ line-height: 130%;
2396
+ font-weight: 700;
2397
+ line-height: 1rem;
2398
+ --text-opacity: 1;
2399
+ color: #28323B;
2400
+ color: rgba(40, 50, 59, var(--text-opacity));
2401
+ }
2402
+
2403
+ .psui-el-table-results.layout-flexible thead tr th {
2404
+ padding-left: 1.5rem;
2405
+ --text-opacity: 1;
2406
+ color: #798490;
2407
+ color: rgba(121, 132, 144, var(--text-opacity));
2408
+ text-align: right;
2409
+ width: auto;
2410
+ vertical-align: top;
2411
+ padding-top: 0.438rem;
2412
+ padding-bottom: 0.625rem;
2413
+ }
2414
+
2415
+ .psui-el-table-results.layout-flexible thead tr th .description {
2416
+ font-size: 12px;
2417
+ line-height: 130%;
2418
+ font-weight: 400;
2419
+ line-height: 110%;
2420
+ }
2421
+
2422
+ .psui-el-table-results.layout-flexible thead tr th:first-child {
2423
+ padding-left: 0;
2424
+ }
2425
+
2426
+ .psui-el-table-results.layout-flexible thead tr th:first-child > div {
2427
+ align-items: flex-start;
2428
+ }
2429
+
2430
+ .psui-el-table-results.layout-flexible thead tr:first-of-type th {
2431
+ text-align: left;
2432
+ padding-top: 0;
2433
+ padding-bottom: 0;
2434
+ }
2435
+
2436
+ .psui-el-table-results.layout-flexible thead tr:first-of-type th > div {
2437
+ display: flex;
2438
+ flex-direction: row;
2439
+ border-bottom-width: 1px;
2440
+ --border-opacity: 1;
2441
+ border-color: #D6DDE5;
2442
+ border-color: rgba(214, 221, 229, var(--border-opacity));
2443
+ padding-top: 0.5rem;
2444
+ padding-bottom: 0.625rem;
2445
+ }
2446
+
2447
+ .psui-el-table-results.layout-flexible thead tr:first-of-type p {
2448
+ font-size: 16px;
2449
+ line-height: 130%;
2450
+ line-height: 18px;
2451
+ }
2452
+
2453
+ .psui-el-table-results.layout-flexible thead tr:not(:first-of-type) th:first-child {
2454
+ text-align: left;
2455
+ }
2456
+
2457
+ .psui-el-table-results.layout-flexible tbody tr {
2458
+ border-bottom-width: 1px;
2459
+ --border-opacity: 1;
2460
+ border-color: #E6ECF2;
2461
+ border-color: rgba(230, 236, 242, var(--border-opacity));
2462
+ }
2463
+
2464
+ .psui-el-table-results.layout-flexible tbody tr .title {
2465
+ display: flex;
2466
+ align-items: center;
2467
+ line-height: 24px;
2468
+ }
2469
+
2470
+ .psui-el-table-results.layout-flexible tbody tr td {
2471
+ padding-left: 2rem;
2472
+ --text-opacity: 1;
2473
+ color: #34404A;
2474
+ color: rgba(52, 64, 74, var(--text-opacity));
2475
+ height: 2.5rem;
2476
+ text-align: right;
2477
+ font-size: 14px;
2478
+ line-height: 130%;
2479
+ padding-top: 0.688rem;
2480
+ padding-bottom: 0.688rem;
2481
+ min-height: 41.5px;
2482
+ }
2483
+
2484
+ .psui-el-table-results.layout-flexible tbody tr td > div {
2485
+ display: flex;
2486
+ align-items: center;
2487
+ }
2488
+
2489
+ .psui-el-table-results.layout-flexible tbody tr td .actions {
2490
+ display: flex;
2491
+ align-items: center;
2492
+ height: 100%;
2493
+ position: relative;
2494
+ }
2495
+
2496
+ .psui-el-table-results.layout-flexible tbody tr td .actions-button {
2497
+ cursor: pointer;
2498
+ margin-left: 0.25rem;
2499
+ }
2500
+
2501
+ .psui-el-table-results.layout-flexible tbody tr td .actions .is-last-deep {
2502
+ padding-left: 1rem;
2503
+ }
2504
+
2505
+ .psui-el-table-results.layout-flexible tbody tr td:first-child {
2506
+ padding-left: 0;
2507
+ padding-right: 2rem;
2508
+ text-align: left;
2509
+ display: block;
2510
+ padding-top: 8px;
2511
+ padding-bottom: 8px;
2512
+ }
2513
+
2514
+ .psui-el-table-results.layout-flexible tbody tr td.column-flexible_score {
2515
+ --text-opacity: 1;
2516
+ color: #A2ACB7;
2517
+ color: rgba(162, 172, 183, var(--text-opacity));
2518
+ }
2519
+
2520
+ .psui-el-table-results.layout-flexible tbody tr td .psui-el-tooltip-dialog {
2521
+ text-align: left;
2522
+ max-width: 180px;
2523
+ }
2524
+
2525
+ .psui-el-table-results.layout-flexible tbody tr td .psui-el-tooltip-dialog .psui-el-tooltip-content-wrapper {
2526
+ white-space: normal;
2527
+ }
2528
+
2529
+ .psui-el-table-results.layout-flexible tbody tr.is-first {
2530
+ border-color: transparent;
2531
+ }
2532
+
2533
+ .psui-el-table-results.layout-flexible tbody tr.is-first .actions-button span {
2534
+ font-size: 16px !important;
2535
+ }
2536
+
2537
+ .psui-el-table-results.layout-flexible tbody tr.is-first .title {
2538
+ font-size: 12px;
2539
+ line-height: 130%;
2540
+ font-weight: 700;
2541
+ --text-opacity: 1;
2542
+ color: #515E6A;
2543
+ color: rgba(81, 94, 106, var(--text-opacity));
2544
+ }
2545
+
2546
+ .psui-el-table-results.layout-flexible tbody tr.is-first td {
2547
+ height: auto;
2548
+ padding-top: 0.5rem;
2549
+ padding-bottom: 0;
2550
+ min-height: 1rem;
2551
+ }
2552
+
2553
+ .psui-el-table-results.layout-flexible tbody tr:not(.is-first) td:first-child {
2554
+ position: relative;
2555
+ }
2556
+
2557
+ .psui-el-table-results.layout-flexible tbody tr:not(.is-first) td:first-child:before,
2558
+ .psui-el-table-results.layout-flexible tbody tr:not(.is-first) td:first-child:after {
2559
+ content: '';
2560
+ position: absolute;
2561
+ top: 0;
2562
+ }
2563
+
2564
+ .psui-el-table-results.layout-flexible tbody tr:not(.is-first) td:first-child:before {
2565
+ background-color: #ffffff ;
2566
+ left: 0;
2567
+ width: 22px;
2568
+ height: calc(100% + 1px);
2569
+ }
2570
+
2571
+ .psui-el-table-results.layout-flexible tbody tr:not(.is-first) td:first-child:after {
2572
+ --bg-opacity: 1;
2573
+ background-color: #E6ECF2;
2574
+ background-color: rgba(230, 236, 242, var(--bg-opacity));
2575
+ width: 1px;
2576
+ height: 0;
2577
+ left: 11px;
2578
+ }
2579
+
2580
+ .psui-el-table-results.layout-flexible tbody tr:not(.is-first):hover td {
2581
+ --bg-opacity: 1;
2582
+ background-color: #ECF7FB;
2583
+ background-color: rgba(236, 247, 251, var(--bg-opacity));
2584
+ }
2585
+
2586
+ .psui-el-table-results.layout-flexible tbody tr:not(.is-first).opened td:first-child:after {
2587
+ height: calc(100% + 1px);
2588
+ }
2589
+
2590
+ .psui-el-table-results.layout-flexible tbody tr.is-last {
2591
+ border-bottom-width: 0;
2592
+ }
2593
+
2594
+ .psui-el-table-results.layout-flexible tbody tr.is-active {
2595
+ --bg-opacity: 1;
2596
+ background-color: #F3F6F9;
2597
+ background-color: rgba(243, 246, 249, var(--bg-opacity));
2598
+ }
2599
+
2600
+ .psui-el-table-results.layout-flexible tbody tr.is-active td:first-child {
2601
+ --bg-opacity: 1;
2602
+ background-color: #F3F6F9;
2603
+ background-color: rgba(243, 246, 249, var(--bg-opacity));
2604
+ }
2605
+
2326
2606
  .psui-el-checkbox {
2327
2607
  position: relative;
2328
2608
  --text-opacity: 1;
@@ -2730,7 +3010,7 @@ video {
2730
3010
  pointer-events: none;
2731
3011
  }
2732
3012
 
2733
- .psui-el-switch.size-big{
3013
+ .psui-el-switch.size-big {
2734
3014
  width: 46px;
2735
3015
  height: 24px;
2736
3016
  }
@@ -2750,7 +3030,6 @@ video {
2750
3030
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2751
3031
  transition-duration: 300ms;
2752
3032
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.04), 0px 5px 6px rgba(0, 0, 0, 0.1);
2753
- box-shadow: 0 0 98px 6px rgba(0, 0, 0, 0.2);
2754
3033
  left: 2px;
2755
3034
  top: 2px;
2756
3035
  content: '';
@@ -2772,13 +3051,12 @@ video {
2772
3051
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2773
3052
  transition-duration: 300ms;
2774
3053
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.04), 0px 5px 6px rgba(0, 0, 0, 0.1);
2775
- box-shadow: 0 0 98px 6px rgba(0, 0, 0, 0.2);
2776
3054
  left: 16px;
2777
3055
  top: 2px;
2778
3056
  content: '';
2779
3057
  }
2780
3058
 
2781
- .psui-el-switch :focus {
3059
+ .psui-el-switch:focus {
2782
3060
  outline: 2px solid transparent;
2783
3061
  outline-offset: 2px;
2784
3062
  }
@@ -3065,11 +3343,11 @@ video {
3065
3343
  color: rgba(49, 143, 172, var(--text-opacity));
3066
3344
  }
3067
3345
 
3068
- .psui-el-slider .psui-el-slider-label {
3346
+ .psui-el-slider-label {
3069
3347
  margin-bottom: 0.5rem;
3070
3348
  }
3071
3349
 
3072
- .psui-el-slider .psui-el-slider-label span {
3350
+ .psui-el-slider-label span {
3073
3351
  --text-opacity: 1;
3074
3352
  color: #798490;
3075
3353
  color: rgba(121, 132, 144, var(--text-opacity));
@@ -3077,6 +3355,224 @@ video {
3077
3355
  line-height: 130%
3078
3356
  }
3079
3357
 
3358
+ .psui-el-slider-input {
3359
+ width: 100%;
3360
+ -webkit-appearance: none;
3361
+ height: 6px;
3362
+ border-radius: 5px;
3363
+ background: #d3d3d3;
3364
+ outline: none;
3365
+ opacity: 0.7;
3366
+ transition: opacity .2s;
3367
+ }
3368
+
3369
+ .psui-el-slider-input:hover {
3370
+ opacity: 1;
3371
+ }
3372
+
3373
+ .psui-el-slider-input::-webkit-slider-thumb {
3374
+ border: none;
3375
+ -webkit-appearance: none;
3376
+ appearance: none;
3377
+ width: 20px;
3378
+ height: 20px;
3379
+ border-radius: 50%;
3380
+ background: #64B5CE;
3381
+ cursor: pointer;
3382
+ }
3383
+
3384
+ .psui-el-slider-input::-moz-range-thumb {
3385
+ border: none;
3386
+ width: 20px;
3387
+ height: 20px;
3388
+ border-radius: 50%;
3389
+ background: #64B5CE;
3390
+ cursor: pointer;
3391
+ }
3392
+
3393
+ .psui-el-slider-input::-webkit-slider-progress,
3394
+ .psui-el-slider-input::-moz-range-progress {
3395
+ border-top-left-radius: 5px;
3396
+ border-bottom-left-radius: 5px;
3397
+ -webkit-appearance: none;
3398
+ box-shadow: none;
3399
+ border: none;
3400
+ background: #64B5CE;
3401
+ height: 6px;
3402
+ }
3403
+
3404
+ .psui-el-slider-bubble {
3405
+ --bg-opacity: 1;
3406
+ background-color: #E6ECF2;
3407
+ background-color: rgba(230, 236, 242, var(--bg-opacity));
3408
+ font-weight: 700;
3409
+ --text-opacity: 1;
3410
+ color: #798490;
3411
+ color: rgba(121, 132, 144, var(--text-opacity));
3412
+ padding-left: 0.5rem;
3413
+ padding-right: 0.5rem;
3414
+ padding-top: 1px;
3415
+ padding-bottom: 1px;
3416
+ border-radius: 0.125rem;
3417
+ float: left;
3418
+ margin-left: 0.5rem;
3419
+ }
3420
+
3421
+ .psui-el-slider.layout-default .psui-el-slider-range-value {
3422
+ position: relative;
3423
+ color: #ffffff ;
3424
+ font-weight: 700;
3425
+ --bg-opacity: 1;
3426
+ background-color: #A2ACB7;
3427
+ background-color: rgba(162, 172, 183, var(--bg-opacity));
3428
+ --text-opacity: 1;
3429
+ color: #E6ECF2;
3430
+ color: rgba(230, 236, 242, var(--text-opacity));
3431
+ border-radius: 0.375rem;
3432
+ width: 2.5rem;
3433
+ text-align: center;
3434
+ display: inline-block;
3435
+ transform: translateX(-6px);
3436
+ margin-bottom: 10px;
3437
+ padding: 2px 4px;
3438
+ }
3439
+
3440
+ .psui-el-slider.layout-rich .psui-el-slider-input {
3441
+ --bg-opacity: 1;
3442
+ background-color: #D6DDE5;
3443
+ background-color: rgba(214, 221, 229, var(--bg-opacity));
3444
+ border-radius: 0.25rem;
3445
+ box-shadow: 0px 1px 0px #FFFFFF, inset 0px 1px 2px rgba(0, 0, 0, 0.1);
3446
+ opacity: 1;
3447
+ height: 0.5rem;
3448
+ }
3449
+
3450
+ .psui-el-slider.layout-rich .psui-el-slider-input::-webkit-slider-thumb {
3451
+ position: relative;
3452
+ --bg-opacity: 1;
3453
+ background-color: #64B5CE;
3454
+ background-color: rgba(100, 181, 206, var(--bg-opacity));
3455
+ width: 1.5rem;
3456
+ height: 1.5rem;
3457
+ box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.04), 0px 2px 5px rgba(0, 0, 0, 0.08);
3458
+ background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iNiIgdmlld0JveD0iMCAwIDEyIDYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0iTTAuMzUzNzEyIDIuNjc0NDJMMy4xNDY2IDAuMTM0MDhDMy40NjE2OCAtMC4xNTI1MDYgMy45OTk5MiAwLjA1MDczODUgMy45OTk5MiAwLjQ1NjMwMVY1LjU0MzdDMy45OTk5MiA1Ljk0OTU1IDMuNDYxMDIgNi4xNTI2NiAzLjE0NjE0IDUuODY1NDlMMC4zNTMyNDUgMy4zMTg0NEMwLjE1ODExMSAzLjE0MDQ4IDAuMTU4MzIgMi44NTIxNCAwLjM1MzcxMiAyLjY3NDQyWiIgZmlsbD0id2hpdGUiLz4KICA8cGF0aCBkPSJNMTEuNjQ2MSAyLjY3NDQyTDguODUzMjQgMC4xMzQwOEM4LjUzODE3IC0wLjE1MjUwNiA3Ljk5OTkyIDAuMDUwNzM4NSA3Ljk5OTkyIDAuNDU2MzAxVjUuNTQzN0M3Ljk5OTkyIDUuOTQ5NTUgOC41Mzg4MyA2LjE1MjY2IDguODUzNzEgNS44NjU0OUwxMS42NDY2IDMuMzE4NDRDMTEuODQxNyAzLjE0MDQ4IDExLjg0MTUgMi44NTIxNCAxMS42NDYxIDIuNjc0NDJaIiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4=");
3459
+ background-position: center center;
3460
+ background-repeat: no-repeat;
3461
+ z-index: 30;
3462
+ }
3463
+
3464
+ .psui-el-slider.layout-rich .psui-el-slider-input::-moz-range-thumb {
3465
+ border: none;
3466
+ width: 20px;
3467
+ height: 20px;
3468
+ border-radius: 50%;
3469
+ background: #64B5CE;
3470
+ cursor: pointer;
3471
+ }
3472
+
3473
+ .psui-el-slider.layout-rich .psui-el-slider-wrapper {
3474
+ display: flex;
3475
+ flex-direction: column;
3476
+ justify-content: flex-end;
3477
+ position: relative;
3478
+ height: 80px;
3479
+ }
3480
+
3481
+ .psui-el-slider.layout-rich .psui-el-slider-wrapper-input {
3482
+ position: relative;
3483
+ }
3484
+
3485
+ .psui-el-slider.layout-rich .psui-el-slider-wrapper-input .slider-bar,
3486
+ .psui-el-slider.layout-rich .psui-el-slider-wrapper-input .slider-bar-bg,
3487
+ .psui-el-slider.layout-rich .psui-el-slider-wrapper-input .slider-bar-dynamic,
3488
+ .psui-el-slider.layout-rich .psui-el-slider-wrapper-input .slider-bar-max {
3489
+ position: absolute;
3490
+ top: 0;
3491
+ --bg-opacity: 1;
3492
+ background-color: #318FAC;
3493
+ background-color: rgba(49, 143, 172, var(--bg-opacity));
3494
+ box-shadow: 0px 1px 0px #FFFFFF, inset 0px 1px 2px rgba(0, 0, 0, 0.1);
3495
+ height: 0.5rem;
3496
+ }
3497
+
3498
+ .psui-el-slider.layout-rich .psui-el-slider-wrapper-input .slider-bar {
3499
+ --bg-opacity: 1;
3500
+ background-color: #318FAC;
3501
+ background-color: rgba(49, 143, 172, var(--bg-opacity));
3502
+ left: 0;
3503
+ border-radius: 0.25rem;
3504
+ z-index: 20;
3505
+ }
3506
+
3507
+ .psui-el-slider.layout-rich .psui-el-slider-wrapper-input .slider-bar-max {
3508
+ --bg-opacity: 1;
3509
+ background-color: #A2ACB7;
3510
+ background-color: rgba(162, 172, 183, var(--bg-opacity));
3511
+ right: 0;
3512
+ border-top-right-radius: 0.25rem;
3513
+ border-bottom-right-radius: 0.25rem;
3514
+ }
3515
+
3516
+ .psui-el-slider.layout-rich .psui-el-slider-wrapper-input .slider-bar-bg {
3517
+ z-index: 10;
3518
+ }
3519
+
3520
+ .psui-el-slider.layout-rich .psui-el-slider-wrapper-input .slider-bar-dynamic {
3521
+ z-index: 30;
3522
+ }
3523
+
3524
+ .psui-el-slider.layout-rich .psui-el-slider-range-value {
3525
+ position: absolute;
3526
+ --text-opacity: 1;
3527
+ color: #318FAC;
3528
+ color: rgba(49, 143, 172, var(--text-opacity));
3529
+ font-size: 12px;
3530
+ line-height: 130%;
3531
+ font-weight: 700;
3532
+ text-align: center;
3533
+ width: 1.5rem;
3534
+ display: inline-block;
3535
+ top: -28px;
3536
+ }
3537
+
3538
+ .psui-el-slider.layout-rich .psui-el-slider-grid {
3539
+ position: relative;
3540
+ display: flex;
3541
+ justify-content: space-between;
3542
+ padding-top: 10px;
3543
+ margin-top: 3px;
3544
+ height: 26px;
3545
+ }
3546
+
3547
+ .psui-el-slider.layout-rich .psui-el-slider-grid .line {
3548
+ position: absolute;
3549
+ top: 0;
3550
+ width: 1px;
3551
+ height: 0.5rem;
3552
+ --bg-opacity: 1;
3553
+ background-color: #515E6A;
3554
+ background-color: rgba(81, 94, 106, var(--bg-opacity));
3555
+ }
3556
+
3557
+ .psui-el-slider.layout-rich .psui-el-slider-grid .info {
3558
+ font-size: 12px;
3559
+ line-height: 130%;
3560
+ --text-opacity: 1;
3561
+ color: #515E6A;
3562
+ color: rgba(81, 94, 106, var(--text-opacity));
3563
+ width: 1.5rem;
3564
+ display: inline-block;
3565
+ text-align: center;
3566
+ }
3567
+
3568
+ .psui-el-slider.layout-rich .psui-el-slider-grid .info-min {
3569
+ transform: translateX(-12px);
3570
+ }
3571
+
3572
+ .psui-el-slider.layout-rich .psui-el-slider-grid .info-max {
3573
+ transform: translateX(12px);
3574
+ }
3575
+
3080
3576
  .psui-el-toast {
3081
3577
  display: flex;
3082
3578
  align-items: center;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@policystudio/policy-studio-ui-vue",
3
- "version": "1.1.44",
3
+ "version": "1.1.47",
4
4
  "description": "Policy Studio UI",
5
5
  "main": "src/index.js",
6
6
  "author": "Policy Studio Team",