scratchfoundation/scratch-paint
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-paint.git synced 2024-12-22 21:42:30 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Re-enable convert to bitmap button

Browse source
This commit is contained in:
DD 2018-04-05 17:51:10 -04:00
parent 82d2e30cae
commit e6b151c41f
3 changed files with 21 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/paint-editor/icons/bitmap.svg
View file

@ -5,7 +5,7 @@
<desc>Created with Sketch.</desc> <desc>Created with Sketch.</desc>
<defs></defs> <defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="bitmap" fill="#575E75"> <g id="bitmap" fill="#FFFFFF">
<path d="M4,3 L16,3 L16,4 L4,4 L4,3 Z M2,5 L3,5 L3,13 L2,13 L2,5 Z M17,5 L18,5 L18,13 L17,13 L17,5 Z M2,13 L18,13 L18,15 L2,15 L2,13 Z M4,12 L16,12 L16,13 L4,13 L4,12 Z M5,11 L8,11 L8,12 L5,12 L5,11 Z M6,10 L7,10 L7,11 L6,11 L6,10 Z M9,11 L16,11 L16,12 L9,12 L9,11 Z M10,10 L15,10 L15,11 L10,11 L10,10 Z M11,9 L14,9 L14,10 L11,10 L11,9 Z M12,8 L13,8 L13,9 L12,9 L12,8 Z M16,12 L17,12 L17,13 L16,13 L16,12 Z M3,15 L17,15 L17,16 L3,16 L3,15 Z M3,4 L4,4 L4,5 L3,5 L3,4 Z M16,4 L17,4 L17,5 L16,5 L16,4 Z M4,16 L16,16 L16,17 L4,17 L4,16 Z" id="Combined-Shape"></path> <path d="M4,3 L16,3 L16,4 L4,4 L4,3 Z M2,5 L3,5 L3,13 L2,13 L2,5 Z M17,5 L18,5 L18,13 L17,13 L17,5 Z M2,13 L18,13 L18,15 L2,15 L2,13 Z M4,12 L16,12 L16,13 L4,13 L4,12 Z M5,11 L8,11 L8,12 L5,12 L5,11 Z M6,10 L7,10 L7,11 L6,11 L6,10 Z M9,11 L16,11 L16,12 L9,12 L9,11 Z M10,10 L15,10 L15,11 L10,11 L10,10 Z M11,9 L14,9 L14,10 L11,10 L11,9 Z M12,8 L13,8 L13,9 L12,9 L12,8 Z M16,12 L17,12 L17,13 L16,13 L16,12 Z M3,15 L17,15 L17,16 L3,16 L3,15 Z M3,4 L4,4 L4,5 L3,5 L3,4 Z M16,4 L17,4 L17,5 L16,5 L16,4 Z M4,16 L16,16 L16,17 L4,17 L4,16 Z" id="Combined-Shape"></path>
</g> </g>
</g> </g>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

10
src/components/paint-editor/paint-editor.css
View file

@ -179,13 +179,19 @@ $border-radius: 0.25rem;
.bitmap-button { .bitmap-button {
display: flex; display: flex;
border-radius: 5px; border-radius: 5px;
background-color: hsla(0, 0%, 0%, .25); background-color: $motion-primary;
padding: calc(2 * $grid-unit); padding: calc(2 * $grid-unit);
line-height: 1.5rem; line-height: 1.5rem;
font-size: calc(3 * $grid-unit); font-size: calc(3 * $grid-unit);
font-weight: bold; font-weight: bold;
color: white;
justify-content: center; justify-content: center;
opacity: .5; opacity: .75;
}
.bitmap-button:active {
background-color: $motion-primary;
opacity: 1;
} }
.bitmap-button-icon { .bitmap-button-icon {

28
src/components/paint-editor/paint-editor.jsx
View file

@ -15,7 +15,6 @@ import Button from '../button/button.jsx';
import ButtonGroup from '../button-group/button-group.jsx'; import ButtonGroup from '../button-group/button-group.jsx';
import BrushMode from '../../containers/brush-mode.jsx'; import BrushMode from '../../containers/brush-mode.jsx';
import BufferedInputHOC from '../forms/buffered-input-hoc.jsx'; import BufferedInputHOC from '../forms/buffered-input-hoc.jsx';
import {ComingSoonTooltip} from '../coming-soon/coming-soon.jsx';
import Dropdown from '../dropdown/dropdown.jsx'; import Dropdown from '../dropdown/dropdown.jsx';
import EraserMode from '../../containers/eraser-mode.jsx'; import EraserMode from '../../containers/eraser-mode.jsx';
import FillColorIndicatorComponent from '../../containers/fill-color-indicator.jsx'; import FillColorIndicatorComponent from '../../containers/fill-color-indicator.jsx';
@ -403,22 +402,19 @@ const PaintEditorComponent = props => {
} }
</div> </div>
<div className={styles.canvasControls}> <div className={styles.canvasControls}>
<ComingSoonTooltip <Button
className={styles.bitmapTooltip} className={styles.bitmapButton}
place="top" onClick={props.onZoomReset}
tooltipId="bitmap-converter"
> >
<div className={styles.bitmapButton}> <img
<img className={styles.bitmapButtonIcon}
className={styles.bitmapButtonIcon} draggable={false}
draggable={false} src={bitmapIcon}
src={bitmapIcon} />
/> <span>
<span> {props.intl.formatMessage(messages.bitmap)}
{props.intl.formatMessage(messages.bitmap)} </span>
</span> </Button>
</div>
</ComingSoonTooltip>
{/* Zoom controls */} {/* Zoom controls */}
<InputGroup className={styles.zoomControls}> <InputGroup className={styles.zoomControls}>
<ButtonGroup> <ButtonGroup>