Question

现在core-toolbar有一个indent类，通过60px将标题缩进到右边，而材料设计则要求保证金实际上应为80px（作为事实上，数字60从未在整个文档中显示过。）

所以我可以轻松地在bower_components/core-toolbar/core-toolbar.css中编辑它，但问题是，一旦我将项目移动到其他地方，我必须在完成我的bower安装后进行相同的编辑等。

请注意，如果我要延长core-toolbar说，我会遇到core-header-panel等问题。因为它会寻找<core-toolbar>或类似的东西"core-header"这有点令人烦恼，但这是我可以忍受的东西。

做这样的事情最好的方法是什么？

Answer 1

一种方法可能是使用像http://jsbin.com/soveyo/12/edit这样的全局覆盖核心工具栏的样式。请注意，我只有原生影子dom支持。

或者，如果您愿意，可以在特定情况下执行此操作。删除html / deep / bit。

或者您可以将自己的类添加到您作为内容添加到工具栏的元素中。给它你想要的缩进。

Answer 2

您也可以尝试创建自己的工具栏元素一个noscript聚合物元素，只有你的css风格和核心工具栏。类似的东西：

<polymer-element name="my-toolbar" noscript>
<template>
  <style>
    core-toolbar { /* xxxx */ }
  </style>
  <core-toolbar><content></content></core-toolbar>
</template>
</polymer-element>

甚至更好，您可以扩展核心工具栏以保留核心工具栏中的所有属性处理

如何覆盖默认的Polymer CSS

2 个答案: