mirror of
https://github.com/scratchfoundation/scratch-paint.git
synced 2024-12-22 21:42:30 -05:00
Merge branch 'strokeWidth' into select
This commit is contained in:
DD
commit
ef367646fb
15 changed files with 34 additions and 100 deletions
|
|
@ -20,7 +20,6 @@ const FillColorIndicatorComponent = props => (
|
|||
<div className={styles.inputGroup}>
|
||||
<Label text={props.intl.formatMessage(messages.fill)}>
|
||||
<BufferedInput
|
||||
tabIndex="1"
|
||||
type="text"
|
||||
value={props.fillColor}
|
||||
onSubmit={props.onChangeFillColor}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
/* DO NOT EDIT
|
||||
@todo This file is copied from GUI and should be pulled out into a shared library.
|
||||
See https://github.com/LLK/scratch-paint/issues/13 */
|
||||
|
||||
import bindAll from 'lodash.bindall';
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
/* DO NOT EDIT
|
||||
@todo This file is copied from GUI and should be pulled out into a shared library.
|
||||
See https://github.com/LLK/scratch-paint/issues/13 */
|
||||
|
||||
@import "../../css/units.css";
|
||||
@import "../../css/colors.css";
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
/* DO NOT EDIT
|
||||
@todo This file is copied from GUI and should be pulled out into a shared library.
|
||||
See https://github.com/LLK/scratch-paint/issues/13 */
|
||||
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import classNames from 'classnames';
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
/* DO NOT EDIT
|
||||
@todo This file is copied from GUI and should be pulled out into a shared library.
|
||||
See https://github.com/LLK/scratch-paint/issues/13 */
|
||||
|
||||
@import "../../css/units.css";
|
||||
@import "../../css/colors.css";
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
/* DO NOT EDIT
|
||||
@todo This file is copied from GUI and should be pulled out into a shared library.
|
||||
See https://github.com/LLK/scratch-paint/issues/13 */
|
||||
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
|
||||
|
|
|
|||
|
|
@ -27,20 +27,6 @@
|
|||
margin-left: calc(2 * $space);
|
||||
}
|
||||
|
||||
.waveform-container {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
|
||||
position: relative;
|
||||
|
||||
background: $ui-pane-gray;
|
||||
border: 1px solid $ui-pane-border;
|
||||
border-radius: 5px;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
$border-radius: 0.25rem;
|
||||
|
||||
.button {
|
||||
|
|
@ -62,40 +48,6 @@ $border-radius: 0.25rem;
|
|||
min-width: 1.5rem;
|
||||
}
|
||||
|
||||
.trim-button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 10px; /* To equalize with empty whitespace from image on left */
|
||||
}
|
||||
|
||||
.trim-button > img {
|
||||
width: 1.5rem;
|
||||
}
|
||||
|
||||
.trim-button-active {
|
||||
filter: hue-rotate(155deg); /* @todo replace blue -> red with real submit icon */
|
||||
}
|
||||
|
||||
.input-group-right {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
.effect-button {
|
||||
flex-basis: 150px;
|
||||
color: $text-primary;
|
||||
}
|
||||
|
||||
.effect-button + .effect-button {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.effect-button img {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.button-group {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -45,7 +45,6 @@ class PaintEditorComponent extends React.Component {
|
|||
<div className={styles.inputGroup}>
|
||||
<Label text={this.props.intl.formatMessage(messages.costume)}>
|
||||
<BufferedInput
|
||||
tabIndex="1"
|
||||
type="text"
|
||||
value="meow"
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -20,7 +20,6 @@ const StrokeColorIndicatorComponent = props => (
|
|||
<div className={styles.inputGroup}>
|
||||
<Label text={props.intl.formatMessage(messages.stroke)}>
|
||||
<BufferedInput
|
||||
tabIndex="1"
|
||||
type="text"
|
||||
value={props.strokeColor}
|
||||
onSubmit={props.onChangeStrokeColor}
|
||||
|
|
|
|||
|
|
@ -14,7 +14,6 @@ const StrokeWidthIndicatorComponent = props => (
|
|||
small
|
||||
max={MAX_STROKE_WIDTH}
|
||||
min="0"
|
||||
tabIndex="1"
|
||||
type="number"
|
||||
value={props.strokeWidth}
|
||||
onSubmit={props.onChangeStrokeWidth}
|
||||
|
|
|
|||
|
|
@ -1,26 +1,12 @@
|
|||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import {connect} from 'react-redux';
|
||||
import {changeFillColor} from '../reducers/fill-color';
|
||||
import FillColorIndicatorComponent from '../components/fill-color-indicator.jsx';
|
||||
|
||||
const FillColorIndicator = props => (
|
||||
<FillColorIndicatorComponent
|
||||
fillColor={props.fillColor}
|
||||
onChangeFillColor={props.handleChangeFillColor}
|
||||
/>
|
||||
);
|
||||
|
||||
FillColorIndicator.propTypes = {
|
||||
fillColor: PropTypes.string.isRequired,
|
||||
handleChangeFillColor: PropTypes.func.isRequired
|
||||
};
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
fillColor: state.scratchPaint.color.fillColor
|
||||
});
|
||||
const mapDispatchToProps = dispatch => ({
|
||||
handleChangeFillColor: fillColor => {
|
||||
onChangeFillColor: fillColor => {
|
||||
dispatch(changeFillColor(fillColor));
|
||||
}
|
||||
});
|
||||
|
|
@ -28,4 +14,4 @@ const mapDispatchToProps = dispatch => ({
|
|||
export default connect(
|
||||
mapStateToProps,
|
||||
mapDispatchToProps
|
||||
)(FillColorIndicator);
|
||||
)(FillColorIndicatorComponent);
|
||||
|
|
|
|||
|
|
@ -1,26 +1,12 @@
|
|||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import {connect} from 'react-redux';
|
||||
import {changeStrokeColor} from '../reducers/stroke-color';
|
||||
import StrokeColorIndicatorComponent from '../components/stroke-color-indicator.jsx';
|
||||
|
||||
const StrokeColorIndicator = props => (
|
||||
<StrokeColorIndicatorComponent
|
||||
strokeColor={props.strokeColor}
|
||||
onChangeStrokeColor={props.handleChangeStrokeColor}
|
||||
/>
|
||||
);
|
||||
|
||||
StrokeColorIndicator.propTypes = {
|
||||
handleChangeStrokeColor: PropTypes.func.isRequired,
|
||||
strokeColor: PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
strokeColor: state.scratchPaint.color.strokeColor
|
||||
});
|
||||
const mapDispatchToProps = dispatch => ({
|
||||
handleChangeStrokeColor: strokeColor => {
|
||||
onChangeStrokeColor: strokeColor => {
|
||||
dispatch(changeStrokeColor(strokeColor));
|
||||
}
|
||||
});
|
||||
|
|
@ -28,4 +14,4 @@ const mapDispatchToProps = dispatch => ({
|
|||
export default connect(
|
||||
mapStateToProps,
|
||||
mapDispatchToProps
|
||||
)(StrokeColorIndicator);
|
||||
)(StrokeColorIndicatorComponent);
|
||||
|
|
|
|||
|
|
@ -1,26 +1,12 @@
|
|||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import {connect} from 'react-redux';
|
||||
import {changeStrokeWidth} from '../reducers/stroke-width';
|
||||
import StrokeWidthIndicatorComponent from '../components/stroke-width-indicator.jsx';
|
||||
|
||||
const StrokeWidthIndicator = props => (
|
||||
<StrokeWidthIndicatorComponent
|
||||
strokeWidth={props.strokeWidth}
|
||||
onChangeStrokeWidth={props.handleChangeStrokeWidth}
|
||||
/>
|
||||
);
|
||||
|
||||
StrokeWidthIndicator.propTypes = {
|
||||
handleChangeStrokeWidth: PropTypes.func.isRequired,
|
||||
strokeWidth: PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
strokeWidth: state.scratchPaint.color.strokeWidth
|
||||
});
|
||||
const mapDispatchToProps = dispatch => ({
|
||||
handleChangeStrokeWidth: strokeWidth => {
|
||||
onChangeStrokeWidth: strokeWidth => {
|
||||
dispatch(changeStrokeWidth(strokeWidth));
|
||||
}
|
||||
});
|
||||
|
|
@ -28,4 +14,4 @@ const mapDispatchToProps = dispatch => ({
|
|||
export default connect(
|
||||
mapStateToProps,
|
||||
mapDispatchToProps
|
||||
)(StrokeWidthIndicator);
|
||||
)(StrokeWidthIndicatorComponent);
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
/* DO NOT EDIT
|
||||
@todo This file is copied from GUI and should be pulled out into a shared library.
|
||||
See https://github.com/LLK/scratch-paint/issues/13 */
|
||||
|
||||
$ui-pane-border: #D9D9D9;
|
||||
$ui-pane-gray: #F9F9F9;
|
||||
$ui-background-blue: #e8edf1;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
/* DO NOT EDIT
|
||||
@todo This file is copied from GUI and should be pulled out into a shared library.
|
||||
See https://github.com/LLK/scratch-paint/issues/13 */
|
||||
|
||||
$space: 0.5rem;
|
||||
|
||||
$sprites-per-row: 5;
|
||||
|
|
|
|||
Loading…
Reference in a new issue