docs(readme): add feature list

This commit is contained in:
@lukin 2021-11-21 19:20:00 +07:00
parent dd25c0c052
commit 155bc47df1

View file

@ -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
```