@oslokommune/punkt-css 12.40.2 → 12.40.5

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.
package/CHANGELOG.md CHANGED
@@ -5,6 +5,45 @@ og skriver commits ca etter [Conventional Commits](https://conventionalcommits.o
5
5
 
6
6
  ---
7
7
 
8
+ ## [12.40.5](https://github.com/oslokommune/punkt/compare/12.40.4...12.40.5) (2025-05-21)
9
+
10
+ ### ⚠ BREAKING CHANGES
11
+ Ingen
12
+
13
+ ### Features
14
+ Ingen
15
+
16
+ ### Bug Fixes
17
+ Ingen
18
+
19
+ ### Chores
20
+ * endre padding for card (#2580).
21
+
22
+
23
+ ---
24
+
25
+
26
+ ## [12.40.3](https://github.com/oslokommune/punkt/compare/12.40.2...12.40.3) (2025-05-20)
27
+
28
+ ### ⚠ BREAKING CHANGES
29
+ Ingen
30
+
31
+ ### Features
32
+ Ingen
33
+
34
+ ### Bug Fixes
35
+ Ingen
36
+
37
+ ### Chores
38
+ * update propnames for cards (#2574). - direction til layout
39
+ - portrait til vertical
40
+ - landscape til horizontal
41
+ - padding: standard til padding: default
42
+
43
+
44
+ ---
45
+
46
+
8
47
  ## [12.40.2](https://github.com/oslokommune/punkt/compare/12.40.1...12.40.2) (2025-05-20)
9
48
 
10
49
  ### ⚠ BREAKING CHANGES
@@ -12,7 +12,7 @@ pkt-card {
12
12
  align-items: center;
13
13
  width: 100%;
14
14
  min-width: 12.5rem;
15
- padding: 2rem;
15
+ padding: 1.5rem;
16
16
  }
17
17
  .pkt-card .pkt-card__wrapper {
18
18
  display: flex;
@@ -71,15 +71,15 @@ pkt-card {
71
71
  margin-top: 0.5rem;
72
72
  margin-bottom: 0;
73
73
  }
74
- .pkt-card.pkt-card--landscape {
74
+ .pkt-card.pkt-card--horizontal {
75
75
  flex-direction: row;
76
76
  }
77
77
  @media screen and (max-width: 36rem) {
78
- .pkt-card.pkt-card--landscape {
78
+ .pkt-card.pkt-card--horizontal {
79
79
  flex-direction: column;
80
80
  }
81
81
  }
82
- .pkt-card.pkt-card--portrait {
82
+ .pkt-card.pkt-card--vertical {
83
83
  flex-direction: column;
84
84
  min-width: 12.5rem;
85
85
  }
@@ -102,32 +102,32 @@ pkt-card {
102
102
  max-height: 400px;
103
103
  max-width: 400px;
104
104
  }
105
- .pkt-card.pkt-card--landscape .pkt-card__image {
105
+ .pkt-card.pkt-card--horizontal .pkt-card__image {
106
106
  max-width: 400px;
107
107
  margin-right: 2rem;
108
108
  }
109
- .pkt-card.pkt-card--landscape .pkt-card__image-square {
109
+ .pkt-card.pkt-card--horizontal .pkt-card__image-square {
110
110
  align-self: stretch;
111
111
  }
112
112
  @media screen and (max-width: 36rem) {
113
- .pkt-card.pkt-card--landscape .pkt-card__image {
113
+ .pkt-card.pkt-card--horizontal .pkt-card__image {
114
114
  margin-right: 0;
115
115
  margin-bottom: 2rem;
116
116
  max-height: 400px;
117
117
  }
118
- .pkt-card.pkt-card--landscape .pkt-card__image-square {
118
+ .pkt-card.pkt-card--horizontal .pkt-card__image-square {
119
119
  max-width: unset;
120
120
  }
121
121
  }
122
- .pkt-card.pkt-card--portrait .pkt-card__image {
122
+ .pkt-card.pkt-card--vertical .pkt-card__image {
123
123
  margin-bottom: 2rem;
124
124
  max-height: 400px;
125
125
  }
126
- .pkt-card.pkt-card--padding-none.pkt-card--portrait .pkt-card__image-square {
126
+ .pkt-card.pkt-card--padding-none.pkt-card--vertical .pkt-card__image-square {
127
127
  aspect-ratio: 19/10;
128
128
  }
129
129
  @media screen and (max-width: 36rem) {
130
- .pkt-card.pkt-card--padding-none.pkt-card--landscape .pkt-card__image-square {
130
+ .pkt-card.pkt-card--padding-none.pkt-card--horizontal .pkt-card__image-square {
131
131
  aspect-ratio: 19/10;
132
132
  }
133
133
  }
@@ -169,16 +169,16 @@ pkt-card {
169
169
  outline: none;
170
170
  background-color: transparent;
171
171
  }
172
- .pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--gray {
172
+ .pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--gray {
173
173
  background-color: var(--pkt-color-brand-neutrals-100);
174
174
  }
175
- .pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--blue {
175
+ .pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--blue {
176
176
  background-color: var(--pkt-color-brand-blue-200);
177
177
  }
178
- .pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--green {
178
+ .pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--green {
179
179
  background-color: var(--pkt-color-brand-light-green-400);
180
180
  }
181
- .pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--beige {
181
+ .pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--beige {
182
182
  background-color: var(--pkt-color-brand-light-beige-1000);
183
183
  }
184
184
  .pkt-card--outlined, .pkt-card--outlined-beige {
@@ -1 +1 @@
1
- pkt-card{display:block;width:100%}.pkt-card{position:relative;display:flex;align-items:center;width:100%;min-width:12.5rem;padding:2rem}.pkt-card .pkt-card__wrapper{display:flex;flex-direction:column;flex:1 1 53%;width:100%;overflow:hidden}.pkt-card.pkt-card--padding-none{padding:0}.pkt-card .pkt-card__heading h1,.pkt-card .pkt-card__heading h2,.pkt-card .pkt-card__heading h3,.pkt-card .pkt-card__heading h4,.pkt-card .pkt-card__heading h5{padding:0;margin:0;font-size:1.875rem;font-weight:400;margin-bottom:.5rem;hyphens:auto;overflow-wrap:break-word}.pkt-card .pkt-card__link{text-decoration-thickness:.12rem;text-underline-offset:.15em}.pkt-card p.pkt-card__subheading{padding:0;margin:0;line-height:unset;margin-bottom:1rem;font-size:1.25rem;font-weight:300;hyphens:auto;overflow-wrap:break-word}.pkt-card .pkt-card__metadata{margin-top:1rem;margin-bottom:0;line-height:unset;gap:.5rem}.pkt-card .pkt-card__metadata-lead{font-weight:500}.pkt-card .pkt-card__tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:.5rem;margin-top:0}.pkt-card .pkt-card__tags-bottom{margin-top:.5rem;margin-bottom:0}.pkt-card.pkt-card--landscape{flex-direction:row}@media screen and (max-width: 36rem){.pkt-card.pkt-card--landscape{flex-direction:column}}.pkt-card.pkt-card--portrait{flex-direction:column;min-width:12.5rem}.pkt-card .pkt-card__image{aspect-ratio:1;flex:1 1 47%;width:100%;overflow:hidden}.pkt-card .pkt-card__image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.pkt-card .pkt-card__image.pkt-card__image-round{border-radius:50%;align-self:unset;max-height:400px;max-width:400px}.pkt-card.pkt-card--landscape .pkt-card__image{max-width:400px;margin-right:2rem}.pkt-card.pkt-card--landscape .pkt-card__image-square{align-self:stretch}@media screen and (max-width: 36rem){.pkt-card.pkt-card--landscape .pkt-card__image{margin-right:0;margin-bottom:2rem;max-height:400px}.pkt-card.pkt-card--landscape .pkt-card__image-square{max-width:unset}}.pkt-card.pkt-card--portrait .pkt-card__image{margin-bottom:2rem;max-height:400px}.pkt-card.pkt-card--padding-none.pkt-card--portrait .pkt-card__image-square{aspect-ratio:19/10}@media screen and (max-width: 36rem){.pkt-card.pkt-card--padding-none.pkt-card--landscape .pkt-card__image-square{aspect-ratio:19/10}}.pkt-card .pkt-card__wrapper .pkt-card__link::before{content:"";position:absolute;inset:0;z-index:1;box-shadow:0px 0px 0px 0px rgba(0,0,0,0);outline:2px solid var(--pkt-color-brand-warm-blue-1000);outline-offset:-2px;outline-color:rgba(0,0,0,0);transition:all .3s ease-in-out}.pkt-card .pkt-card__link-heading{transition:color .2s ease-in-out,text-decoration-color .2s ease-in-out}.pkt-card:hover.pkt-card--border-on-hover .pkt-card__link::before,.pkt-card:focus-visible.pkt-card--border-on-hover .pkt-card__link::before,.pkt-card:focus-within.pkt-card--border-on-hover .pkt-card__link::before{cursor:pointer;outline-color:var(--pkt-color-brand-warm-blue-1000)}.pkt-card:hover .pkt-card__link-heading,.pkt-card:focus-visible .pkt-card__link-heading,.pkt-card:focus-within .pkt-card__link-heading{color:var(--pkt-color-brand-warm-blue-1000);text-decoration-color:var(--pkt-color-brand-warm-blue-1000)}.pkt-card .pkt-card__link:focus{outline:none;box-shadow:none}.pkt-card .pkt-card__link-heading:focus-within{color:var(--pkt-color-brand-warm-blue-1000);text-decoration-color:var(--pkt-color-brand-warm-blue-1000)}.pkt-card .pkt-card__wrapper .pkt-card__link:focus-visible::before{box-shadow:0px 0px 0px 4px var(--pkt-color-brand-purple-1000);outline-color:var(--pkt-color-brand-warm-blue-1000)}.pkt-card.pkt-card--padding-none{outline:none;background-color:rgba(0,0,0,0)}.pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--gray{background-color:var(--pkt-color-brand-neutrals-100)}.pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--blue{background-color:var(--pkt-color-brand-blue-200)}.pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--green{background-color:var(--pkt-color-brand-light-green-400)}.pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--beige{background-color:var(--pkt-color-brand-light-beige-1000)}.pkt-card--outlined,.pkt-card--outlined-beige{background-color:var(--pkt-color-background-default);outline-offset:-4px}.pkt-card--outlined{outline:4px solid var(--pkt-color-grays-gray-100)}.pkt-card--outlined-beige{outline:4px solid var(--pkt-color-brand-light-beige-1000)}.pkt-card--gray{background-color:var(--pkt-color-brand-neutrals-100)}.pkt-card--blue{background-color:var(--pkt-color-brand-blue-200)}.pkt-card--green{background-color:var(--pkt-color-brand-light-green-400)}.pkt-card--beige{background-color:var(--pkt-color-brand-light-beige-1000)}
1
+ pkt-card{display:block;width:100%}.pkt-card{position:relative;display:flex;align-items:center;width:100%;min-width:12.5rem;padding:1.5rem}.pkt-card .pkt-card__wrapper{display:flex;flex-direction:column;flex:1 1 53%;width:100%;overflow:hidden}.pkt-card.pkt-card--padding-none{padding:0}.pkt-card .pkt-card__heading h1,.pkt-card .pkt-card__heading h2,.pkt-card .pkt-card__heading h3,.pkt-card .pkt-card__heading h4,.pkt-card .pkt-card__heading h5{padding:0;margin:0;font-size:1.875rem;font-weight:400;margin-bottom:.5rem;hyphens:auto;overflow-wrap:break-word}.pkt-card .pkt-card__link{text-decoration-thickness:.12rem;text-underline-offset:.15em}.pkt-card p.pkt-card__subheading{padding:0;margin:0;line-height:unset;margin-bottom:1rem;font-size:1.25rem;font-weight:300;hyphens:auto;overflow-wrap:break-word}.pkt-card .pkt-card__metadata{margin-top:1rem;margin-bottom:0;line-height:unset;gap:.5rem}.pkt-card .pkt-card__metadata-lead{font-weight:500}.pkt-card .pkt-card__tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:.5rem;margin-top:0}.pkt-card .pkt-card__tags-bottom{margin-top:.5rem;margin-bottom:0}.pkt-card.pkt-card--horizontal{flex-direction:row}@media screen and (max-width: 36rem){.pkt-card.pkt-card--horizontal{flex-direction:column}}.pkt-card.pkt-card--vertical{flex-direction:column;min-width:12.5rem}.pkt-card .pkt-card__image{aspect-ratio:1;flex:1 1 47%;width:100%;overflow:hidden}.pkt-card .pkt-card__image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.pkt-card .pkt-card__image.pkt-card__image-round{border-radius:50%;align-self:unset;max-height:400px;max-width:400px}.pkt-card.pkt-card--horizontal .pkt-card__image{max-width:400px;margin-right:2rem}.pkt-card.pkt-card--horizontal .pkt-card__image-square{align-self:stretch}@media screen and (max-width: 36rem){.pkt-card.pkt-card--horizontal .pkt-card__image{margin-right:0;margin-bottom:2rem;max-height:400px}.pkt-card.pkt-card--horizontal .pkt-card__image-square{max-width:unset}}.pkt-card.pkt-card--vertical .pkt-card__image{margin-bottom:2rem;max-height:400px}.pkt-card.pkt-card--padding-none.pkt-card--vertical .pkt-card__image-square{aspect-ratio:19/10}@media screen and (max-width: 36rem){.pkt-card.pkt-card--padding-none.pkt-card--horizontal .pkt-card__image-square{aspect-ratio:19/10}}.pkt-card .pkt-card__wrapper .pkt-card__link::before{content:"";position:absolute;inset:0;z-index:1;box-shadow:0px 0px 0px 0px rgba(0,0,0,0);outline:2px solid var(--pkt-color-brand-warm-blue-1000);outline-offset:-2px;outline-color:rgba(0,0,0,0);transition:all .3s ease-in-out}.pkt-card .pkt-card__link-heading{transition:color .2s ease-in-out,text-decoration-color .2s ease-in-out}.pkt-card:hover.pkt-card--border-on-hover .pkt-card__link::before,.pkt-card:focus-visible.pkt-card--border-on-hover .pkt-card__link::before,.pkt-card:focus-within.pkt-card--border-on-hover .pkt-card__link::before{cursor:pointer;outline-color:var(--pkt-color-brand-warm-blue-1000)}.pkt-card:hover .pkt-card__link-heading,.pkt-card:focus-visible .pkt-card__link-heading,.pkt-card:focus-within .pkt-card__link-heading{color:var(--pkt-color-brand-warm-blue-1000);text-decoration-color:var(--pkt-color-brand-warm-blue-1000)}.pkt-card .pkt-card__link:focus{outline:none;box-shadow:none}.pkt-card .pkt-card__link-heading:focus-within{color:var(--pkt-color-brand-warm-blue-1000);text-decoration-color:var(--pkt-color-brand-warm-blue-1000)}.pkt-card .pkt-card__wrapper .pkt-card__link:focus-visible::before{box-shadow:0px 0px 0px 4px var(--pkt-color-brand-purple-1000);outline-color:var(--pkt-color-brand-warm-blue-1000)}.pkt-card.pkt-card--padding-none{outline:none;background-color:rgba(0,0,0,0)}.pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--gray{background-color:var(--pkt-color-brand-neutrals-100)}.pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--blue{background-color:var(--pkt-color-brand-blue-200)}.pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--green{background-color:var(--pkt-color-brand-light-green-400)}.pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--beige{background-color:var(--pkt-color-brand-light-beige-1000)}.pkt-card--outlined,.pkt-card--outlined-beige{background-color:var(--pkt-color-background-default);outline-offset:-4px}.pkt-card--outlined{outline:4px solid var(--pkt-color-grays-gray-100)}.pkt-card--outlined-beige{outline:4px solid var(--pkt-color-brand-light-beige-1000)}.pkt-card--gray{background-color:var(--pkt-color-brand-neutrals-100)}.pkt-card--blue{background-color:var(--pkt-color-brand-blue-200)}.pkt-card--green{background-color:var(--pkt-color-brand-light-green-400)}.pkt-card--beige{background-color:var(--pkt-color-brand-light-beige-1000)}
@@ -743,7 +743,7 @@ pkt-card {
743
743
  align-items: center;
744
744
  width: 100%;
745
745
  min-width: 12.5rem;
746
- padding: 2rem;
746
+ padding: 1.5rem;
747
747
  }
748
748
  .pkt-card .pkt-card__wrapper {
749
749
  display: flex;
@@ -802,15 +802,15 @@ pkt-card {
802
802
  margin-top: 0.5rem;
803
803
  margin-bottom: 0;
804
804
  }
805
- .pkt-card.pkt-card--landscape {
805
+ .pkt-card.pkt-card--horizontal {
806
806
  flex-direction: row;
807
807
  }
808
808
  @media screen and (max-width: 36rem) {
809
- .pkt-card.pkt-card--landscape {
809
+ .pkt-card.pkt-card--horizontal {
810
810
  flex-direction: column;
811
811
  }
812
812
  }
813
- .pkt-card.pkt-card--portrait {
813
+ .pkt-card.pkt-card--vertical {
814
814
  flex-direction: column;
815
815
  min-width: 12.5rem;
816
816
  }
@@ -833,32 +833,32 @@ pkt-card {
833
833
  max-height: 400px;
834
834
  max-width: 400px;
835
835
  }
836
- .pkt-card.pkt-card--landscape .pkt-card__image {
836
+ .pkt-card.pkt-card--horizontal .pkt-card__image {
837
837
  max-width: 400px;
838
838
  margin-right: 2rem;
839
839
  }
840
- .pkt-card.pkt-card--landscape .pkt-card__image-square {
840
+ .pkt-card.pkt-card--horizontal .pkt-card__image-square {
841
841
  align-self: stretch;
842
842
  }
843
843
  @media screen and (max-width: 36rem) {
844
- .pkt-card.pkt-card--landscape .pkt-card__image {
844
+ .pkt-card.pkt-card--horizontal .pkt-card__image {
845
845
  margin-right: 0;
846
846
  margin-bottom: 2rem;
847
847
  max-height: 400px;
848
848
  }
849
- .pkt-card.pkt-card--landscape .pkt-card__image-square {
849
+ .pkt-card.pkt-card--horizontal .pkt-card__image-square {
850
850
  max-width: unset;
851
851
  }
852
852
  }
853
- .pkt-card.pkt-card--portrait .pkt-card__image {
853
+ .pkt-card.pkt-card--vertical .pkt-card__image {
854
854
  margin-bottom: 2rem;
855
855
  max-height: 400px;
856
856
  }
857
- .pkt-card.pkt-card--padding-none.pkt-card--portrait .pkt-card__image-square {
857
+ .pkt-card.pkt-card--padding-none.pkt-card--vertical .pkt-card__image-square {
858
858
  aspect-ratio: 19/10;
859
859
  }
860
860
  @media screen and (max-width: 36rem) {
861
- .pkt-card.pkt-card--padding-none.pkt-card--landscape .pkt-card__image-square {
861
+ .pkt-card.pkt-card--padding-none.pkt-card--horizontal .pkt-card__image-square {
862
862
  aspect-ratio: 19/10;
863
863
  }
864
864
  }
@@ -900,16 +900,16 @@ pkt-card {
900
900
  outline: none;
901
901
  background-color: transparent;
902
902
  }
903
- .pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--gray {
903
+ .pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--gray {
904
904
  background-color: var(--pkt-color-brand-neutrals-100);
905
905
  }
906
- .pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--blue {
906
+ .pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--blue {
907
907
  background-color: var(--pkt-color-brand-blue-200);
908
908
  }
909
- .pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--green {
909
+ .pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--green {
910
910
  background-color: var(--pkt-color-brand-light-green-400);
911
911
  }
912
- .pkt-card.pkt-card--padding-none.pkt-card--landscape.pkt-card--beige {
912
+ .pkt-card.pkt-card--padding-none.pkt-card--horizontal.pkt-card--beige {
913
913
  background-color: var(--pkt-color-brand-light-beige-1000);
914
914
  }
915
915
  .pkt-card--outlined, .pkt-card--outlined-beige {