dart - 核心抽屉面板抽屉是透明的

Question

我正在尝试学习Polymer.dart，并且被卡在核心抽屉面板的基本用法上……当我使用核心抽屉面板时，像这样:

<link rel="import" href="../../packages/polymer/polymer.html">

<link rel="import" href="../../packages/core_elements/core_drawer_panel.html">
<link rel="import" href="../../packages/core_elements/core_header_panel.html">
<link rel="import" href="../../packages/core_elements/core_toolbar.html">
<link rel="import" href="../../packages/core_elements/core_menu.html">
<link rel="import" href="../../packages/core_elements/core_icons.html">
<link rel="import" href="../../packages/core_elements/core_item.html">
<link rel="import" href="../../packages/paper_elements/paper_icon_button.html">

<polymer-element name="main-app">
  <template>
    <style>
      :host {
        display: block;
      }
    </style>
    <core-drawer-panel>
      <core-header-panel drawer>
        <core-toolbar>
          <div>Application</div>
        </core-toolbar>
        <core-menu>
          <core-item icon="settings">Test</core-item>
        </core-menu>
      </core-header-panel>
      <core-header-panel main>
        <core-toolbar>
          <paper-icon-button icon="menu" core-drawer-toggle></paper-icon-button>
          <div>Title</div>
        </core-toolbar>
        <div> Main content... </div>
      </core-header-panel>
    </core-drawer-panel>
  </template>
  <script type="application/dart" src="main_app.dart"></script>
</polymer-element>

我得到透明的抽屉，当布局切换到狭窄并且使用按钮显示抽屉时，例如抽屉区域内的菜单叠加在主要内容区域上...
我在这里想念什么？

Answer 1

好吧，我确实通过使用显式设计抽屉样式解决了该问题

[drawer] {
  background-color: #xxxxxx;
}

显然，抽屉不继承全局背景色...