@oslokommune/punkt-css 13.3.1 → 13.5.11

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.
@@ -14218,7 +14218,7 @@ a:active, a.pkt-link--active,
14218
14218
  .pkt-link--external::after {
14219
14219
  display: inline-block;
14220
14220
  content: " ";
14221
- --svg: url(https://punkt-cdn.oslo.kommune.no/13.3/icons/new-window-small.svg);
14221
+ --svg: url(https://punkt-cdn.oslo.kommune.no/13.5/icons/new-window-small.svg);
14222
14222
  background-image: var(--svg);
14223
14223
  background-repeat: no-repeat;
14224
14224
  background-size: 18px 18px;
@@ -18234,7 +18234,7 @@ div.pkt-btn:not([data-disabled]):active, .pkt-btn:enabled:active, .pkt-btn:activ
18234
18234
  outline-color: var(--pkt-color-input-border-hover);
18235
18235
  }
18236
18236
  .pkt-input-check__input-checkbox:checked[type=checkbox] {
18237
- --svg: url(https://punkt-cdn.oslo.kommune.no/13.3/icons/check-medium.svg);
18237
+ --svg: url(https://punkt-cdn.oslo.kommune.no/13.5/icons/check-medium.svg);
18238
18238
  position: relative;
18239
18239
  background-color: var(--pkt-color-input-border-normal);
18240
18240
  }
@@ -18292,7 +18292,7 @@ div.pkt-btn:not([data-disabled]):active, .pkt-btn:enabled:active, .pkt-btn:activ
18292
18292
  cursor: not-allowed;
18293
18293
  }
18294
18294
  .pkt-input-check__input-checkbox:disabled[type=checkbox][role=switch]:checked:after {
18295
- --svg: url(https://punkt-cdn.oslo.kommune.no/13.3/icons/check-medium.svg);
18295
+ --svg: url(https://punkt-cdn.oslo.kommune.no/13.5/icons/check-medium.svg);
18296
18296
  --pkt-color-input-check-border: var(--pkt-color-input-border-normal);
18297
18297
  filter: grayscale(100%) brightness(400%);
18298
18298
  }
@@ -18545,7 +18545,7 @@ pkt-select {
18545
18545
  }
18546
18546
  .pkt-input:is(select):not([multiple]), .pkt-textinput__input:is(select):not([multiple]), .pkt-select select:is(select):not([multiple]),
18547
18547
  .pkt-select:is(select):not([multiple]) {
18548
- --svg: url(https://punkt-cdn.oslo.kommune.no/13.3/icons/chevron-thin-down.svg);
18548
+ --svg: url(https://punkt-cdn.oslo.kommune.no/13.5/icons/chevron-thin-down.svg);
18549
18549
  background-image: var(--svg);
18550
18550
  background-repeat: no-repeat;
18551
18551
  background-position: right 0.7rem top 50%;
@@ -19788,7 +19788,9 @@ pkt-calendar .pkt-cal-days {
19788
19788
  pkt-calendar .pkt-cal-days td {
19789
19789
  padding: 0;
19790
19790
  }
19791
+ .pkt-calendar .pkt-cal-days button,
19791
19792
  .pkt-calendar .pkt-cal-days div,
19793
+ pkt-calendar .pkt-cal-days button,
19792
19794
  pkt-calendar .pkt-cal-days div {
19793
19795
  aspect-ratio: 1/1;
19794
19796
  justify-content: center;
@@ -19796,7 +19798,11 @@ pkt-calendar .pkt-cal-days div {
19796
19798
  position: relative;
19797
19799
  text-align: center;
19798
19800
  }
19799
- .pkt-calendar .pkt-cal-days div:before, .pkt-calendar .pkt-cal-days div:after,
19801
+ .pkt-calendar .pkt-cal-days button:before, .pkt-calendar .pkt-cal-days button:after,
19802
+ .pkt-calendar .pkt-cal-days div:before,
19803
+ .pkt-calendar .pkt-cal-days div:after,
19804
+ pkt-calendar .pkt-cal-days button:before,
19805
+ pkt-calendar .pkt-cal-days button:after,
19800
19806
  pkt-calendar .pkt-cal-days div:before,
19801
19807
  pkt-calendar .pkt-cal-days div:after {
19802
19808
  content: "";
@@ -19806,12 +19812,16 @@ pkt-calendar .pkt-cal-days div:after {
19806
19812
  bottom: 0;
19807
19813
  z-index: -1;
19808
19814
  }
19815
+ .pkt-calendar .pkt-cal-days button:before,
19809
19816
  .pkt-calendar .pkt-cal-days div:before,
19817
+ pkt-calendar .pkt-cal-days button:before,
19810
19818
  pkt-calendar .pkt-cal-days div:before {
19811
19819
  left: 0;
19812
19820
  right: 50%;
19813
19821
  }
19822
+ .pkt-calendar .pkt-cal-days button:after,
19814
19823
  .pkt-calendar .pkt-cal-days div:after,
19824
+ pkt-calendar .pkt-cal-days button:after,
19815
19825
  pkt-calendar .pkt-cal-days div:after {
19816
19826
  left: 50%;
19817
19827
  right: 0;
@@ -20177,7 +20187,7 @@ pkt-combobox[fullwidth] {
20177
20187
  }
20178
20188
  .pkt-combobox__wrapper .pkt-combobox__arrow.pkt-btn {
20179
20189
  position: absolute;
20180
- right: 0;
20190
+ right: 0.25rem;
20181
20191
  height: 100%;
20182
20192
  min-width: 1.125rem;
20183
20193
  min-height: 1.125rem;
@@ -20187,8 +20197,8 @@ pkt-combobox[fullwidth] {
20187
20197
  }
20188
20198
  .pkt-combobox__wrapper .pkt-combobox__arrow.pkt-btn svg {
20189
20199
  transition: transform 0.1s ease-in-out;
20190
- width: 1.125rem;
20191
- height: 1.125rem;
20200
+ width: 1.5rem;
20201
+ height: 1.5rem;
20192
20202
  }
20193
20203
  .pkt-combobox__wrapper .pkt-combobox__arrow.pkt-btn-icon {
20194
20204
  transform: rotate(0deg);
@@ -20205,14 +20215,17 @@ pkt-combobox[fullwidth] {
20205
20215
  .pkt-combobox__wrapper .pkt-combobox__arrow.pkt-btn:hover:not([data-disabled]) svg {
20206
20216
  transform: translateY(0.25rem);
20207
20217
  }
20218
+ .pkt-combobox__wrapper .pkt-combobox__value {
20219
+ padding-left: 0.5rem;
20220
+ }
20208
20221
  .pkt-combobox__wrapper .pkt-combobox__input {
20209
20222
  display: flex;
20210
20223
  align-items: center;
20211
20224
  position: relative;
20212
20225
  margin: 0;
20213
- padding: 0.375rem 2rem 0.375rem 0.375rem;
20226
+ padding: 0.5rem 2rem 0.5rem 0.5rem;
20214
20227
  border: 2px solid var(--pkt-color-border-default);
20215
- min-height: 2.75rem;
20228
+ min-height: 3rem;
20216
20229
  gap: 0.375rem;
20217
20230
  flex-wrap: wrap;
20218
20231
  letter-spacing: -0.2px;
@@ -20221,6 +20234,12 @@ pkt-combobox[fullwidth] {
20221
20234
  line-height: 1.75rem;
20222
20235
  line-height: 1.25;
20223
20236
  }
20237
+ .pkt-combobox__wrapper .pkt-combobox__input-div {
20238
+ display: contents;
20239
+ }
20240
+ .pkt-combobox__wrapper .pkt-combobox__input-div:first-child input {
20241
+ padding-left: 0.5rem;
20242
+ }
20224
20243
  .pkt-combobox__wrapper .pkt-combobox__input--fullwidth {
20225
20244
  width: 100%;
20226
20245
  }
@@ -20245,13 +20264,13 @@ pkt-combobox[fullwidth] {
20245
20264
  color: inherit;
20246
20265
  background: transparent;
20247
20266
  letter-spacing: inherit;
20248
- line-height: inherit;
20267
+ line-height: 1.4rem;
20249
20268
  padding: 0;
20250
20269
  margin: 0;
20251
20270
  width: 0;
20252
20271
  }
20253
20272
  .pkt-combobox__wrapper .pkt-combobox__input input:focus, .pkt-combobox__wrapper .pkt-combobox__input input:active {
20254
- width: auto;
20273
+ width: 100%;
20255
20274
  outline: none;
20256
20275
  }
20257
20276
  .pkt-combobox__wrapper .pkt-combobox__input .pkt-tag {
@@ -20268,6 +20287,7 @@ pkt-combobox[fullwidth] {
20268
20287
  .pkt-combobox__wrapper .pkt-combobox__placeholder {
20269
20288
  color: var(--pkt-color-text-placeholder);
20270
20289
  opacity: 1;
20290
+ padding-left: 0.5rem;
20271
20291
  }
20272
20292
  .pkt-combobox__wrapper .pkt-listbox__open {
20273
20293
  margin-top: 0.5rem;