From 049f91e7c7ccac65f531c0135dc2828e205d9c5f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Zalewski?=
 <przemyslaw.zalewski@sandstream.pl>
Date: Thu, 23 Jan 2020 09:28:03 +0100
Subject: [PATCH 1/7] Unify font-family style application

---
 examples/src/app.module.css | 18 ++----------------
 1 file changed, 2 insertions(+), 16 deletions(-)

diff --git a/examples/src/app.module.css b/examples/src/app.module.css
index 4d5a5cf..a2fa570 100644
--- a/examples/src/app.module.css
+++ b/examples/src/app.module.css
@@ -1,7 +1,3 @@
-html {
-  font-family: 'Roboto', sans-serif;
-}
-
 h3 {
   margin-bottom: 0;
   text-align: center;
@@ -13,18 +9,8 @@ h5 {
 }
 
 body {
-  /* stylelint-disable */
-  font-family:
-    system,
-    -apple-system,
-    '.SFNSText-Regular',
-    'San Francisco',
-    'Roboto',
-    'Segoe UI',
-    'Helvetica Neue',
-    'Lucida Grande',
-    sans-serif;
-  /* stylelint-enable */
+  font-family: system, -apple-system, '.SFNSText-Regular', 'San Francisco',
+    'Roboto', 'Segoe UI', 'Helvetica Neue', 'Lucida Grande', sans-serif;
 }
 
 footer {

From 04882c61fdc9cec4c31ddd24bc16a0d17e570400 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Zalewski?=
 <przemyslaw.zalewski@sandstream.pl>
Date: Thu, 23 Jan 2020 09:28:37 +0100
Subject: [PATCH 2/7] Set default increased line height

---
 examples/src/app.module.css | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/examples/src/app.module.css b/examples/src/app.module.css
index a2fa570..dbdd805 100644
--- a/examples/src/app.module.css
+++ b/examples/src/app.module.css
@@ -9,8 +9,17 @@ h5 {
 }
 
 body {
-  font-family: system, -apple-system, '.SFNSText-Regular', 'San Francisco',
-    'Roboto', 'Segoe UI', 'Helvetica Neue', 'Lucida Grande', sans-serif;
+  font-family:
+    system,
+    -apple-system,
+    '.SFNSText-Regular',
+    'San Francisco',
+    'Roboto',
+    'Segoe UI',
+    'Helvetica Neue',
+    'Lucida Grande',
+    sans-serif;
+  line-height: 1.7;
 }
 
 footer {

From 332e0f13599224cbd1d1ac1dd52857cf7506f6c8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Zalewski?=
 <przemyslaw.zalewski@sandstream.pl>
Date: Thu, 23 Jan 2020 09:41:56 +0100
Subject: [PATCH 3/7] Disable confused stylelint and prettier conflict

---
 examples/src/app.module.css | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/examples/src/app.module.css b/examples/src/app.module.css
index dbdd805..ee7210f 100644
--- a/examples/src/app.module.css
+++ b/examples/src/app.module.css
@@ -9,6 +9,7 @@ h5 {
 }
 
 body {
+  /* stylelint-disable */
   font-family:
     system,
     -apple-system,
@@ -19,6 +20,7 @@ body {
     'Helvetica Neue',
     'Lucida Grande',
     sans-serif;
+  /* stylelint-enable */
   line-height: 1.7;
 }
 

From aea62e6d32d0064f7dec388200dda2dbb13091c9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Zalewski?=
 <przemyslaw.zalewski@sandstream.pl>
Date: Thu, 23 Jan 2020 09:43:28 +0100
Subject: [PATCH 4/7] Center footer text content despite flexbox centering

---
 examples/src/app.module.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/examples/src/app.module.css b/examples/src/app.module.css
index ee7210f..a2b499f 100644
--- a/examples/src/app.module.css
+++ b/examples/src/app.module.css
@@ -29,6 +29,7 @@ footer {
   flex-direction: column;
   align-items: center;
   padding: 56px 0;
+  text-align: center;
 }
 
 a {

From 3e86c2ef394a2b72a7c819cfac0818e024bb20f9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Zalewski?=
 <przemyslaw.zalewski@sandstream.pl>
Date: Thu, 23 Jan 2020 09:49:57 +0100
Subject: [PATCH 5/7] Give up and let stylelint take over formatting as the
 rules seems to be not be affected by disable rules

---
 examples/src/app.module.css | 14 ++------------
 1 file changed, 2 insertions(+), 12 deletions(-)

diff --git a/examples/src/app.module.css b/examples/src/app.module.css
index a2b499f..9f1dbc1 100644
--- a/examples/src/app.module.css
+++ b/examples/src/app.module.css
@@ -9,18 +9,8 @@ h5 {
 }
 
 body {
-  /* stylelint-disable */
-  font-family:
-    system,
-    -apple-system,
-    '.SFNSText-Regular',
-    'San Francisco',
-    'Roboto',
-    'Segoe UI',
-    'Helvetica Neue',
-    'Lucida Grande',
-    sans-serif;
-  /* stylelint-enable */
+  /* prettier-ignore */
+  font-family: system, -apple-system, '.SFNSText-Regular', 'San Francisco', 'Roboto', 'Segoe UI', 'Helvetica Neue', 'Lucida Grande', sans-serif;
   line-height: 1.7;
 }
 

From 591454e93faef4fc81379f7cfcce66f1cc4b4810 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Zalewski?=
 <przemyslaw.zalewski@sandstream.pl>
Date: Thu, 23 Jan 2020 09:59:27 +0100
Subject: [PATCH 6/7] Adjust header margins to make them not stick to the
 chrome

---
 examples/src/app.module.css | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/examples/src/app.module.css b/examples/src/app.module.css
index 9f1dbc1..8a62489 100644
--- a/examples/src/app.module.css
+++ b/examples/src/app.module.css
@@ -14,6 +14,27 @@ body {
   line-height: 1.7;
 }
 
+h1,
+h2,
+h3,
+h4,
+h5 {
+  margin-left: 16px;
+  margin-right: 16px;
+}
+
+h1 {
+  display: block;
+  font-size: 1.17em;
+  margin-block-start: 1em;
+  margin-block-end: 1em;
+  margin-inline-start: 0;
+  margin-inline-end: 0;
+  font-weight: bold;
+  margin-bottom: 0;
+  text-align: center;
+}
+
 footer {
   display: flex;
   flex-direction: column;

From 96f2ea963710039e4044fad10bfca5f30fc3d340 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Zalewski?=
 <przemyslaw.zalewski@sandstream.pl>
Date: Thu, 23 Jan 2020 10:00:35 +0100
Subject: [PATCH 7/7] Use more semantic header tag and provide fallback trigger
 texts

---
 examples/src/App.js | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/examples/src/App.js b/examples/src/App.js
index baddf30..55d7b6e 100644
--- a/examples/src/App.js
+++ b/examples/src/App.js
@@ -66,10 +66,12 @@ function App() {
 
   return (
     <div className={styles.example}>
-      <h3>react-swipeable-list example</h3>
+      <h1>react-swipeable-list example</h1>
       <h5>(try also mobile view in dev tools for touch events)</h5>
       <h3>Simple example (with default 0.5 action trigger threshold)</h3>
-      <span className={styles.actionInfo}>{triggeredSimpleItemAction}</span>
+      <span className={styles.actionInfo}>
+        {triggeredSimpleItemAction || 'No action triggered yet'}
+      </span>
       <div className={styles.listContainer}>
         <SwipeableList>
           <SwipeableListItem
@@ -97,7 +99,9 @@ function App() {
         More complex items and scroll (with 0.25 action trigger threshold)
       </h3>
       <h3>List in smaller container</h3>
-      <span className={styles.actionInfo}>{triggeredComplexItemAction}</span>
+      <span className={styles.actionInfo}>
+        {triggeredComplexItemAction || 'No action triggered yet'}
+      </span>
       <div className={styles.complexListContainer}>
         <SwipeableList threshold={0.25}>
           <SwipeableListItem