YouTubeの埋め込みで再生後に関連動画を表示しないようにする
YouTubeの埋め込みを行う際、再生後に表示される関連動画を出さないようにしたいということがあったので、対応方法をメモ...
FigmaのDev Modeを使ってみる
FigmaのDev Modeを使って、どういったことができるのかを確認してみます。...
detailsの開閉にアニメーションを追加する
detailsを使ったアコーディオンの実装が度々あるので、JavaScriptを使った開閉時のアニメーションの実装をメモ...
Astroでコメントを記述する
Astroのコード内でコメントを記述する方法について調べたことをメモ。...
Tailwind CSSでブレークポイントを設定する
Tailwind CSSでブレークポイントを設定する方法を試してみます。 使用環境はAastro 5.16.0 / Ta...
npmのscriptsを使ってみる
package.json内に設定できる、npmのscriptsについていくつか試してみます。...
Astroでフラグメントを使用する
Astroでフラグメントを使用する方法をメモ。...
Movable Typeで税込み価格を表示する
商品情報を登録する際に税抜き価格のみを入力して、税込み価格は自動で計算して表示させたいということがあったので、実装の手順...
FigmaのREST APIで画像を書き出す
FigmaのREST APIを使って、画像を書き出す方法を試してみます。...
Tailwind CSSで疑似要素を使用する
Tailwind CSSで疑似要素を使用する方法をメモ。 使用環境はAastro 5.16.0 / Tailwind C...
高さが可変の要素をスクロール対象にする
タイトルだとわかりにくいですが、例えばモーダルコンテンツの中の一部だけ内容量に合わせてスクロールさせる、といった実装をし...
Tailwind CSSで任意のclassが付与された時にスタイルを適用する
Tailwind CSSを使って、「is-current」のような任意のclassが付与された際にスタイルを適用する方法...
VSCodeで左右のタブに切り替える
VSCodeでCtrl + Tabキーを押下すると、直近表示した順でファイル一覧が表示されるようになっていますが、ブラウ...
:user-invalid擬似クラスを使ってみる
フォームの要素をユーザーが操作した後で、内容が有効でなかった場合にスタイルを設定できる:user-invalid擬似クラ...
Astroで動的にHTMLタグを変更する
Astroで変数を使ってHTMLタグを変更する方法をメモ。...
Astroでループや条件分岐を行う
Astroでループや条件分岐のやり方をメモ。...
Figmaでテキスト情報を取得するプラグインを作成する
以前に投稿したFigmaのプラグインを作成する記事の内容を踏まえて、Figmaのページ内のテキスト情報を取得するプラグイ...
Cursorでsetting.jsonを開く
以前にVSCodeでPrettierを使用する記事を投稿しましたが、Cursorで設定しようとした時にsetting.j...
要素のサイズ設定時に使用できるキーワードを試してみる
要素のサイズ設定時に使用できるキーワードのstretch・fit-content・min-content・max-con...
dialog要素を使ってモーダルを実装する
dialog要素を使ってモーダルを実装する際、よく必要になる処理をいくつか実装してみます。...