diff --git a/package.json b/package.json index 01ed4f7..9411d9e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-component-playground", - "version": "0.2.1", + "version": "0.2.2", "description": "Isolated loader for React components", "main": "build/bundle.js", "repository": { diff --git a/src/components/component-playground.less b/src/components/component-playground.less index c176c70..1c4f408 100644 --- a/src/components/component-playground.less +++ b/src/components/component-playground.less @@ -59,10 +59,6 @@ text-transform: uppercase; text-decoration: none; - &.selected-button { - background: #000; - } - a { color: #aaa; text-decoration: none; @@ -71,6 +67,14 @@ color: #fafafa; } } + + &.selected-button { + background: #333; + + a { + color: #fafafa; + } + } } } } @@ -91,7 +95,6 @@ list-style-type: none; .component { - .component-name { margin: 0; padding: 0; @@ -143,7 +146,6 @@ } &.selected { - a { font-weight: bold; } @@ -152,6 +154,11 @@ } &.expanded { + .component-name { + a { + color: #fafafa; + } + } .component-fixtures { display: block; @@ -174,13 +181,14 @@ bottom: 0; left: 0; right: 50%; - padding: 10px; border: 1px solid rgba(16, 16, 16, 0.1); background: #f8f5ec; .fixture-editor { width: 100%; height: 100%; + padding: 10px; + box-sizing: border-box; border: none; background: transparent; color: #637c84; @@ -202,7 +210,7 @@ bottom: 0; left: 0; right: 0; - overflow: hidden; + overflow: auto; &.aside-fixture-editor { left: 50%; @@ -211,7 +219,6 @@ } &.full-screen { - > .header { display: none; }