sprucecss

Spruce CSSは、Sassに基づいて構築されたオープンソースのCSSデザインシステムおよびフレームワークです。npmを通じて配布され、MITライセンスの下でリリースされており、完全なコンポーネントキットではなく、プロジェクトに追加できる低レベルの基盤として位置付けられています。 READMEおよびドキュメントに記載されている特徴は以下の通りです： - Sassベースのツール群：このフレームワークはSassの変数、ミックスイン、関数を中心に構築されており、インポートには名前空間付きの@useを使用するSassモジュールシステムを採用しています。 - 小規模なユーティリティ：意図的に少数のクラシックなユーティリティクラスのみに依存しており、READMEによれば、伝統的なグリッドシステムは含まれていません。プロジェクトでは、フレームワークが比較的小規模（gzip圧縮後で約7KB）であり、コードベースが小さく、学習コストも低いとしています。 - CSS作者向け：作者は、マークアップ主体のユーティリティクラスを組み合わせるよりもCSSを書くことを好む人々にとって、Spruceが良い選択肢であるとしており、プロジェクトからプロジェクトへと手動で持ち運んでいたコードであると説明しています。 - テーマ設定：テーマはCSSカスタムプロパティで構築されており、ダークモードのサポートが含まれています。他のカラーテーマも同様の方法で作成可能です。 - ツールと出力の分離：生成されたCSSはフレームワークから分離して保持されるため、生成されたスタイルを取り込むことなく変数、ミックスイン、関数を使用できます。 - ドキュメントのテーマ：ドキュメントでは、カスタマイズ、Sassの基礎、およびタイポグラフィ、テーブル、ボタン、フォーム、メディアなどの要素ページに加え、アクセシビリティとインクルーシビティ、国際化、印刷についてもカバーしています。 - コンポーネントの分離：ドロップインUIコンポーネントは、コアフレームワーク内ではなく、別のプロジェクトであるSpruce UIで管理されています。 導入方法：READMEではsprucecss.comのドキュメント、特にインストールページを参照するように案内しており、既存のSassユーザーにとっての主な変更点は新しいモジュールシステムであると述べています。付属のEleventyスターターテンプレート（sprucecss-eleventy-starter）は、基本的なコンパイル設定を備えたボイラープレートを提供します。さらに、Eleventyで作成されたドキュメントテンプレートであるSpruce Docsと、標準的なビューと多くのコンポーネントを備えた管理テンプレートであるRootの2つのテンプレートがリストされています。 ドキュメントと貢献：完全なドキュメントはsprucecss.comでホストされ、別のリポジトリで管理されており、ドキュメントには貢献ガイドが含まれています。また、READMEにはGitHubリリース、npmパッケージ、テストワークフローへのリンクがあり、プロジェクト自体の資産で使用されているライト/ダークロゴについても言及されています。