ポリマー1.2：変更紙項目選択した背景色

を見つけた私はまだわずか6評判を持っているので、受け入れられた解決策は、私のために動作しませんが、私はコメントすることはできません - .-

だから、状況は...私は動作しますが、あなたはそれをクリックして項目を選択すると、背景の変更は灰色に紙のリストボックス内部のポリマー・フレームワークからpaper-itemを使用したい、ドキュメントです私がabvoeをリンクした質問に対する答えは--paper-item-selected/-paper-item-focus mixinを上書きすることを提案していますが、これは私のためには機能しません

マイコード：

<link rel="import" href="../../../external/Polymer/bower_components/polymer/polymer.html"> 


<dom-module id="cit-literal-item"> 

<template> 
    <!-- scoped CSS for this element --> 
    <style is="custom-style"> 
     .spacer { 
      @apply(--layout-flex); 
     } 
     paper-item { 
      --paper-item-selected: { 
       background-color: #FFFFFF; 
      }; 

      --paper-item-focused: { 
       background-color: #FFFFFF; 
      }; 
     } 
    </style> 
    <paper-item>Test</paper-item> 
</template> 
</dom-module>

メイン文書番号：

... 
<!-- Polymer custom elements --> 
<link rel="import" href="lib/internal/dom-modules/literals/cit-literal-item.html"> 
... 
<body> 
    <paper-listbox> 
     <cit-literal-item></cit-literal-item> 
     <cit-literal-item></cit-literal-item> 
    </paper-listbox> 
</body>

出典

2015-12-28 Basti Skaldendudler

Polymer要素で 'is =" custom-style "を使用する必要はありません。これは、ポリマータグのテンプレートの外側にスタイルタグを追加する場合にのみ必要です。 –

これを指摘してくれてありがとう！残念ながら私の問題は修正されませんでした：/ –

これは予想通りでした。それ以外の場合はコメントとして回答として追加しました。なぜそれが期待どおりに機能していないのかわかりません。 –

私は "ソリューション" を発見！私は上書きしなければならなかったプロパティが

--paper-item-focused-beforeと呼ばれる私は<paper-item>のソースコードを見て、共有styles.html

共有styles.htmlでこれを見つけた

:host(.iron-selected) { 
    font-weight: var(--paper-item-selected-weight, bold); 
    @apply(--paper-item-selected); 
    } 
    :host([disabled]) { 
    color: var(--paper-item-disabled-color, --disabled-text-color); 
    @apply(--paper-item-disabled); 
    } 
    :host(:focus) { 
    position: relative; 
    outline: 0; 
    @apply(--paper-item-focused); 
    } 
    :host(:focus):before { 
    @apply(--layout-fit); 
    background: currentColor; 
    content: ''; 
    opacity: var(--dark-divider-opacity); 
    pointer-events: none; 
    @apply(--paper-item-focused-before); 
    }

一つ見ることができますデフォルトで色を適用する唯一のミックスインは--paper-item-focused-beforeであり、<paper-item>の:before疑似要素にスタイルを適用します。

出典

2015-12-28 12:59:35

私はこれが古いスレッドだと知っていますが、私はこの同じ問題を抱えています。上記の提案は私のために働いていません。 Polymer 1.xのバージョンでこれを修正する方法があれば誰でも知っていますか？ –

ちょっと@EvanCaldwell、提供されたソリューションがあなたのために働いていない場合、私はあなたのコードを含む新しい質問を投稿することが最善だと思います！コメントをここに投稿してください！確かめます –

- papers-item-focused-before：{背景：透明。 };

出典

2018-03-06 10:03:35

ポリマー1.2：変更紙項目選択した背景色

答えて

関連する問題