diff --git a/src/pages/about/index.page.vue b/src/pages/about/index.page.vue
index 0bee504..3ace64b 100644
--- a/src/pages/about/index.page.vue
+++ b/src/pages/about/index.page.vue
@@ -5,9 +5,9 @@
 
 <style>
 code {
+  padding: 3px 5px;
   font-family: monospace;
   background-color: #eaeaea;
-  padding: 3px 5px;
   border-radius: 4px;
 }
 </style>
diff --git a/src/stories/button.css b/src/stories/button.css
index dc91dc7..75dc41f 100644
--- a/src/stories/button.css
+++ b/src/stories/button.css
@@ -1,30 +1,35 @@
 .storybook-button {
+  display: inline-block;
   font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
   font-weight: 700;
+  line-height: 1;
+  cursor: pointer;
   border: 0;
   border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  line-height: 1;
 }
+
 .storybook-button--primary {
   color: white;
   background-color: #1ea7fd;
 }
+
 .storybook-button--secondary {
   color: #333;
   background-color: transparent;
-  box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 0px 1px inset;
+  box-shadow: rgb(0 0 0 / 15%) 0 0 0 1px inset;
 }
+
 .storybook-button--small {
-  font-size: 12px;
   padding: 10px 16px;
+  font-size: 12px;
 }
+
 .storybook-button--medium {
-  font-size: 14px;
   padding: 11px 20px;
+  font-size: 14px;
 }
+
 .storybook-button--large {
-  font-size: 16px;
   padding: 12px 24px;
+  font-size: 16px;
 }
diff --git a/src/stories/header.css b/src/stories/header.css
index d9a7052..71fd9f8 100644
--- a/src/stories/header.css
+++ b/src/stories/header.css
@@ -1,10 +1,10 @@
 .storybook-header {
-  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-  padding: 15px 20px;
   display: flex;
   align-items: center;
   justify-content: space-between;
+  padding: 15px 20px;
+  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  border-bottom: 1px solid rgb(0 0 0 / 10%);
 }
 
 .storybook-header svg {
@@ -13,11 +13,11 @@
 }
 
 .storybook-header h1 {
-  font-weight: 700;
-  font-size: 20px;
-  line-height: 1;
-  margin: 6px 0 6px 10px;
   display: inline-block;
+  margin: 6px 0 6px 10px;
+  font-size: 20px;
+  font-weight: 700;
+  line-height: 1;
   vertical-align: top;
 }
 
@@ -26,7 +26,7 @@
 }
 
 .storybook-header .welcome {
-  color: #333;
-  font-size: 14px;
   margin-right: 10px;
+  font-size: 14px;
+  color: #333;
 }
diff --git a/src/stories/page.css b/src/stories/page.css
index 098dad1..bc84a9d 100644
--- a/src/stories/page.css
+++ b/src/stories/page.css
@@ -1,19 +1,19 @@
 .storybook-page {
+  max-width: 600px;
+  padding: 48px 20px;
+  margin: 0 auto;
   font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
   font-size: 14px;
   line-height: 24px;
-  padding: 48px 20px;
-  margin: 0 auto;
-  max-width: 600px;
   color: #333;
 }
 
 .storybook-page h2 {
-  font-weight: 700;
-  font-size: 32px;
-  line-height: 1;
-  margin: 0 0 4px;
   display: inline-block;
+  margin: 0 0 4px;
+  font-size: 32px;
+  font-weight: 700;
+  line-height: 1;
   vertical-align: top;
 }
 
@@ -22,8 +22,8 @@
 }
 
 .storybook-page a {
-  text-decoration: none;
   color: #1ea7fd;
+  text-decoration: none;
 }
 
 .storybook-page ul {
@@ -37,31 +37,31 @@
 
 .storybook-page .tip {
   display: inline-block;
-  border-radius: 1em;
-  font-size: 11px;
-  line-height: 12px;
-  font-weight: 700;
-  background: #e7fdd8;
-  color: #66bf3c;
   padding: 4px 12px;
   margin-right: 10px;
+  font-size: 11px;
+  font-weight: 700;
+  line-height: 12px;
+  color: #66bf3c;
   vertical-align: top;
+  background: #e7fdd8;
+  border-radius: 1em;
 }
 
 .storybook-page .tip-wrapper {
-  font-size: 13px;
-  line-height: 20px;
   margin-top: 40px;
   margin-bottom: 40px;
+  font-size: 13px;
+  line-height: 20px;
 }
 
 .storybook-page .tip-wrapper svg {
   display: inline-block;
-  height: 12px;
   width: 12px;
+  height: 12px;
+  margin-top: 3px;
   margin-right: 4px;
   vertical-align: top;
-  margin-top: 3px;
 }
 
 .storybook-page .tip-wrapper svg path {