Add inputAdorment to the live tile for repeat

cboard-org · Nov 23, 2023 · 7a5ce9b · 7a5ce9b
1 parent 7efb21f
commit 7a5ce9b
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 1 deletion.
diff --git a/src/components/Board/Symbol/Symbol.css b/src/components/Board/Symbol/Symbol.css
@@ -11,6 +11,16 @@
   left: 0;
 }
 
+.liveInput .MuiInputBase-input::-webkit-scrollbar {
+  display: none;
+}
+
+.MuiInputAdornment-positionEnd .Symbol__repeat-button {
+  margin: 0px 3px 0px -5px;
+  padding: 1em 0em;
+  border-radius: 0%;
+}
+
 .Tile .Symbol {
   padding-top: var(--folder-flap-height);
   padding-bottom: 0.2em;

diff --git a/src/components/Board/Symbol/Symbol.js b/src/components/Board/Symbol/Symbol.js
@@ -3,6 +3,10 @@ import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { isCordova } from '../../../cordova-util';
 import OutlinedInput from '@material-ui/core/OutlinedInput';
+import InputAdornment from '@material-ui/core/InputAdornment';
+import IconButton from '@material-ui/core/IconButton';
+import RepeatIcon from '@material-ui/icons/Repeat';
+
 import messages from '../Board.messages';
 
 import { LABEL_POSITION_BELOW } from '../../Settings/Display/Display.constants';
@@ -95,10 +99,22 @@ function Symbol(props) {
           fullWidth={true}
           onKeyPress={handleKeyPress}
           style={{
-            padding: '0.5em 0.8em 0.5em 0.8em',
+            padding: '0.5em 0em 0.5em 0.8em',
             height: '100%'
           }}
           className={'liveInput'}
+          endAdornment={
+            <InputAdornment position="end">
+              <IconButton
+                aria-label="repeat sentence"
+                onClick={onRepeatSentence()}
+                edge="end"
+                className="Symbol__repeat-button"
+              >
+                <RepeatIcon />
+              </IconButton>
+            </InputAdornment>
+          }
         />
       )}
       {props.type !== 'live' &&