Add TODOs about components needing to adjust to screen size changes.

Our current static view_configuration design cannot work.

https://github.com/domokit/mojo/issues/231

R=ianh@google.com

Review URL: https://codereview.chromium.org/1169813009.

sdk/lib/framework/components2/drawer.dart

@@ -13,6 +13,19 @@ import 'dart:sky' as sky;
 import 'material.dart';
 import 'package:vector_math/vector_math.dart';
 
+// TODO(eseidel): Draw width should vary based on device size:
+// http://www.google.com/design/spec/layout/structure.html#structure-side-nav
+
+// Mobile:
+// Width = Screen width − 56 dp
+// Maximum width: 320dp
+// Maximum width applies only when using a left nav. When using a right nav,
+// the panel can cover the full width of the screen.
+
+// Desktop/Tablet:
+// Maximum width for a left nav is 400dp.
+// The right nav can vary depending on content.
+
 const double _kWidth = 304.0;
 const double _kMinFlingVelocity = 0.4;
 const double _kBaseSettleDurationMS = 246.0;

sdk/lib/framework/components2/floating_action_button.dart

@@ -10,6 +10,8 @@ import 'dart:sky' as sky;
 import 'ink_well.dart';
 import 'material.dart';
 
+// TODO(eseidel): This needs to change based on device size?
+// http://www.google.com/design/spec/layout/metrics-keylines.html#metrics-keylines-keylines-spacing
 const double _kSize = 56.0;
 
 class FloatingActionButton extends Component {

sdk/lib/framework/components2/scaffold.dart

@@ -79,6 +79,8 @@ class RenderScaffold extends RenderBox {
     assert(size.height < double.INFINITY);
   }
 
+  // TODO(eseidel): These change based on device size!
+  // http://www.google.com/design/spec/layout/metrics-keylines.html#metrics-keylines-keylines-spacing
   static const kButtonX = 16.0; // left from right edge of body
   static const kButtonY = 16.0; // up from bottom edge of body
 

sdk/lib/framework/theme2/view_configuration.dart

@@ -8,7 +8,14 @@
 const double kNotificationAreaHeight = 25.0;
 // TODO(ianh): Figure out actual specced height for status bar
 const double kStatusBarHeight = 50.0;
+
+// TODO(eseidel) Toolbar needs to change size based on orientation:
+// http://www.google.com/design/spec/layout/structure.html#structure-app-bar
+// Mobile Landscape: 48dp
+// Mobile Portrait: 56dp
+// Tablet/Desktop: 64dp
 const double kToolBarHeight = 56.0;
+
 const double kMaterialDrawerHeight = 140.0;
 const double kScrollbarSize = 10.0;
 const double kScrollbarFadeDuration = 250.0;