@oslokommune/punkt-css 3.2.1 → 3.3.0

package/CHANGELOG.md

@@ -5,6 +5,36 @@ og skriver commits ca etter [Conventional Commits](https://conventionalcommits.o
 
 ---
 
+## [3.3.0](https://github.com/oslokommune/punkt/compare/3.2.1...3.3.0) (2023-04-21)
+
+### ⚠ BREAKING CHANGES
+Ingen
+
+### Features
+* Fargeendringer (#795). * docs(docs): Oppdatert colors.json og tekst
+  
+  * fix(css): Små endringer i fargekoder
+  
+  * chore(css, docs): #729 Erstatt fargen visited med focus
+  
+  Oppsummert:
+  Visited og visited-light er fjernet.
+  Focus er lagt til. 
+  
+  ---------
+  
+  Co-authored-by: Cecilie Hansen Rørås <cecilie.roras@origo.oslo.kommune.no>
+
+
+### Bug Fixes
+Ingen
+
+### Chores
+Ingen
+
+---
+
+
 ## [3.2.1](https://github.com/oslokommune/punkt/compare/3.2.0...3.2.1) (2023-04-20)
 
 ### ⚠ BREAKING CHANGES

package/dist/css/pkt-base.css

@@ -67,8 +67,7 @@
   --color-active-light: #b3f5ff;
   --color-hover: #1f42aa;
   --color-hover-light: #b3f5ff;
-  --color-visited: #8d50b1;
-  --color-visited-light: #e0adff;
+  --color-focus: #e0adff;
   --color-disabled: #4d4d4d;
   --color-disabled-light: #f9f9f9;
   --color-info: #2a2859;
@@ -79,16 +78,16 @@
   --color-blue-dark-10: #d9e9f2;
   --color-blue-5: #f1fdff;
   --color-blue-10: #e5fcff;
-  --color-blue-60: #cdf5fb;
+  --color-blue-60: #d1f9ff;
   --color-green-dark-5: #f2fff3;
   --color-green-dark-10: #d9f2ef;
   --color-green-10: #e5ffe6;
-  --color-green-30: #c0f6e3;
+  --color-green-30: #c7fde9;
   --color-red-5: #fff3f2;
   --color-red-10: #ffe8e5;
-  --color-red-30: #f9cfca;
+  --color-red-30: #ffdfdc;
   --color-yellow-5: #fef9f0;
-  --color-yellow-50: #fae1b6;
+  --color-yellow-50: #ffe7bc;
   --color-gray-light: #f9f9f9;
   --color-gray: #f2f2f2;
   --color-gray-dark: #2c2c2c;
@@ -226,19 +225,11 @@
   color: #b3f5ff !important;
 }
 
-.bg-color-visited {
-  background-color: #8d50b1 !important;
-}
-
-.txt-color-visited {
-  color: #8d50b1 !important;
-}
-
-.bg-color-visited-light {
+.bg-color-focus {
   background-color: #e0adff !important;
 }
 
-.txt-color-visited-light {
+.txt-color-focus {
   color: #e0adff !important;
 }
 
@@ -323,11 +314,11 @@
 }
 
 .bg-color-blue-60 {
-  background-color: #cdf5fb !important;
+  background-color: #d1f9ff !important;
 }
 
 .txt-color-blue-60 {
-  color: #cdf5fb !important;
+  color: #d1f9ff !important;
 }
 
 .bg-color-green-dark-5 {
@@ -355,11 +346,11 @@
 }
 
 .bg-color-green-30 {
-  background-color: #c0f6e3 !important;
+  background-color: #c7fde9 !important;
 }
 
 .txt-color-green-30 {
-  color: #c0f6e3 !important;
+  color: #c7fde9 !important;
 }
 
 .bg-color-red-5 {
@@ -379,11 +370,11 @@
 }
 
 .bg-color-red-30 {
-  background-color: #f9cfca !important;
+  background-color: #ffdfdc !important;
 }
 
 .txt-color-red-30 {
-  color: #f9cfca !important;
+  color: #ffdfdc !important;
 }
 
 .bg-color-yellow-5 {
@@ -395,11 +386,11 @@
 }
 
 .bg-color-yellow-50 {
-  background-color: #fae1b6 !important;
+  background-color: #ffe7bc !important;
 }
 
 .txt-color-yellow-50 {
-  color: #fae1b6 !important;
+  color: #ffe7bc !important;
 }
 
 .bg-color-gray-light {
@@ -9204,7 +9195,7 @@ a:hover, a.pkt-link--hover {
   text-decoration: underline;
 }
 a:focus-visible, a.pkt-link--focus {
-  box-shadow: 0px 0px 0px 0.125rem var(--color-active), 0px 0px 0px 0.375rem var(--color-visited-light);
+  box-shadow: 0px 0px 0px 0.125rem var(--color-active), 0px 0px 0px 0.375rem var(--color-focus);
   outline: none;
   color: var(--color-hover);
 }
@@ -9228,13 +9219,13 @@ a:active, a.pkt-link--active {
   color: var(--color-hover-light);
 }
 [data-mode=dark] a:focus-visible, [data-mode=dark] a.pkt-link--focus {
-  box-shadow: 0px 0px 0px 0.125rem var(--color-active-light), 0px 0px 0px 0.375rem var(--color-visited-light);
+  box-shadow: 0px 0px 0px 0.125rem var(--color-active-light), 0px 0px 0px 0.375rem var(--color-focus);
   outline: none;
   color: var(--color-hover-light);
 }
 [data-mode=dark] a:focus:not(:focus-visible) {
   box-shadow: none;
-  outline: 0.125rem solid var(--color-visited-light);
+  outline: 0.125rem solid var(--color-focus);
   color: var(--color-hover-light);
 }
 [data-mode=dark] a:active, [data-mode=dark] a.pkt-link--active {