From 155bc47df1733691a36ba9605f50002f8777c4e4 Mon Sep 17 00:00:00 2001
From: "@lukin" <anthony@lukin.dev>
Date: Sun, 21 Nov 2021 19:20:00 +0700
Subject: [PATCH] docs(readme): add feature list

---
 README.md | 40 ++++++++++++++++++++++++++--------------
 1 file changed, 26 insertions(+), 14 deletions(-)

diff --git a/README.md b/README.md
index f5eea85..c5f1d9c 100644
--- a/README.md
+++ b/README.md
@@ -4,6 +4,22 @@ Keywind is a component-based Keycloak Login Theme built with [Tailwind CSS](http
 
 ![Preview](./preview.png)
 
+### Styled Pages
+
+- Login
+- Login IDP Link Confirm
+- Login Reset Password
+- Login Update Password
+- Login Update Profile
+- Register
+
+### Social Media Icons
+
+- Facebook
+- GitHub
+- Google
+- Microsoft
+
 ## Installation
 
 Keywind has been designed with component-based architecture from the start, and **you can customize as little or as much Keywind as you need**:
@@ -16,19 +32,11 @@ Keywind has been designed with component-based architecture from the start, and
 parent=keywind
 ```
 
-4. Brand and Customize components with [FreeMaker](https://freemarker.apache.org/docs/dgui_quickstart_template.html)
+4. Brand and customize components with [FreeMaker](https://freemarker.apache.org/docs/dgui_quickstart_template.html)
 
-## Features
+## Customization
 
-### Styled Pages
-
-* Login
-* Password Reset
-* Register
-
-## Examples
-
-### Color Theme
+### Theme
 
 When you do need to customize a palette, you can configure your colors under the `colors` key in the `theme` section of `tailwind.config.js` file:
 
@@ -42,12 +50,12 @@ module.exports = {
       },
     },
   },
-}
+};
 ```
 
 Read more about Tailwind CSS configuration in the [documentation](https://tailwindcss.com/docs/configuration).
 
-### Primary Button Size
+### Components
 
 You can inherit Keywind components in your own theme. For example, to resize the primary button you should create a styled `theme/mytheme/components/button/primary.ftl` file:
 
@@ -64,10 +72,14 @@ You can inherit Keywind components in your own theme. For example, to resize the
 </#macro>
 ```
 
-### Build
+## Build
 
 When you're ready to deploy your own theme, run the build command to generate a static production build.
 
 ```bash
+npm install
+npm run build
+# or
+yarn install
 yarn build
 ```