docs(): make demo checkboxes not go full-width

Closes #1338

src/components/checkbox/demoBasicUsage/index.html

@@ -1,23 +1,28 @@
 
 <div ng-controller="AppCtrl">
-
- <md-checkbox ng-model="data.cb1" aria-label="Checkbox 1">
- Checkbox 1: {{ data.cb1 }}
- </md-checkbox>
-
- <md-checkbox ng-model="data.cb2" aria-label="Checkbox 2" ng-true-value="'yup'" ng-false-value="'nope'" class="md-warn">
- Checkbox 2 (md-warn): {{ data.cb2 }}
- </md-checkbox>
-
- <md-checkbox ng-disabled="true" aria-label="Disabled checkbox" ng-model="data.cb3">
- Checkbox: Disabled
- </md-checkbox>
-
- <md-checkbox ng-disabled="true" aria-label="Disabled checked checkbox" ng-model="data.cb4" ng-init="data.cb4=true">
- Checkbox: Disabled, Checked
- </md-checkbox>
-
- <md-checkbox md-no-ink aria-label="Checkbox No Ink" ng-model="data.cb5" class="md-primary">
- Checkbox (md-primary): No Ink
- </md-checkbox>
+ <div>
+ <md-checkbox ng-model="data.cb1" aria-label="Checkbox 1">
+ Checkbox 1: {{ data.cb1 }}
+ </md-checkbox>
+ </div>
+ <div>
+ <md-checkbox ng-model="data.cb2" aria-label="Checkbox 2" ng-true-value="'yup'" ng-false-value="'nope'" class="md-warn">
+ Checkbox 2 (md-warn): {{ data.cb2 }}
+ </md-checkbox>
+ </div>
+ <div>
+ <md-checkbox ng-disabled="true" aria-label="Disabled checkbox" ng-model="data.cb3">
+ Checkbox: Disabled
+ </md-checkbox>
+ </div>
+ <div>
+ <md-checkbox ng-disabled="true" aria-label="Disabled checked checkbox" ng-model="data.cb4" ng-init="data.cb4=true">
+ Checkbox: Disabled, Checked
+ </md-checkbox>
+ </div>
+ <div>
+ <md-checkbox md-no-ink aria-label="Checkbox No Ink" ng-model="data.cb5" class="md-primary">
+ Checkbox (md-primary): No Ink
+ </md-checkbox>
+ </div>
 </div>

src/components/checkbox/demoBasicUsage/style.css

@@ -1,4 +1,6 @@
-
-body {
- padding: 20px;
+.checkboxDemo1 div {
+ clear: both;
+}
+.checkboxDemo1 md-checkbox {
+ float: left;
 }