@featherk/styles 0.6.2 → 0.6.4

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,4 +1,11 @@
1
1
  /* Compatible with @progress/kendo-theme-default v.8.2.0 */
2
+ @font-face {
3
+ font-family: Inter;
4
+ src: url("../fonts/Inter-Regular.woff2") format("woff2");
5
+ font-style: normal;
6
+ font-weight: 400;
7
+ font-display: auto;
8
+ }
2
9
  @font-face {
3
10
  font-family: Inter;
4
11
  src: url("../fonts/Inter-Light.woff2") format("woff2");
@@ -15,30 +22,30 @@
15
22
  }
16
23
  @font-face {
17
24
  font-family: Inter;
18
- src: url("../fonts/Inter-LightItalic.woff2") format("woff2");
25
+ src: url("../fonts/Inter-BoldItalic.woff2") format("woff2");
19
26
  font-style: italic;
20
- font-weight: 300;
27
+ font-weight: 700;
21
28
  font-display: auto;
22
29
  }
23
30
  @font-face {
24
31
  font-family: Inter;
25
- src: url("../fonts/Inter-Italic.woff2") format("woff2");
32
+ src: url("../fonts/Inter-MediumItalic.woff2") format("woff2");
26
33
  font-style: italic;
27
- font-weight: 400;
34
+ font-weight: 500;
28
35
  font-display: auto;
29
36
  }
30
37
  @font-face {
31
38
  font-family: Inter;
32
- src: url("../fonts/Inter-Regular.woff2") format("woff2");
33
- font-style: normal;
34
- font-weight: 400;
39
+ src: url("../fonts/Inter-LightItalic.woff2") format("woff2");
40
+ font-style: italic;
41
+ font-weight: 300;
35
42
  font-display: auto;
36
43
  }
37
44
  @font-face {
38
45
  font-family: Inter;
39
- src: url("../fonts/Inter-MediumItalic.woff2") format("woff2");
46
+ src: url("../fonts/Inter-Italic.woff2") format("woff2");
40
47
  font-style: italic;
41
- font-weight: 500;
48
+ font-weight: 400;
42
49
  font-display: auto;
43
50
  }
44
51
  @font-face {
@@ -48,13 +55,6 @@
48
55
  font-weight: 500;
49
56
  font-display: auto;
50
57
  }
51
- @font-face {
52
- font-family: Inter;
53
- src: url("../fonts/Inter-BoldItalic.woff2") format("woff2");
54
- font-style: italic;
55
- font-weight: 700;
56
- font-display: auto;
57
- }
58
58
  :root {
59
59
  --kendo-color-app-surface: rgb(252, 252, 255);
60
60
  --kendo-color-on-app-surface: rgba(10, 12, 27, 0.7);
@@ -47195,66 +47195,6 @@ kendo-scrollview.k-scrollview .k-scrollview-nav {
47195
47195
  --breakpoint-md: 600px;
47196
47196
  --breakpoint-lg: 1440px;
47197
47197
  }
47198
- .k-animation-container:has(.k-tooltip) {
47199
- white-space: overflow-wrap;
47200
- background-color: var(--kendo-color-primary-hover);
47201
- border-radius: 0.25rem;
47202
- max-width: 50ch;
47203
- }
47204
- .k-animation-container:has(.k-tooltip) .k-tooltip {
47205
- color: var(--kendo-color-light);
47206
- padding: 0.5rem 1rem;
47207
- font-size: 0.875rem;
47208
- box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
47209
- }
47210
- .k-animation-container:has(.k-tooltip) .k-callout {
47211
- display: none;
47212
- }
47213
- :is([class*="fk-popup-alert"]).k-animation-container .k-popup {
47214
- box-shadow: none;
47215
- border-radius: 0.25rem;
47216
- }
47217
- :is([class*="fk-popup-alert"]).k-animation-container .k-popup div {
47218
- display: flex;
47219
- flex-direction: row;
47220
- align-items: center;
47221
- gap: 1rem;
47222
- color: var(--kendo-color-secondary-text);
47223
- background-color: var(--kendo-color-surface);
47224
- padding-block: 0.25rem;
47225
- padding-inline: 1rem 0.5rem;
47226
- border-radius: 0.25rem;
47227
- border: 1px solid;
47228
- border-color: var(--kendo-color-border);
47229
- box-shadow: none;
47230
- cursor: pointer;
47231
- }
47232
- :is([class*="fk-popup-alert"]).k-animation-container .k-popup div .k-icon {
47233
- flex-shrink: 0;
47234
- align-self: start;
47235
- }
47236
- .fk-popup-alert-info.k-animation-container .k-popup div {
47237
- border-color: var(--kendo-color-info);
47238
- color: var(--kendo-color-info);
47239
- background-color: var(--kendo-color-info-subtle);
47240
- }
47241
- .fk-popup-alert-warning.k-animation-container .k-popup div {
47242
- border-color: var(--kendo-color-warning);
47243
- background-color: var(--kendo-color-warning-subtle);
47244
- }
47245
- .fk-popup-alert-error.k-animation-container .k-popup div {
47246
- border-color: var(--kendo-color-error);
47247
- color: var(--kendo-color-error);
47248
- background-color: var(--kendo-color-error-subtle);
47249
- }
47250
- .fk-popup-alert-success.k-animation-container .k-popup div {
47251
- border-color: var(--kendo-color-success);
47252
- color: var(--kendo-color-success);
47253
- background-color: var(--kendo-color-success-subtle);
47254
- }
47255
- .k-expander-header:focus-visible {
47256
- box-shadow: inset 0px 0px 0px 2px #195bb5;
47257
- }
47258
47198
  .k-slider .k-tick {
47259
47199
  background-image: none;
47260
47200
  }
@@ -47373,6 +47313,121 @@ kendo-scrollview.k-scrollview .k-scrollview-nav {
47373
47313
  clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);
47374
47314
  }
