update RGB-Block

src/components/TooltipViewer.js

@@ -10,9 +10,6 @@ import CardContent from '@material-ui/core/CardContent';
 
 import Typography from '@material-ui/core/Typography';
 import ReactMarkdown from 'react-markdown';
-import Link from '@material-ui/core/Link'
-import CardActions from '@material-ui/core/CardActions';
-import Button from '@material-ui/core/Button';
 
 class TooltipViewer extends Component {
 
@@ -20,13 +17,16 @@ class TooltipViewer extends Component {
   render() {
 
     return (
-      <Card style={{ height: '100%', margin: '1vH 0 0 0', maxHeight: '19vH' }} ref={this.myDiv}>
+      <Card className="tooltipViewer" style={{ height: '100%', margin: '1vH 0 0 0', maxHeight: '19vH', overflow: 'auto' }} ref={this.myDiv}>
         <CardContent>
           <Typography variant="h5" component="h2">
-            Hilfe
-        </Typography>
-          <Typography variant="body1" component="p">
-            <ReactMarkdown>{this.props.tooltip}</ReactMarkdown>
+            {Blockly.Msg.tooltip_viewer}
+          </Typography>
+          <Typography variant="body2" component="p">
+            <ReactMarkdown linkTarget="_blank">{this.props.tooltip}</ReactMarkdown>
+
+            {this.props.helpurl !== '' ? <ReactMarkdown>{`${Blockly.Msg.tooltip_moreInformation} [${Blockly.Msg.labels_here}](${this.props.helpurl})`}</ReactMarkdown> : null}
+
           </Typography>
         </CardContent>
       </Card>
@@ -35,11 +35,13 @@ class TooltipViewer extends Component {
 }
 
 TooltipViewer.propTypes = {
-  tooltip: PropTypes.string.isRequired
+  tooltip: PropTypes.string.isRequired,
+  helpurl: PropTypes.string.isRequired
 };
 
 const mapStateToProps = state => ({
-  tooltip: state.workspace.code.tooltip
+  tooltip: state.workspace.code.tooltip,
+  helpurl: state.workspace.code.helpurl
 });
 
 export default connect(mapStateToProps, null)(withWidth()(TooltipViewer));