VMware Clarity Design Systemのブランドアイコンのサイズを変更するには

VMware Clarity Design SystemのUI（https://vmware.github.io/clarity/）を使用していて、シードアプリケーションを実行しています。自分のブランドのアイコンを自分のものに置き換えようとしていますが、サイズが異なります。アイコンが36px x 36pxにハードコードされているように見えます。 CSSで新しいサイズを設定しようとすると、36px x 36pxのままレンダリングされます。これはハードコードされていますか？それだっVMware Clarity Design Systemのブランドアイコンのサイズを変更するには

LogoSize

出典

2017-01-23 codemonkey_42

これは、スタックオーバーフローに関する最初の質問です。歓迎！私たちがあなたが試したことを理解し、あなたの質問の文脈をよりよく理解できるように、いくつかのコードを提供してください。また、より良い答えにつながるより良い質問をする方法については、[How To Ask]（http://stackoverflow.com/help/how-to-ask）を参照してください。 –

だから、シードプロジェクトは、次のコードを提供します。

Clarity

を..... は私が <スパンクラス= "CLR-アイコンCLR-Dellのロゴを">に変更し、私のクラスのCLR-デルのロゴを追加しましたCSSへ： .clr-icon { ＆.clr-clarity-logo { background-image：url（../ images/clarity_logo.svg）; }} .clrアイコン{ ＆.clr-デルロゴ{ 背景画像：URL（../画像/ DellLogoWht.png）。 }} –

も試み： .clrアイコン{ ＆.clr-デルロゴ{ 背景画像：URL（../画像/ DellLogoWht.png）。 background-size：400px 180px; } } –

。私はイメージに.clr-iconクラスではなくサイズを追加する必要があると思っていました。これは動作します：

.header .branding .clr-icon { 
 
    height: 13px; 
 
    width: 73.9px; 
 
    &.clr-dell-logo { 
 
     background-image: url(../images/DellLogoWht.png); 
 
    } 
 
}

出典

2017-01-23 21:16:25

あなたの答えはあなたが（私はあなたがそれを反映するためにアップ投票）CSSでサイズを設定したいときのために正しいです。それは約1ですが、私たちはここにsize属性を使用した例がありますかClarity Icons Documentation

を

<clr-icon shape="info" size="48"></clr-icon>

：あなたはまた、CLR-アイコン要素にサイズ属性を持つアイコンのサイズを設定することができます/ページの下に2方向に移動するか、のアイコンサイズを設定してください。 FYI - クラリティアイコンのドキュメントを更新中です。

出典

2017-08-02 14:26:14 hippeelee

VMware Clarity Design Systemのブランドアイコンのサイズを変更するには

答えて

関連する問題