Domino Designer で Less to CSS

Domino Designer で
Less
to CSS
2014年12月12日
制作:海老原賢次(リコーITソリューションズ株式会社)
2014/12/12
1
Domino Designer で Less to CSS
OpenNTFで公開されているプラグインを使用して、
Domino DesignerでLessの編集と、
CSSへのコンパイルができます。
2014/12/12
2
そもそも Less ってなに?
CSSを生成するための言語
CSSを効率よく整理できるので、管理しやすい
構文はCSSと非常によく似ているので、習得しやすい
2014/12/12
3
LESSオフィシャルサイト
 http://goo.gl/ny55
2014/12/12
4
LESSの特徴
 セレクタを階層構造で記述できる!
 ミックスインで、複数のスタイル指定を定義できる!
 変数が利用できる!
 コンパイラが構文エラーを教えてくれる!
 複数のファイルに分割して編集->1つのCSSにコンパイルできる!
2014/12/12
5
導入方法
 Domino Designerのプラグインとしてインストールする
 クライアントのみの動作のプラグインなので、Domino Serverにインストールする必要は
ない
2014/12/12
6
LESS CSS Builder for Domino Designer
 こちらからダウンロード→ http://goo.gl/isAU4o
2014/12/12
7
LESS-セレクタをネスト
2014/12/12
8
LESS-変数・計算が使用できる
“色”の計算
2014/12/12
9
ミックスインで同じ定義を使いまわす
定義を使いまわす
2014/12/12
10
参考
 LESS公式 http://lesscss.org/
 LESS日本語 http://less-ja.studiomohawk.com/
 xspless http://goo.gl/isAU4o
 XPagesで行こう! http://goo.gl/CgngDG
2014/12/12
11
2014/12/12
12