diff options
| author | Tyler Schicke <tyler_schicke@brown.edu> | 2019-03-16 23:34:44 -0400 |
|---|---|---|
| committer | Tyler Schicke <tyler_schicke@brown.edu> | 2019-03-16 23:34:44 -0400 |
| commit | cfe5c8503e53518e89bd285000c4975a19f2dc13 (patch) | |
| tree | 78f4c3d4d2d7abe07339ff15c0bb6d9556f6a883 /src/client/views/InkingControl.tsx | |
| parent | e9c9d3ea2915ebfd092df77bb49e2fe4f293968b (diff) | |
| parent | 63e591552ad6f92b0d36d9fe51338bbfd007c6dc (diff) | |
Merge branch 'master' of github-tsch-brown:browngraphicslab/Dash-Web into kvp_ui
Diffstat (limited to 'src/client/views/InkingControl.tsx')
| -rw-r--r-- | src/client/views/InkingControl.tsx | 16 |
1 files changed, 8 insertions, 8 deletions
diff --git a/src/client/views/InkingControl.tsx b/src/client/views/InkingControl.tsx index bf633b034..fb75ef2a5 100644 --- a/src/client/views/InkingControl.tsx +++ b/src/client/views/InkingControl.tsx @@ -78,14 +78,14 @@ export class InkingControl extends React.Component { <ul className="inking-control" style={this._open ? { display: "flex" } : { display: "none" }}> <li className="ink-tools ink-panel"> <div className="ink-tool-buttons"> - <button onClick={() => this.switchTool(InkTool.Pen)} style={this.selected(InkTool.Pen)}><FontAwesomeIcon icon="pen" size="2x" /></button> - <button onClick={() => this.switchTool(InkTool.Highlighter)} style={this.selected(InkTool.Highlighter)}><FontAwesomeIcon icon="highlighter" size="2x" /></button> - <button onClick={() => this.switchTool(InkTool.Eraser)} style={this.selected(InkTool.Eraser)}><FontAwesomeIcon icon="eraser" size="2x" /></button> - <button onClick={() => this.switchTool(InkTool.None)} style={this.selected(InkTool.None)}><FontAwesomeIcon icon="ban" size="2x" /></button> + <button onClick={() => this.switchTool(InkTool.Pen)} style={this.selected(InkTool.Pen)}><FontAwesomeIcon icon="pen" size="lg" title="Pen" /></button> + <button onClick={() => this.switchTool(InkTool.Highlighter)} style={this.selected(InkTool.Highlighter)}><FontAwesomeIcon icon="highlighter" size="lg" title="Highlighter" /></button> + <button onClick={() => this.switchTool(InkTool.Eraser)} style={this.selected(InkTool.Eraser)}><FontAwesomeIcon icon="eraser" size="lg" title="Eraser" /></button> + <button onClick={() => this.switchTool(InkTool.None)} style={this.selected(InkTool.None)}><FontAwesomeIcon icon="ban" size="lg" title="Pointer" /></button> </div> </li> <li className="ink-color ink-panel"> - <label>Color: </label> + <label>COLOR: </label> <div className="ink-color-display" style={{ backgroundColor: this._selectedColor }} onClick={() => this.toggleColorPicker()}> {/* {this._colorPickerDisplay ? <span>▼</span> : <span>▲</span>} */} @@ -95,9 +95,9 @@ export class InkingControl extends React.Component { </div> </li> <li className="ink-size ink-panel"> - <label htmlFor="stroke-width">Size: </label> - {/* <input type="text" min="1" max="100" value={this._selectedWidth} name="stroke-width" - onChange={(e: React.ChangeEvent<HTMLInputElement>) => this.switchWidth(e.target.value)} /> */} + <label htmlFor="stroke-width">SIZE: </label> + <input type="text" min="1" max="100" value={this._selectedWidth} name="stroke-width" + onChange={(e: React.ChangeEvent<HTMLInputElement>) => this.switchWidth(e.target.value)} /> <input type="range" min="1" max="100" value={this._selectedWidth} name="stroke-width" onChange={(e: React.ChangeEvent<HTMLInputElement>) => this.switchWidth(e.target.value)} /> </li> |