47375
47315
  }
47316
+ :is([class*="fk-popup-alert"]).k-animation-container .k-popup {
47317
+ box-shadow: none;
47318
+ border-radius: 0.25rem;
47319
+ }
47320
+ :is([class*="fk-popup-alert"]).k-animation-container .k-popup div {
47321
+ display: flex;
47322
+ flex-direction: row;
47323
+ align-items: center;
47324
+ gap: 1rem;
47325
+ color: var(--kendo-color-secondary-text);
47326
+ background-color: var(--kendo-color-surface);
47327
+ padding-block: 0.25rem;
47328
+ padding-inline: 1rem 0.5rem;
47329
+ border-radius: 0.25rem;
47330
+ border: 1px solid;
47331
+ border-color: var(--kendo-color-border);
47332
+ box-shadow: none;
47333
+ cursor: pointer;
47334
+ }
47335
+ :is([class*="fk-popup-alert"]).k-animation-container .k-popup div .k-icon {
47336
+ flex-shrink: 0;
47337
+ align-self: start;
47338
+ }
47339
+ .fk-popup-alert-info.k-animation-container .k-popup div {
47340
+ border-color: var(--kendo-color-info);
47341
+ color: var(--kendo-color-info);
47342
+ background-color: var(--kendo-color-info-subtle);
47343
+ }
47344
+ .fk-popup-alert-warning.k-animation-container .k-popup div {
47345
+ border-color: var(--kendo-color-warning);
47346
+ background-color: var(--kendo-color-warning-subtle);
47347
+ }
47348
+ .fk-popup-alert-error.k-animation-container .k-popup div {
47349
+ border-color: var(--kendo-color-error);
47350
+ color: var(--kendo-color-error);
47351
+ background-color: var(--kendo-color-error-subtle);
47352
+ }
47353
+ .fk-popup-alert-success.k-animation-container .k-popup div {
47354
+ border-color: var(--kendo-color-success);
47355
+ color: var(--kendo-color-success);
47356
+ background-color: var(--kendo-color-success-subtle);
47357
+ }
47358
+ .k-animation-container:has(.k-tooltip) {
47359
+ white-space: overflow-wrap;
47360
+ background-color: var(--kendo-color-primary-hover);
47361
+ border-radius: 0.25rem;
47362
+ max-width: 50ch;
47363
+ }
47364
+ .k-animation-container:has(.k-tooltip) .k-tooltip {
47365
+ color: var(--kendo-color-light);
47366
+ padding: 0.5rem 1rem;
47367
+ font-size: 0.875rem;
47368
+ box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
47369
+ }
47370
+ .k-animation-container:has(.k-tooltip) .k-callout {
47371
+ display: none;
47372
+ }
47373
+ .k-expander-header:focus-visible {
47374
+ box-shadow: inset 0px 0px 0px 2px #195bb5;
47375
+ }
47376
+ .fk-menu .k-menu.k-menu-horizontal > .k-item.k-menu-item {
47377
+ position: relative;
47378
+ }
47379
+ .fk-menu
47380
+ .k-menu.k-menu-horizontal
47381
+ > .k-item.k-menu-item.fk-separator-prefix::before,
47382
+ .fk-menu
47383
+ .k-menu.k-menu-horizontal
47384
+ > .k-item.k-menu-item.fk-separator-suffix::after {
47385
+ content: "";
47386
+ position: absolute;
47387
+ top: 0;
47388
+ bottom: 0;
47389
+ background: var(--kendo-color-border);
47390
+ width: 1px;
47391
+ margin: 0 -1px;
47392
+ pointer-events: none;
47393
+ }
47394
+ .fk-menu
47395
+ .k-menu.k-menu-vertical
47396
+ > .k-item.k-menu-item.fk-separator-prefix::before,
47397
+ .fk-menu
47398
+ .k-menu.k-menu-vertical
47399
+ > .k-item.k-menu-item.fk-separator-suffix::after {
47400
+ content: "";
47401
+ background: var(--kendo-color-border);
47402
+ height: 1px;
47403
+ margin: -1px 0;
47404
+ pointer-events: none;
47405
+ }
47406
+ .fk-menu .k-menu-vertical,
47407
+ .fk-menu .k-menu-horizontal {
47408
+ width: -moz-fit-content;
47409
+ width: fit-content;
47410
+ }
47411
+ .k-icon-wrap::before,
47412
+ .k-checkbox-wrap::before,
47413
+ .k-list-optionlabel::before,
47414
+ .k-table-list .k-table-group-row::before,
47415
+ .k-skeleton-text:empty::before,
47416
+ .k-placeholder-line:empty::before,
47417
+ .k-input-value-text::before,
47418
+ .k-radio-wrap::before,
47419
+ .k-calendar-infinite .k-calendar-view::after,
47420
+ .k-calendar-navigation::before,
47421
+ .k-calendar-navigation::after,
47422
+ .k-time-list-wrapper.k-focus::before,
47423
+ .k-time-list-wrapper.k-focus::after,
47424
+ .k-time-list::before,
47425
+ .k-time-list::after,
47426
+ .k-multiselecttree .k-input-inner::before,
47427
+ .k-window-title::before,
47428
+ .k-gantt-tasks td::after {
47429
+ content: "";
47430
+ }
47376
47431
  .fk-daterangepicker .k-input-suffix,
