@aarhus-university/au-designsystem-delphinus 0.34.5 → 0.34.7

package/CHANGELOG.md

@@ -1,3 +1,23 @@
+## 0.34.7 (January 26, 2022)
+
+### Core Delphinus Updates
+* Update Figma Tokens to use Font Awesome 6.
+* Add Figma Tokens for fading.
+
+### Delphinus Projects Updates
+None
+
+## 0.34.6 (January 20, 2022)
+
+### Core Delphinus Updates
+* Removes top/bottom margin of first/last child in Cards.
+* Adds Figma Tokens for dense paragraph spacing.
+* Fixes issue in `.horizontal-scroll--no-overflow` where content was squashed on wider screens.
+
+### Delphinus Projects Updates
+#### Typo3
+Adds processing-state and forms styling. But is not yet modified to work fully within the .typo3-delphinus wrapper.
+
 ## 0.34.5 (January 18, 2022)
 
 ### Core Delphinus Updates

package/Gruntfile.js

@@ -80,7 +80,7 @@ module.exports = (grunt) => {
         tasks: ['sass', 'cleanempty'],
       },
       pug: {
-        files: ['source/**/*.pug'],
+        files: ['source/**/*.pug', 'CHANGELOG.md'],
         tasks: ['pug', 'cleanempty'],
       },
       copy: {

package/build/changelog.html

@@ -17,7 +17,33 @@ a(href="/components" class= active_nav_item=="components" ? "nav__item--active"
 a(href="/atom-fonts.html" class= active_nav_item=="atoms" ? "nav__item--active" : "").nav__item Atoms
 a(href="/code.html" class= active_nav_item=="code" ? "nav__item--active" : "").nav__item Code
 a(href="/projects" class= active_nav_item=="projects" ? "nav__item--active" : "").nav__item Projects
-a(href="/changelog.html" class= active_nav_item=="changelog" ? "nav__item--active" : "").nav__item Changelog--><!--button(title="Show full menu" aria-label="Show full menu" aria-haspopup="true" aria-expanded="false" aria-controls="nav-items-global").nav__toggle Menu--></div></nav></header><main class="page__content theme--normal" id="content"><div class="page__content__block"><h1> <strong>Changelog</strong></h1><div class="changelog"><h2>0.34.4 (January 17, 2022)</h2>
+a(href="/changelog.html" class= active_nav_item=="changelog" ? "nav__item--active" : "").nav__item Changelog--><!--button(title="Show full menu" aria-label="Show full menu" aria-haspopup="true" aria-expanded="false" aria-controls="nav-items-global").nav__toggle Menu--></div></nav></header><main class="page__content theme--normal" id="content"><div class="page__content__block"><h1> <strong>Changelog</strong></h1><div class="changelog"><h2>0.34.7 (January 26, 2022)</h2>
+<h3>Core Delphinus Updates</h3>
+<ul>
+<li>Update Figma Tokens to use Font Awesome 6.</li>
+<li>Add Figma Tokens for fading.</li>
+</ul>
+<h3>Delphinus Projects Updates</h3>
+<p>None</p>
+<h2>0.34.6 (January 20, 2022)</h2>
+<h3>Core Delphinus Updates</h3>
+<ul>
+<li>Removes top/bottom margin of first/last child in Cards.</li>
+<li>Adds Figma Tokens for dense paragraph spacing.</li>
+<li>Fixes issue in <code>.horizontal-scroll--no-overflow</code> where content was squashed on wider screens.</li>
+</ul>
+<h3>Delphinus Projects Updates</h3>
+<h4>Typo3</h4>
+<p>Adds processing-state and forms styling. But is not yet modified to work fully within the .typo3-delphinus wrapper.</p>
+<h2>0.34.5 (January 18, 2022)</h2>
+<h3>Core Delphinus Updates</h3>
+<ul>
+<li>Adjust padding on normal and large buttons</li>
+<li>Figma Tokens updated to include fifth font size introduced in 0.34.0</li>
+</ul>
+<h3>Delphinus Projects Updates</h3>
+<p>None</p>
+<h2>0.34.4 (January 17, 2022)</h2>
 <h3>Core Delphinus Updates</h3>
 <ul>
 <li>Fix gap in <a href="https://delphinus.au.dk/components/copy-to-clipboard">copy-to-clipboard</a> hover hint and confirmation message, due to subpixel rendering.</li>

package/build/figma-tokens/breakpoint-styles.json

@@ -13,12 +13,12 @@
 				"value": "AU Peto",
 				"type": "fontFamilies"
 			},
-			"font-awesome-5-pro": {
-				"value": "Font Awesome 5 Pro",
+			"font-awesome-pro": {
+				"value": "Font Awesome 6 Pro",
 				"type": "fontFamilies"
 			},
-			"font-awesome-5-brands": {
-				"value": "Font Awesome 5 Brands",
+			"font-awesome-brands": {
+				"value": "Font Awesome 6 Brands",
 				"type": "fontFamilies"
 			}
 		},
@@ -40,6 +40,10 @@
 					"value": "Light",
 					"type": "fontWeights"
 				},
+				"Regular": {
+					"value": "Regular",
+					"type": "fontWeights"
+				},
 				"Solid": {
 					"value": "Solid",
 					"type": "fontWeights"
@@ -73,6 +77,10 @@
 				"value": "$spacingSizes.Minus1",
 				"type": "paragraphSpacing"
 			},
+			"Dense": {
+				"value": "$spacingSizes.Minus5",
+				"type": "paragraphSpacing"
+			},
 			"None": {
 				"value": "0",
 				"type": "paragraphSpacing"
@@ -196,6 +204,34 @@
 				},
 				"type": "typography",
 				"description": "Use this lineheight for paragraphs"
+			},
+			"Regular, single line, dense": {
+				"value": {
+					"fontFamily": "$fontFamilies.au-passata",
+					"fontWeight": "$fontWeights.Regular",
+					"lineHeight": "$lineHieghts.Singleline.Default",
+					"fontSize": "$fontSizes.Default",
+					"letterSpacing": "$letterSpacings.Default",
+					"paragraphSpacing": "$paragraphSpacings.Dense",
+					"textDecoration": "$textDecorations.None",
+					"textCase": "$textCases.None"
+				},
+				"type": "typography",
+				"description": "Use this lineheight for labels and headings"
+			},
+			"Regular, multiple lines, dense": {
+				"value": {
+					"fontFamily": "$fontFamilies.au-passata",
+					"fontWeight": "$fontWeights.Regular",
+					"lineHeight": "$lineHieghts.Multiline.Default",
+					"fontSize": "$fontSizes.Default",
+					"letterSpacing": "$letterSpacings.Default",
+					"paragraphSpacing": "$paragraphSpacings.Dense",
+					"textDecoration": "$textDecorations.None",
+					"textCase": "$textCases.None"
+				},
+				"type": "typography",
+				"description": "Use this lineheight for paragraphs"
 			}
 		},
 		"Small": {
@@ -598,7 +634,7 @@
 		"FontAwesome": {
 			"Default": {
 				"value": {
-					"fontFamily": "$fontFamilies.font-awesome-5-pro",
+					"fontFamily": "$fontFamilies.font-awesome-pro",
 					"fontWeight": "$fontWeights.FontAwesome.Light",
 					"lineHeight": "$lineHieghts.Singleline.Default",
 					"fontSize": "$fontSizes.Default",
@@ -612,7 +648,7 @@
 			},
 			"Small": {
 				"value": {
-					"fontFamily": "$fontFamilies.font-awesome-5-pro",
+					"fontFamily": "$fontFamilies.font-awesome-pro",
 					"fontWeight": "$fontWeights.FontAwesome.Light",
 					"lineHeight": "$lineHieghts.Singleline.Small",
 					"fontSize": "$fontSizes.Small",
@@ -626,7 +662,7 @@
 			},
 			"Large": {
 				"value": {
-					"fontFamily": "$fontFamilies.font-awesome-5-pro",
+					"fontFamily": "$fontFamilies.font-awesome-pro",
 					"fontWeight": "$fontWeights.FontAwesome.Light",
 					"lineHeight": "$lineHieghts.Singleline.Large",
 					"fontSize": "$fontSizes.Large",
@@ -640,7 +676,7 @@
 			},
 			"Larger": {
 				"value": {
-					"fontFamily": "$fontFamilies.font-awesome-5-pro",
+					"fontFamily": "$fontFamilies.font-awesome-pro",
 					"fontWeight": "$fontWeights.FontAwesome.Light",
 					"lineHeight": "$lineHieghts.Singleline.Larger",
 					"fontSize": "$fontSizes.Larger",
@@ -654,7 +690,7 @@
 			},
 			"Largest": {
 				"value": {
-					"fontFamily": "$fontFamilies.font-awesome-5-pro",
+					"fontFamily": "$fontFamilies.font-awesome-pro",
 					"fontWeight": "$fontWeights.FontAwesome.Light",
 					"lineHeight": "$lineHieghts.Singleline.Largest",
 					"fontSize": "$fontSizes.Largest",
@@ -669,7 +705,7 @@
 			"Solid": {
 				"Default": {
 					"value": {
-						"fontFamily": "$fontFamilies.font-awesome-5-pro",
+						"fontFamily": "$fontFamilies.font-awesome-pro",
 						"fontWeight": "$fontWeights.FontAwesome.Solid",
 						"lineHeight": "$lineHieghts.Singleline.Default",
 						"fontSize": "$fontSizes.Default",
@@ -683,7 +719,7 @@
 				},
 				"Small": {
 					"value": {
-						"fontFamily": "$fontFamilies.font-awesome-5-pro",
+						"fontFamily": "$fontFamilies.font-awesome-pro",
 						"fontWeight": "$fontWeights.FontAwesome.Solid",
 						"lineHeight": "$lineHieghts.Singleline.Small",
 						"fontSize": "$fontSizes.Small",
@@ -697,7 +733,7 @@
 				},
 				"Large": {
 					"value": {
-						"fontFamily": "$fontFamilies.font-awesome-5-pro",
+						"fontFamily": "$fontFamilies.font-awesome-pro",
 						"fontWeight": "$fontWeights.FontAwesome.Solid",
 						"lineHeight": "$lineHieghts.Singleline.Large",
 						"fontSize": "$fontSizes.Large",
@@ -711,7 +747,7 @@
 				},
 				"Larger": {
 					"value": {
-						"fontFamily": "$fontFamilies.font-awesome-5-pro",
+						"fontFamily": "$fontFamilies.font-awesome-pro",
 						"fontWeight": "$fontWeights.FontAwesome.Solid",
 						"lineHeight": "$lineHieghts.Singleline.Larger",
 						"fontSize": "$fontSizes.Larger",
@@ -725,7 +761,7 @@
 				},
 				"Largest": {
 					"value": {
-						"fontFamily": "$fontFamilies.font-awesome-5-pro",
+						"fontFamily": "$fontFamilies.font-awesome-pro",
 						"fontWeight": "$fontWeights.FontAwesome.Solid",
 						"lineHeight": "$lineHieghts.Singleline.Largest",
 						"fontSize": "$fontSizes.Largest",
@@ -738,10 +774,82 @@
 					"description": "Use this icon weight ONLY when the icon is an interactive element, that is active."
 				}
 			},
+			"Brands": {
+				"Default": {
+					"value": {
+						"fontFamily": "$fontFamilies.font-awesome-brands",
+						"fontWeight": "$fontWeights.FontAwesome.Regular",
+						"lineHeight": "$lineHieghts.Singleline.Default",
+						"fontSize": "$fontSizes.Default",
+						"letterSpacing": "$letterSpacings.Default",
+						"paragraphSpacing": "$paragraphSpacings.None",
+						"textCase": "$textCases.None",
+						"textDecoration": "$textDecorations.None"
+					},
+					"type": "typography",
+					"description": "Use this text style when you need an icon from Font Awesome Brands. Like twitter and linkedin."
+				},
+				"Small": {
+					"value": {
+						"fontFamily": "$fontFamilies.font-awesome-brands",
+						"fontWeight": "$fontWeights.FontAwesome.Regular",
+						"lineHeight": "$lineHieghts.Singleline.Small",
+						"fontSize": "$fontSizes.Small",
+						"letterSpacing": "$letterSpacings.Default",
+						"paragraphSpacing": "$paragraphSpacings.None",
+						"textCase": "$textCases.None",
+						"textDecoration": "$textDecorations.None"
+					},
+					"type": "typography",
+					"description": "Use this text style when you need an icon from Font Awesome Brands. Like twitter and linkedin."
+				},
+				"Large": {
+					"value": {
+						"fontFamily": "$fontFamilies.font-awesome-brands",
+						"fontWeight": "$fontWeights.FontAwesome.Regular",
+						"lineHeight": "$lineHieghts.Singleline.Large",
+						"fontSize": "$fontSizes.Large",
+						"letterSpacing": "$letterSpacings.Default",
+						"paragraphSpacing": "$paragraphSpacings.None",
+						"textCase": "$textCases.None",
+						"textDecoration": "$textDecorations.None"
+					},
+					"type": "typography",
+					"description": "Use this text style when you need an icon from Font Awesome Brands. Like twitter and linkedin."
+				},
+				"Larger": {
+					"value": {
+						"fontFamily": "$fontFamilies.font-awesome-brands",
+						"fontWeight": "$fontWeights.FontAwesome.Regular",
+						"lineHeight": "$lineHieghts.Singleline.Larger",
+						"fontSize": "$fontSizes.Larger",
+						"letterSpacing": "$letterSpacings.Default",
+						"paragraphSpacing": "$paragraphSpacings.None",
+						"textCase": "$textCases.None",
+						"textDecoration": "$textDecorations.None"
+					},
+					"type": "typography",
+					"description": "Use this text style when you need an icon from Font Awesome Brands. Like twitter and linkedin."
+				},
+				"Largest": {
+					"value": {
+						"fontFamily": "$fontFamilies.font-awesome-brands",
+						"fontWeight": "$fontWeights.FontAwesome.Regular",
+						"lineHeight": "$lineHieghts.Singleline.Largest",
+						"fontSize": "$fontSizes.Largest",
+						"letterSpacing": "$letterSpacings.Default",
+						"paragraphSpacing": "$paragraphSpacings.None",
+						"textCase": "$textCases.None",
+						"textDecoration": "$textDecorations.None"
+					},
+					"type": "typography",
+					"description": "Use this text style when you need an icon from Font Awesome Brands. Like twitter and linkedin."
+				}
+			},
 			"NoLineSpacing": {
 				"Default": {
 					"value": {
-						"fontFamily": "$fontFamilies.font-awesome-5-pro",
+						"fontFamily": "$fontFamilies.font-awesome-pro",
 						"fontWeight": "$fontWeights.FontAwesome.Light",
 						"lineHeight": "$fontSizes.Default",
 						"fontSize": "$fontSizes.Default",
@@ -755,7 +863,7 @@
 				},
 				"Small": {
 					"value": {
-						"fontFamily": "$fontFamilies.font-awesome-5-pro",
+						"fontFamily": "$fontFamilies.font-awesome-pro",
 						"fontWeight": "$fontWeights.FontAwesome.Light",
 						"lineHeight": "$fontSizes.Small",
 						"fontSize": "$fontSizes.Small",
@@ -769,7 +877,7 @@
 				},
 				"Large": {
 					"value": {
-						"fontFamily": "$fontFamilies.font-awesome-5-pro",
+						"fontFamily": "$fontFamilies.font-awesome-pro",
 						"fontWeight": "$fontWeights.FontAwesome.Light",
 						"lineHeight": "$fontSizes.Large",
 						"fontSize": "$fontSizes.Large",
@@ -783,7 +891,7 @@
 				},
 				"Larger": {
 					"value": {
-						"fontFamily": "$fontFamilies.font-awesome-5-pro",
+						"fontFamily": "$fontFamilies.font-awesome-pro",
 						"fontWeight": "$fontWeights.FontAwesome.Light",
 						"lineHeight": "$fontSizes.Larger",
 						"fontSize": "$fontSizes.Larger",
@@ -797,7 +905,7 @@
 				},
 				"Largest": {
 					"value": {
-						"fontFamily": "$fontFamilies.font-awesome-5-pro",
+						"fontFamily": "$fontFamilies.font-awesome-pro",
 						"fontWeight": "$fontWeights.FontAwesome.Light",
 						"lineHeight": "$fontSizes.Largest",
 						"fontSize": "$fontSizes.Largest",
@@ -812,7 +920,7 @@
 				"Solid": {
 					"Default": {
 						"value": {
-							"fontFamily": "$fontFamilies.font-awesome-5-pro",
+							"fontFamily": "$fontFamilies.font-awesome-pro",
 							"fontWeight": "$fontWeights.FontAwesome.Solid",
 							"lineHeight": "$fontSizes.Default",
 							"fontSize": "$fontSizes.Default",
@@ -826,7 +934,7 @@
 					},
 					"Small": {
 						"value": {
-							"fontFamily": "$fontFamilies.font-awesome-5-pro",
+							"fontFamily": "$fontFamilies.font-awesome-pro",
 							"fontWeight": "$fontWeights.FontAwesome.Solid",
 							"lineHeight": "$fontSizes.Small",
 							"fontSize": "$fontSizes.Small",
@@ -840,7 +948,7 @@
 					},
 					"Large": {
 						"value": {
-							"fontFamily": "$fontFamilies.font-awesome-5-pro",
+							"fontFamily": "$fontFamilies.font-awesome-pro",
 							"fontWeight": "$fontWeights.FontAwesome.Solid",
 							"lineHeight": "$fontSizes.Large",
 							"fontSize": "$fontSizes.Large",
@@ -854,7 +962,7 @@
 					},
 					"Larger": {
 						"value": {
-							"fontFamily": "$fontFamilies.font-awesome-5-pro",
+							"fontFamily": "$fontFamilies.font-awesome-pro",
 							"fontWeight": "$fontWeights.FontAwesome.Solid",
 							"lineHeight": "$fontSizes.Larger",
 							"fontSize": "$fontSizes.Larger",
@@ -868,7 +976,7 @@
 					},
 					"Largest": {
 						"value": {
-							"fontFamily": "$fontFamilies.font-awesome-5-pro",
+							"fontFamily": "$fontFamilies.font-awesome-pro",
 							"fontWeight": "$fontWeights.FontAwesome.Solid",
 							"lineHeight": "$fontSizes.Largest",
 							"fontSize": "$fontSizes.Largest",