feat(component): Made SelectBox.Item selectable

fabric8-launcher · Jul 13, 2018 · 914a47a · 914a47a
1 parent dbd2897
commit 914a47a
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/src/components/SelectBox.css b/src/components/SelectBox.css
@@ -1,5 +1,4 @@
 
-
 .template-item.dummy {
   font-family: 'Redacted Script' !important;
 }
@@ -8,6 +7,10 @@
   font-family: 'Redacted Script Bold' !important;
 }
 
+.template-item.selected {
+  background-color: gainsboro !important;
+}
+
 .template-item .picture {
   display: inline-block;
   width: 90px;

diff --git a/src/components/SelectBox.js b/src/components/SelectBox.js
@@ -1,12 +1,13 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import './SelectBox.css';
+import classNames from 'classnames';
 
 import { Card, Label } from 'semantic-ui-react'
 import Picture from './Picture';
 
 const Item = (props) => (
-  <Card as="a" className={`template-item ${props.dummy && 'dummy'}`} onClick={props.onClick} raised>
+  <Card as="a" className={classNames('template-item', {'dummy': props.dummy, 'selected': props.selected})} onClick={props.onClick} raised>
     <div className="main-content">
       <Picture value={props.picture} />
       <Card.Content>