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

fix logo styling, add link to keybaord shortcuts

Browse source
This commit is contained in:
Cassie Tarakajian 2017-08-30 17:22:36 -04:00
parent 087f319a8a
commit 5cadf8986c
3 changed files with 16 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
client/components/Nav.jsx
View file

@ -81,7 +81,7 @@ class Nav extends React.PureComponent {
return ( return (
<nav className="nav" role="navigation" title="main-navigation"> <nav className="nav" role="navigation" title="main-navigation">
<ul className="nav__items-left" title="project-menu"> <ul className="nav__items-left" title="project-menu">
<li> <li className="nav__item-logo">
<InlineSVG src={logoUrl} alt="p5.js logo" /> <InlineSVG src={logoUrl} alt="p5.js logo" />
</li> </li>
<li className={navDropdownState.file}> <li className={navDropdownState.file}>
@ -239,7 +239,9 @@ class Nav extends React.PureComponent {
<InlineSVG src={triangleUrl} /> <InlineSVG src={triangleUrl} />
</li> </li>
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button onClick={this.props.showKeyboardShortcutModal}>
Keyboard Shortcuts Keyboard Shortcuts
</button>
</li> </li>
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<a <a
@ -366,7 +368,8 @@ Nav.propTypes = {
showShareModal: PropTypes.func.isRequired, showShareModal: PropTypes.func.isRequired,
showErrorModal: PropTypes.func.isRequired, showErrorModal: PropTypes.func.isRequired,
unsavedChanges: PropTypes.bool.isRequired, unsavedChanges: PropTypes.bool.isRequired,
warnIfUnsavedChanges: PropTypes.func.isRequired warnIfUnsavedChanges: PropTypes.func.isRequired,
showKeyboardShortcutModal: PropTypes.func.isRequired
}; };
Nav.defaultProps = { Nav.defaultProps = {

1
client/modules/IDE/pages/IDEView.jsx
View file

@ -218,6 +218,7 @@ class IDEView extends React.Component {
showErrorModal={this.props.showErrorModal} showErrorModal={this.props.showErrorModal}
unsavedChanges={this.props.ide.unsavedChanges} unsavedChanges={this.props.ide.unsavedChanges}
warnIfUnsavedChanges={this.warnIfUnsavedChanges} warnIfUnsavedChanges={this.warnIfUnsavedChanges}
showKeyboardShortcutModal={this.props.showKeyboardShortcutModal}
/> />
<Toolbar <Toolbar
className="Toolbar" className="Toolbar"

9
client/styles/components/_nav.scss
View file

@ -170,3 +170,12 @@
z-index: 0; z-index: 0;
} }
.nav__item-logo {
position: relative;
height: #{42 / $base-font-size}rem;
width: #{56 / $base-font-size}rem;
& span {
position: absolute;
}
}