@internetstiftelsen/styleguide 2.22.3-beta.0.7 → 2.22.3-beta.0.9

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@internetstiftelsen/styleguide",
-	"version": "2.22.3-beta.0.7",
+	"version": "2.22.3-beta.0.9",
 	"main": "dist/components.js",
 	"ports": {
 		"fractal": "3000"

package/src/configurations/colors/_colors-functions.scss

@@ -76,7 +76,7 @@ $colors: (
 	@each $key, $value in $map {
 		&#{if($key != $base, #{$separator}#{$key}, '')} {
 			@if type-of($value) == 'map' {
-				@include color_classes($value, $attribute, $prefix, $separator: '-', $element:  $element);
+				@include color_classes($value, $attribute, $prefix: '.', $separator: '-', $element:  $element);
 			}
 			@else {
 				@if ($element != '') {
@@ -94,13 +94,12 @@ $colors: (
 }
 
 /// Generate wordpress color classes with attribute and value
-/// Generates this: .has-color-name{$suffix}
+/// Generates this: .has-colorname-color
 /// @group Colors
 @mixin wordpress_color_classes($map, $attribute,  $separator: '-', $suffix: '', $base: 'base') {
 	@each $key, $value in $map {
 		@if type-of($value) == 'map' {
 			&#{if($key != $base, #{$separator}#{$key}, '')} {
-				content: str-replace($key, 'color-', '');
 				@include wordpress_color_classes($value, $attribute, $separator, '-color');
 			}
 		}

package/src/organisms/hero/_hero--dynamic-headline.scss

@@ -44,6 +44,14 @@
 				margin: 0;
 				padding: 0;
 				line-height: 1.2;
+
+				@include bp-up(md) {
+					line-height: 1.1;
+				}
+
+				@include bp-up(lg) {
+					line-height: 1;
+				}
 			}
 
 			@include bp-up(sm-xs) {

package/src/utilities/_links.scss

@@ -79,3 +79,14 @@
 		text-decoration: underline;
 	}
 }
+
+// Generate parent element link color classes e.g. .u-color-ruby a
+/// @group Colors
+.u-link-color {
+	@include color_classes (
+		$map: $colors,
+		$separator: '-',
+		$attribute: 'color',
+		$element: 'a'
+	);
+}