はじめに
kintoneのデザインと調和するスタイルシートを適用したい場合は、パッケージングの際にGithub上の「51-modern-default.css」を同梱し、下記のクラスを適用したいHTMLタグにご適用ください。
「51-modern-default.css」スタイルシート対応表
| クラス名 | 表示例 | 利用例 |
|---|---|---|
| kintoneplugin-alert |
|
|
| kintoneplugin-row |
|
|
| kintoneplugin-label |
|
|
| kintoneplugin-title |
|
|
| kintoneplugin-require |
|
|
| kintoneplugin-desc |
|
|
| kintoneplugin-input-outer kintoneplugin-input-text |
|
|
| kintoneplugin-input-checkbox kintoneplugin-input-checkbox-item |
|
|
| kintoneplugin-dropdown-outer kintoneplugin-dropdown kintoneplugin-dropdown-selected |
|
|
| kintoneplugin-dropdown-list kintoneplugin-dropdown-list-item kintoneplugin-dropdown-list-item-selected kintoneplugin-dropdown-list-item-name |
|
|
| kintoneplugin-select-outer kintoneplugin-select |
|
|
| kintoneplugin-input-radio kintoneplugin-input-radio-item |
|
|
| kintoneplugin-table kintoneplugin-table-th kintoneplugin-table-th-blankspace kintoneplugin-table-td-control kintoneplugin-table-td-control-value kintoneplugin-table-td-operation kintoneplugin-button-add-row-image kintoneplugin-button-remove-row-image |
|
|
| kintoneplugin-button-normal |
|
|
| kintoneplugin-button-disabled |
|
|
| kintoneplugin-button-dialog-ok |
|
|
| kintoneplugin-button-dialog-cancel |
|
注意事項
- 今後のデザイン変更によって提供するスタイルのレイアウトが崩れたり、kintoneのデザインと調和しなくなる可能性があります。
- デザインの変更によるスタイルの保障は致しませんのでご注意ください。
- 表示例はブラウザの設定によって表示が一部変わる可能性がございます。
記事に関するフィードバック
記事のコメント欄は記事に対するフィードバックをする場となっております。
右の記事フィードバックのためのガイドを参照してコメントしてください。
記事のリンク切れなど、気になる点がある場合も、こちらのフォームからフィードバックいただけますと幸いです。