以下の記事やサービスでfont-sizeを入力するとそれに応じて出力はされますが、scssで使用する場合にはmixinで使用したいため、font-size調整用のmixinを作成した内容です。 coliss.com www.fluid-type-scale.com min-max-calculator.9elements.com 結果 @use…

以下の記事で stylus → dart-sassに変更はしたが、dart-sassに変更したにあたって、@importの記載を@use,@forwordに変更をしたため、その時に行なったことを紹介します。 jackswim3411.hatenablog.com importの廃止についての記事 sass-lang.com 参考にした…

stylusからdart-sassに変更したので、その時に対応したこと、stylusとscssのコードの比較に載せたものになります。 変更した箇所のコードについては以下になります。 github.com stylusからdart-sassに変更した理由 stylintでstylusのインデント調整した後に…

フロントエンドの開発時にESLintやPrettierなどのnpmパッケージを使うほど大きなプロジェクトではない（もしくは使うことができない）環境でも簡単に使用できるwebサービス一覧です。 コード変換 Prettier prettier.io jsのコードの整形を行なってくれるサー…

テキストを1文字ずつアニメーションさせるときに手動でspanを囲わないで行いたいときに 成果物 See the Pen テキストアニメーション by miwa_shuntaro (@miwashutaro0611) on CodePen. 行ったこと 1. HTMLの作成 .txt: テキスト全体 .line: 改行させるための…

色の取得をしてくれるもの webサービス XDプラグイン 基本的な書き方 css 通常 :root { --blue: #00f; } .className { color: var(--blue); /* 青色 */ } scss 通常 $blue: #00f; .className { color: $blue; // 青色 } パレットを使ってそこで管理 $palette…