Improve Typography (#41)

* Add letter spacing to all TextStyles that require it Also make headline's letter spacing negative, per spec * Add fontWeights to TextStyles * Update PushButton images in README.md * Update version, CHANGELOG.md
macosui · Apr 17, 2021 · 6634ffc · 6634ffc
1 parent 015ee96
commit 6634ffc
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 11 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,6 @@
+## [0.0.6]
+* Update `Typography` with correct letter spacing and font weights
+
 ## [0.0.5]
 * Adds the `PushButton` widget along with `PushButtonTheme` and `PushButtonThemeData`
 * Removes the `height` property from `Typography`'s `TextStyle`s

diff --git a/README.md b/README.md
@@ -41,14 +41,14 @@ dragging left or right. See the documentation for all customization options.
 
 ## PushButton
 
-<img src="https://imgur.com/D7CSk09.jpg"/>
-<img src="https://imgur.com/JDPdmWo.jpg"/>
-<img src="https://imgur.com/E5gECIP.jpg"/>
-<img src="https://imgur.com/lpT18wZ.jpg"/>
-<img src="https://imgur.com/W8ZA9nv.jpg"/>
-<img src="https://imgur.com/uKRyLph.jpg"/>
-<img src="https://imgur.com/w4hvYZQ.jpg"/>
-<img src="https://imgur.com/ztwz6ut.jpg"/>
+<img src="https://imgur.com/v99ekWA.jpg"/>
+<img src="https://imgur.com/GsShoF6.jpg"/>
+<img src="https://imgur.com/TgfjJdQ.jpg"/>
+<img src="https://imgur.com/wt0K6u4.jpg"/>
+<img src="https://imgur.com/hj6uGhI.jpg"/>
+<img src="https://imgur.com/klWHTAX.jpg"/>
+<img src="https://imgur.com/83cEMeP.jpg"/>
+<img src="https://imgur.com/7khWnwt.jpg"/>
 
 ## Switch
 <img src="https://imgur.com/IBh5jkz.jpg" width="50%" height="50%"/>

diff --git a/example/pubspec.lock b/example/pubspec.lock
@@ -73,7 +73,7 @@ packages:
       path: ".."
       relative: true
     source: path
-    version: "0.0.5"
+    version: "0.0.6"
   matcher:
     dependency: transitive
     description:

diff --git a/lib/src/styles/typography.dart b/lib/src/styles/typography.dart
@@ -69,59 +69,78 @@ class Typography with Diagnosticable {
     return Typography(
       largeTitle: TextStyle(
         fontFamily: 'SanFranciscoPro',
+        fontWeight: FontWeight.w400,
         fontSize: 26,
+        letterSpacing: 0.22,
         color: color,
       ),
       title1: TextStyle(
         fontFamily: 'SanFranciscoPro',
+        fontWeight: FontWeight.w400,
         fontSize: 22,
+        letterSpacing: -0.26,
         color: color,
       ),
       title2: TextStyle(
         fontFamily: 'SanFranciscoPro',
+        fontWeight: FontWeight.w400,
         fontSize: 17,
+        letterSpacing: -0.43,
         color: color,
       ),
       title3: TextStyle(
         fontFamily: 'SanFranciscoPro',
+        fontWeight: FontWeight.w400,
         fontSize: 15,
+        letterSpacing: -0.23,
         color: color,
       ),
       headline: TextStyle(
         fontFamily: 'SanFranciscoPro',
         fontWeight: FontWeight.w400,
         fontSize: 13,
-        letterSpacing: 0.08,
+        letterSpacing: -0.08,
         color: color,
       ),
       subheadline: TextStyle(
         fontFamily: 'SanFranciscoPro',
+        fontWeight: FontWeight.w400,
         fontSize: 11,
+        letterSpacing: 0.06,
         color: color,
       ),
       body: TextStyle(
         fontFamily: 'SanFranciscoPro',
+        fontWeight: FontWeight.w400,
         fontSize: 13,
+        letterSpacing: 0.06,
         color: color,
       ),
       callout: TextStyle(
         fontFamily: 'SanFranciscoPro',
+        fontWeight: FontWeight.w400,
         fontSize: 12,
         color: color,
       ),
       footnote: TextStyle(
         fontFamily: 'SanFranciscoPro',
+        fontWeight: FontWeight.w400,
         fontSize: 10,
+        letterSpacing: 0.12,
         color: color,
       ),
       caption1: TextStyle(
         fontFamily: 'SanFranciscoPro',
+        fontWeight: FontWeight.w400,
         fontSize: 10,
+        letterSpacing: 0.12,
         color: color,
       ),
       caption2: TextStyle(
         fontFamily: 'SanFranciscoPro',
+        fontWeight: FontWeight.w400,
         fontSize: 10,
+        letterSpacing: 0.12,
         color: color,
       ),
     );

diff --git a/pubspec.yaml b/pubspec.yaml
@@ -1,6 +1,6 @@
 name: macos_ui
 description: Implements Apple's macOS Design System in Flutter. Based on the official documentation.
-version: 0.0.5
+version: 0.0.6
 homepage: 'https://github.com/GroovinChip/macos_ui'
 
 environment: