diff --git a/src/pivotal-ui/components/panels.scss b/src/pivotal-ui/components/panels.scss
index 13140a36b..493eabe6a 100644
--- a/src/pivotal-ui/components/panels.scss
+++ b/src/pivotal-ui/components/panels.scss
@@ -730,6 +730,8 @@ parent: panel_react
---
```html_example_table
+
+
@@ -741,22 +743,27 @@ parent: panel_react
```jsx_example
React.render(
- Shadow Panel,
+ Shadow Panel (Defaults to shadow level 3),
+ document.getElementById('panel-shadow-example-default')
+);
+
+React.render(
+ Shadow Panel (level 1),
document.getElementById('panel-shadow-example-1')
);
React.render(
- Shadow Panel,
+ Shadow Panel (level 2),
document.getElementById('panel-shadow-example-2')
);
React.render(
- Shadow Panel,
+ Shadow Panel (level 3),
document.getElementById('panel-shadow-example-3')
);
React.render(
- Shadow Panel,
+ Shadow Panel (level 4),
document.getElementById('panel-shadow-example-4')
);
```
diff --git a/src/pivotal-ui/javascripts/panels.jsx b/src/pivotal-ui/javascripts/panels.jsx
index cae3bb06b..a66b27d23 100644
--- a/src/pivotal-ui/javascripts/panels.jsx
+++ b/src/pivotal-ui/javascripts/panels.jsx
@@ -71,7 +71,7 @@ var ShadowPanel = React.createClass({
if (_.contains(this.acceptedShadowLevels, '' + this.props.shadowLevel)) {
type = "panel-shadow-" + this.props.shadowLevel;
} else {
- type = "panel-shadow-1";
+ type = "panel-shadow-3";
}
return (
diff --git a/test/spec/javascripts/panels_spec.js b/test/spec/javascripts/panels_spec.js
index c790ca252..28d8088f4 100644
--- a/test/spec/javascripts/panels_spec.js
+++ b/test/spec/javascripts/panels_spec.js
@@ -128,7 +128,7 @@ describe('ShadowPanel', function () {
it('creates a panel with the default shadow class', function() {
expect($('#container .panel .panel-body')).toContainText('Sup');
- expect($('#container .panel')).toHaveClass('panel-shadow-1');
+ expect($('#container .panel')).toHaveClass('panel-shadow-3');
});
describe('when the shadowLevel property is set to an acceptable value', function() {
@@ -159,7 +159,7 @@ describe('ShadowPanel', function () {
});
it('adds the default shadow level class', function() {
- expect($('#container .panel')).toHaveClass('panel-shadow-1');
+ expect($('#container .panel')).toHaveClass('panel-shadow-3');
});
});
});