1
0
mirror of https://github.com/chinchang/web-maker.git synced 2025-02-22 22:24:00 +01:00

hide useless things in file mode

This commit is contained in:
Kushagra Gour 2018-10-07 18:03:46 +05:30
parent d7c7cca083
commit 2d09be9411
4 changed files with 28 additions and 21 deletions

View File

@ -196,7 +196,7 @@ export default class Footer extends Component {
<button
onClick={this.props.saveHtmlBtnClickHandler}
id="saveHtmlBtn"
class="mode-btn hint--rounded hint--top-left hide-on-mobile"
class="mode-btn hint--rounded hint--top-left hide-on-mobile hide-in-file-mode"
aria-label="Save as HTML file"
>
<svg viewBox="0 0 24 24">
@ -219,7 +219,7 @@ export default class Footer extends Component {
<button
onClick={this.props.codepenBtnClickHandler}
id="codepenBtn"
class="mode-btn hint--rounded hint--top-left hide-on-mobile"
class="mode-btn hint--rounded hint--top-left hide-on-mobile hide-in-file-mode"
aria-label="Edit on CodePen"
>
<svg>
@ -243,7 +243,7 @@ export default class Footer extends Component {
<button
onClick={this.layoutBtnClickhandler.bind(this, 1)}
id="layoutBtn1"
class="mode-btn hide-on-mobile"
class="mode-btn hide-on-mobile hide-in-file-mode"
aria-label="Switch to layout with preview on right"
>
<svg viewBox="0 0 100 100" style="transform:rotate(-90deg)">
@ -253,7 +253,7 @@ export default class Footer extends Component {
<button
onClick={this.layoutBtnClickhandler.bind(this, 2)}
id="layoutBtn2"
class="mode-btn hide-on-mobile"
class="mode-btn hide-on-mobile hide-in-file-mode"
aria-label="Switch to layout with preview on bottom"
>
<svg viewBox="0 0 100 100">
@ -263,7 +263,7 @@ export default class Footer extends Component {
<button
onClick={this.layoutBtnClickhandler.bind(this, 3)}
id="layoutBtn3"
class="mode-btn hide-on-mobile"
class="mode-btn hide-on-mobile hide-in-file-mode"
aria-label="Switch to layout with preview on left"
>
<svg viewBox="0 0 100 100" style="transform:rotate(90deg)">
@ -273,7 +273,7 @@ export default class Footer extends Component {
<button
onClick={this.layoutBtnClickhandler.bind(this, 5)}
id="layoutBtn5"
class="mode-btn hide-on-mobile"
class="mode-btn hide-on-mobile hide-in-file-mode"
aria-label="Switch to layout with all vertical panes"
>
<svg viewBox="0 0 100 100">

View File

@ -27,22 +27,24 @@ export function MainHeader(props) {
</svg>Run
</button>
<Button
onClick={props.addLibraryBtnHandler}
data-event-category="ui"
data-event-action="addLibraryButtonClick"
class="btn--dark flex-v-center hint--rounded hint--bottom-left"
aria-label="Add a JS/CSS library"
>
Add library{' '}
<span
id="js-external-lib-count"
style={`display:${props.externalLibCount ? 'inline' : 'none'}`}
class="count-label"
{!this.props.isFileMode && (
<Button
onClick={props.addLibraryBtnHandler}
data-event-category="ui"
data-event-action="addLibraryButtonClick"
class="btn--dark flex-v-center hint--rounded hint--bottom-left"
aria-label="Add a JS/CSS library"
>
{props.externalLibCount}
</span>
</Button>
Add library{' '}
<span
id="js-external-lib-count"
style={`display:${props.externalLibCount ? 'inline' : 'none'}`}
class="count-label"
>
{props.externalLibCount}
</span>
</Button>
)}
<button
class="btn--dark flex flex-v-center hint--rounded hint--bottom-left"

View File

@ -1222,6 +1222,7 @@ export default class App extends Component {
titleInputBlurHandler={this.titleInputBlurHandler.bind(this)}
user={this.state.user}
unsavedEditCount={this.state.unsavedEditCount}
isFileMode={this.state.currentItem && this.state.currentItem.files}
/>
{this.state.currentItem && this.state.currentItem.files ? (
<ContentWrapFiles

View File

@ -1642,6 +1642,10 @@ body:not(.is-app) .show-when-app {
.sidebar__file:focus .sidebar__file-options {
visibility: visible;
}
.is-project .hide-in-file-mode {
display: none !important;
}
@media screen and (max-width: 600px) {
body {
font-size: 70%;