at backyard

Color my life with the chaos of trouble.

CSSフレームワーク、BULMAのmodalサンプルコード

少し前にBULMAを触っていると、日記に書いた。

nikki.shinshin86.com

ちなみにこの日記に書いている8月引きこもり宣言については、問題なく達成できた。
まだセミは鳴いているので外に出ることはまだないが、蝉の声も小さくなってきたので、外に出れる日もそう遠くはないだろう。

さて、CSSフレームワークのBULMAだが、これがなかなか便利で、今でも機会を見てちょいちょい触っている。
ただ、ドキュメントがいささか簡素、というか、ドキュメントどおりに書いただけでは再現できない箇所がいくつかある。
Webの画面を作っている人なら特に問題ないレベルだが、まあ思考停止状態でコード書いているとき(コピペ脳状態)だと、サラッと実装したいときに一度立ち止まって実装について考える必要が出てくるのがすこし嫌だった。

数年前にcodepenにアカウントを作っていたと思い、ためしにBULMAのmodalのサンプルをこちらで書いてみた。

codepen.io

あ、ちなみにBULMAを使う場合は、こちらのHTMLジェネレータを使うと、サクッと書き始められます(宣伝)。

html-generator.shinshin86.com

必要なメタデータを入力して、コード生成欄をクリックすればクリップボードにHTMLにコピーされますので、よろしければ試してみてください。