#8: Add tooltips to settings [partial]

This commit is contained in:
2019-08-30 15:12:28 -05:00
parent adcc060d13
commit 297d7af060
5 changed files with 50 additions and 3 deletions

View File

@@ -33,4 +33,8 @@ input.ConfigurationItemInput {
background: rgba(10, 10, 15, 0.8);
border-color: rgba(10, 10, 20, 0.9);
color: var(--text_color);
}
.ConfigurationInfo {
cursor: pointer;
}

View File

@@ -1,5 +1,8 @@
import React from 'react';
import './ConfigurationItem.css';
import settings from '../../assets/settings';
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
import {faInfoCircle} from '@fortawesome/free-solid-svg-icons';
export default props => {
const handleChanged = (e) => {
@@ -9,6 +12,18 @@ export default props => {
}
props.changed(target);
};
let infoDisplay;
if (settings[props.grouping] && settings[props.grouping][props.label]) {
const displayInfo = () => {
const description = settings[props.grouping][props.label];
alert(description);
};
infoDisplay = <a href={void(0)}
className={'ConfigurationInfo'}
onClick={()=>{displayInfo(); return false;}}><FontAwesomeIcon icon={faInfoCircle}/></a>;
}
let data;
switch (props.template.type) {
@@ -96,7 +111,9 @@ export default props => {
width='100%'>
<tbody>
<tr>
<td width='100%'>{props.label}</td>
{infoDisplay ?
<td width='100%'>{infoDisplay} {props.label}</td> :
<td width='100%'>{props.label}</td>}
<td>{data}</td>
</tr>
</tbody>

View File

@@ -22,8 +22,7 @@ export default connect(mapStateToProps)(props => {
</td>
<td>
{props.AllowDownload ?
<a
href={void(0)}
<a href={void(0)}
className={'DependencyLink'}
onClick={()=>{props.onDownload(); return false;}}><u>Install</u></a> :
'Installing...'}