#8: Add tooltips to settings [partial]
This commit is contained in:
@@ -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;
|
||||
}
|
||||
@@ -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>
|
||||
|
||||
@@ -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...'}
|
||||
|
||||
Reference in New Issue
Block a user