r
/
p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull Requests Releases 1 Wiki Activity

sidebar styling fixes

This commit is contained in:
catarak 2016-09-03 20:29:18 -04:00
parent fedef1628d
commit 01ad5611c6
2 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
client/modules/IDE/pages/IDEView.js
View File

@ -45,7 +45,7 @@ class IDEView extends React.Component {
} }
this.consoleSize = this.props.ide.consoleIsExpanded ? 180 : 29; this.consoleSize = this.props.ide.consoleIsExpanded ? 180 : 29;
this.sidebarSize = this.props.ide.sidebarIsExpanded ? 180 : 20; this.sidebarSize = this.props.ide.sidebarIsExpanded ? 200 : 20;
this.forceUpdate(); this.forceUpdate();
} }
@ -55,7 +55,7 @@ class IDEView extends React.Component {
} }
if (this.props.ide.sidebarIsExpanded !== nextProps.ide.sidebarIsExpanded) { if (this.props.ide.sidebarIsExpanded !== nextProps.ide.sidebarIsExpanded) {
this.sidebarSize = nextProps.ide.sidebarIsExpanded ? 180 : 20; this.sidebarSize = nextProps.ide.sidebarIsExpanded ? 200 : 20;
} }
if (nextProps.params.project_id && !this.props.params.project_id) { if (nextProps.params.project_id && !this.props.params.project_id) {

8
client/styles/components/_sidebar.scss
View File

@ -79,7 +79,9 @@
.sidebar__file-item--selected > & { .sidebar__file-item--selected > & {
background-color: $ide-border-color; background-color: $ide-border-color;
} }
.sidebar--contracted & {
display: none;
}
} }
.sidebar__file-item-name { .sidebar__file-item-name {
@ -92,7 +94,7 @@
@extend %icon; @extend %icon;
display: none; display: none;
position: absolute; position: absolute;
right: #{20 / $base-font-size}rem; right: #{26 / $base-font-size}rem;
.sidebar__file-item--selected > .file-item__content & { .sidebar__file-item--selected > .file-item__content & {
display: inline-block; display: inline-block;
} }
@ -127,7 +129,7 @@
.sidebar__contract { .sidebar__contract {
@extend %icon; @extend %icon;
margin-left: #{4 / $base-font-size}rem; margin-left: #{10 / $base-font-size}rem;
height: #{14 / $base-font-size}rem; height: #{14 / $base-font-size}rem;
& svg { & svg {
height: #{14 / $base-font-size}rem; height: #{14 / $base-font-size}rem;