47377
47432
  .fk-daterangepicker .k-input-prefix {
47378
47433
  cursor: pointer;
@@ -47425,25 +47480,27 @@ kendo-scrollview.k-scrollview .k-scrollview-nav {
47425
47480
  .k-animation-container:has(.k-calendar-view) {
47426
47481
  margin-top: 0.25rem;
47427
47482
  }
47428
- .k-icon-wrap::before,
47429
- .k-checkbox-wrap::before,
47430
- .k-list-optionlabel::before,
47431
- .k-table-list .k-table-group-row::before,
47432
- .k-skeleton-text:empty::before,
47433
- .k-placeholder-line:empty::before,
47434
- .k-input-value-text::before,
47435
- .k-radio-wrap::before,
47436
- .k-calendar-infinite .k-calendar-view::after,
47437
- .k-calendar-navigation::before,
47438
- .k-calendar-navigation::after,
47439
- .k-time-list-wrapper.k-focus::before,
47440
- .k-time-list-wrapper.k-focus::after,
47441
- .k-time-list::before,
47442
- .k-time-list::after,
47443
- .k-multiselecttree .k-input-inner::before,
47444
- .k-window-title::before,
47445
- .k-gantt-tasks td::after {
47446
- content: "";
47483
+ .fk-timepicker .k-timepicker {
47484
+ width: 10rem;
47485
+ min-width: 10rem;
47486
+ display: flex;
47487
+ justify-content: space-between;
47488
+ }
47489
+ .fk-timepicker .k-timepicker.k-input .k-maskedtextbox.k-input,
47490
+ .fk-timepicker .k-timepicker.k-input.k-focus .k-maskedtextbox.k-input {
47491
+ border: 0;
47492
+ outline: 0;
47493
+ }
47494
+ .fk-datepicker .k-datepicker {
47495
+ width: 10rem;
47496
+ min-width: 10rem;
47497
+ display: flex;
47498
+ justify-content: space-between;
47499
+ }
47500
+ .fk-datepicker .k-datepicker.k-input .k-maskedtextbox.k-input,
47501
+ .fk-datepicker .k-datepicker.k-input.k-focus .k-maskedtextbox.k-input {
47502
+ border: 0;
47503
+ outline: 0;
47447
47504
  }
47448
47505
  .k-tabstrip .k-tabstrip-content.k-active,
47449
47506
  .k-tabstrip .k-tabstrip-content.k-state-active,
@@ -47460,6 +47517,7 @@ h1 {
47460
47517
  line-height: 1.2857142857;
47461
47518
  letter-spacing: unset;
47462
47519
  }
47520
+ h2.fk-heading2,
47463
47521
  .k-popup.k-timepicker-popup .k-timeselector .k-time-header .k-title,
47464
47522
  h2 {
47465
47523
  font-family: Inter;
@@ -47467,21 +47525,22 @@ h2 {
47467
47525
  font-weight: 400;
47468
47526
  line-height: 1.5;
47469
47527
  }
47470
- .k-card .k-card-header .k-card-title,
47471
- h3 {
47528
+ h3.fk-heading3,
47529
+ .k-card .k-card-header .k-card-title {
47472
47530
  font-family: Inter;
47473
47531
  font-size: 1.1875rem;
47474
47532
  font-weight: 700;
47475
47533
  line-height: 1.4736842105;
47476
47534
  letter-spacing: 0em;
47477
47535
  }
47536
+ h4.fk-heading4,
47478
47537
  h4 {
47479
47538
  font-family: Inter;
47480
47539
  font-size: 1rem;
47481
47540
  font-weight: 400;
47482
47541
  line-height: 1.5;
47483
47542
  }
47484
- h5 {
47543
+ h5.fk-heading5 {
47485
47544
  font-family: Inter;
47486
47545
  font-size: 0.875rem;
47487
47546
  font-weight: 700;
@@ -47521,8 +47580,6 @@ h6 {
47521
47580
  .k-dropdownlist .k-input-inner .k-input-value-text,
47522
47581
  .k-pager .k-pager-sizes .k-dropdownlist .k-input-inner .k-input-value-text,
47523
47582
  .k-numerictextbox.k-input.k-input-md,
47524
- div,
47525
- ul,
47526
47583
  .k-window .k-window-content,
47527
47584
  .k-window,
47528
47585
  .k-window.k-dialog .k-window-content.k-dialog-content,
@@ -52005,7 +52062,7 @@ ul,
52005
52062
  transition-duration: 280ms;
52006
52063
  transition-property: all;
52007
52064
  transition-timing-function: ease-out;
52008
- min-width: 208px;
52065
+ min-width: unset;
52009
52066
  }
52010
52067
  .k-timepicker.k-input.k-input-solid {
52011
52068
  border-bottom-color: currentcolor;
@@ -55265,10 +55322,10 @@ div.feather-ks-spacing-s {
55265
55322
  box-shadow: none;
55266
55323
  }
55267
55324
  .k-expander .k-expander-header {
55268
- border-bottom-left-radius: 0.125rem;
55269
- border-bottom-right-radius: 0.125rem;
55270
- border-top-left-radius: 0.125rem;
55271
- border-top-right-radius: 0.125rem;
55325
+ border-bottom-left-radius: 0.25rem;
55326
+ border-bottom-right-radius: 0.25rem;
55327
+ border-top-left-radius: 0.25rem;
55328
+ border-top-right-radius: 0.25rem;
55272
55329
  }
55273
55330
  .k-expander.k-expanded {
55274
55331
  transition-property: all;
@@ -55278,10 +55335,6 @@ div.feather-ks-spacing-s {
55278
55335
  border-left-style: solid;
55279
55336
  border-right-style: solid;
55280
55337
  border-top-style: solid;
55281
- border-bottom-left-radius: 0.25rem;
55282
- border-bottom-right-radius: 0.25rem;
55283
- border-top-left-radius: 0.25rem;
55284
- border-top-right-radius: 0.25rem;
55285
55338
  z-index: 1;
55286
55339
  }
55287
55340
  .k-button.k-focus.k-button-outline.k-button-outline-primary,
@@ -56881,3 +56934,30 @@ div.feather-ks-spacing-s {
56881
56934
  rgba(25, 91, 181, 0.12)
56882
56935
  );
56883
56936
  }
56937
+ div.fk-container {
56938
+ padding-bottom: 1rem;
56939
+ padding-left: 1rem;
56940
+ padding-right: 1rem;
56941
+ padding-top: 1rem;
56942
+ background-color: #fcfcff;
56943
+ background-image: none;
56944
+ border-bottom-left-radius: 0.25rem;
56945
+ border-bottom-right-radius: 0.25rem;
56946
+ border-top-left-radius: 0.25rem;
56947
+ border-top-right-radius: 0.25rem;
56948
+ border-bottom-width: 1px;
56949
+ border-left-width: 1px;
56950
+ border-right-width: 1px;
56951
+ border-top-width: 1px;
56952
+ border-bottom-color: rgba(10, 12, 27, 0.12);
56953
+ border-bottom-style: solid;
56954
+ border-left-color: rgba(10, 12, 27, 0.12);
56955
+ border-left-style: solid;
56956
+ border-right-color: rgba(10, 12, 27, 0.12);
56957
+ border-right-style: solid;
56958
+ border-top-color: rgba(10, 12, 27, 0.12);
56959
+ border-top-style: solid;
56960
+ display: flex;
56961
+ flex-direction: column;
56962
+ row-gap: 0.75rem;
56963
+ }