dart - 如何在 Polymer.dart 中使用 Material 设计的内置 css 颜色类？

Question

我正在尝试测试并将官方霓虹动画示例之一从 JS 移植到 Dart。

这是原文js demo和 js source ,
这是我实现的Dart demo和 Dart source

遇到的2个问题:

在JS版本中，div的颜色是用class分配的，例如:class="card green-300"，green-300表示一种 Material 颜色，同样的方法在Dart版本中不起作用，所以 Dart 中使用 css 类分配内置 Material 设计颜色的方法是什么？

html :

<div id="[[index]]" class="card green-300" on-tap="onTapped">
   <span>[[item.value]]</span>
</div>

所有布局都是在 html 中定义的，所以结果应该是一样的。 但在我的 Dart 版本中，布局被破坏了。也许需要一些额外的设置？

js的结果 :


Dart 结果 :

--更新于2016.05.24--

Problem 1 is solved. 

正如 Günter Zöchbauer 指出的那样，我忘记导入包含那些手写和预定义 css 颜色类的 html。我想我们只需要枚举所有颜色并在某处预定义这些 css 类。谢谢君特。

Problem 2 is about solved. 

奇怪的是，由 polymer.js 构建的相同内容在 chrome v50 和 v51 上可以正常工作，但 polymer.dart 只能在 chrome v51 上工作。

Answer 1

更改display: block的 <grid-view>至display: flex使它看起来像您的第一个屏幕截图。