фон-колір аркушів-каркасів = # 526E9C для заголовка. Де змінитись? - css, dart-polymer, паперові елементи

Я прочитав відповіді на інші [дуже] пов'язані питання, але я думав, що я буду представляти його знову, оскільки полімер оновлення, можливо, були зроблені.

Я можу змінити всі кольори в [dart]paper-scaffold (core-scaffold) - меню та панель інструментів, але я не можу змінити колір заголовка у верхній частині. Це завжди background-color = # 526E9C. Єдиний спосіб, я можу це зробити - це змінити стиль основної панелі інструментів у згенерованому (з використанням pub publ) index.html. І це одна зміна рядка встановлює колір через весь заголовок у вікні веб-переглядача (що я хочу). Так що я можу пройти повз.

Коли я роблю стиль:

core-toolbar{
background-color: #7A418D;
color: #FFF;
}

вона лише змінює колір над ящиком, а не по всьому верху. Це дуже таємниче, чому він просто робить це трохи!

Я спробував shadow-shim, core-scaffold:

На моєму сайті (sekpa.org) він показує цю синю половину (# 526E9C).

Це просто помилка? Якщо це так, то я буду дуже щасливий у цьому знанні!
Дякую
Стів

Відповіді:

Є два core-header-panels всередині a paper-scaffold.

Кожен core-header-panel містить один core-toolbar.

Лівий збірний core-header-panel а також його внутрішній core-toolbar сидять у нормальному світлі DOM, і тому ви можете змінити його колір, вказавши так css.

Однак право core-header-panel і core-toolbar знаходяться всередині paper-scaffold"" Тінь DOM. Щоб змінити колір цього core-toolbar, потрібно зробити щось подібне -

paper-scaffold::shadow core-toolbar {
background: #7A418D;
color: #fff;
}

Докладнішу інформацію див посилання.