ブロック
ブロック
基本ブロック
プライマリブロック
タイトルと本文を持つブロック。
パディングなしのブロック（block--bodyを使用）。
ブロックタイトル
タイトルと本文を持つブロック。
プライマリブロック
タイトルと本文を持つブロック。
セカンダリブロック
スペーシングを示すための別のブロック。
プライマリブロック
タイトルと本文を持つブロック。
セカンダリブロック
スペーシングを示すための別のブロック。
ティアリーブロック
行の中の第三のブロック。
プライマリブロック
タイトルと本文を持つブロック。
セカンダリブロック
スペーシングを示すための別のブロック。
ティアリーブロック
行の中の第三のブロック。
クァータリーブロック
レイアウトデモ用の第四のブロック。
セカンダリブロック
スペーシングを示すための別のブロック。
高度なブロック
パイプライン投影
準備完了
このブロックはタイトルスロットとコンテンツを単一の再利用可能な構造に結合します。
オペレーターは現在のコンテキストを離れることなく追加できます。
メインゾーン
メインコンテンツは標準的なスペーシングで自然に成長できます。
サイドゾーン
このサイドゾーンは軽い背景を使用して補完的なコンテンツを強調します。
三ゾーンレイアウト
ドラフト
左パネル
セカンダリナビゲーションやメタデータがここに存在します。
メインコンテンツ
主要な情報は可読性のために中央に保たれます。
右パネル
コンテキストアクションやインサイトがこの側にグループ化できます。
固定サイドカラム
--sizeスケールに基づいてサイズ調整された狭いカラムで、残りの幅を吸収するボディの隣に配置される。
128
プロジェクション
プライマリブロック
タイトルと本文を持つブロック。
セカンダリブロック
スペーシングを示すための別のブロック。
カード
プライマリブロック
タイトルと本文を持つブロック。
セカンダリブロック
スペーシングを示すための別のブロック。
ティアリーブロック
行の中の第三のブロック。
コーナーのマーク
`block--mark` はブロックの開始時に上部コーナーに小さなアイコンを配置します：それは何であるか — 図に配置されたカードのタイプ、文書の種類 — 、言っていることの横にあり、タイトルではありません。
プライマリブロック
タイトルと本文を持つブロック。
プライマリブロック
タイトルと本文を持つブロック。
プライマリブロック
タイトルと本文を持つブロック。
リンクとしてのブロック
カード全体がリンクであり、いくつかのカードの中から一つを選ぶことで選択される：プラン、ブランチ、テンプレート。それはテキストとして表示され、静かなアクションとしてではない；ポインターの下でその地面がニュアンスを持ち、エッジがしっかりし、キーボードは各コントロールが持つフォーカスリングによってそれを見つける。
フィギュア
中央に配置された単一のオーバーサイズの値またはアイコン。ダッシュボードのカウンターやステータスタイルに使用される — 幅に関係なくタイルを正方形に保つためにblock--squareを追加。
スループット
42
秒あたりのイベント
主要な指標
ダッシュボードの主要指標として読み取られる数値： `block--figure--start` は行の開始からそれを配置し、ラベルは上に、値はその単位を後ろに設定して表示します（`block--figure-unit`）、それが何で構成されているかを示す下の行（`block--figure-sub`）。 `block--tone-cat-<name>` はカテゴリのバーをエッジに描き、`a.block--link` は数値のビューを開きます。 `grid` では、部屋が狭くなると行が複数行に渡ります。
トーンを持つブロック
状態やカテゴリーの色が先端のバーとして表示され、それ以外は何もない：メッセージが持つ同じバーで、色のない地面がなく、リストとして表示されてアラームにはならない。どのブロックでもそれを持つことができ、ブロック上に立つバーも含まれる。
block--tone-info — 地面はブロック自身のもので、先端のみが色を持つ。
block--tone-success — 地面はブロック自身のもので、先端のみが色を持つ。
block--tone-warning — 地面はブロック自身のもので、先端のみが色を持つ。
block--tone-error — 地面はブロック自身のもので、先端のみが色を持つ。
block--tone-cat-lavender — 地面はブロック自身のもので、先端のみが色を持つ。
スタック
横型
等しいカラム、全幅、オーバーフロー時にラップ。
1
2
3
4
縦型
積み重ねられた行、全幅、均一なギャップ。
1
2
3
分割
最初の子は成長し、最後の子は固定される — リード + アクション行に使用。
このリードテキストでアクションを説明する。
コーナーのアクション
フレーム上の `has-corner-actions` — リード、ブロック、コードブロック、メッセージ — その中の `corner-actions` にあるアイコンアクション：フレームの端の上部コーナーにあり、フレームが指されているかキーボードを保持している間表示され、ポインターなしの画面では常に表示される（常に表示するための `corner-actions--always`）。実行中のテキストを保持するフレームは、そこにコラムを自由に保ちます。
このリードはコーナーのボタンでコピーできます。
ネスト
縦型スタックを含む横型スタック — 一般的なダッシュボードグリッド。
ONEONE
ONETWO
ONETHREE
TWOONE
TWOTWO
TWOTHREE
THREEONE
THREETWO
THREETHREE