added a save button and event

src/LexComponents.tsx

@@ -5,6 +5,7 @@ import {
   Input,
   Dropdown,
   Card,
+  Button
 } from 'semantic-ui-react';
 import * as XML from 'xml2js';
 import { LexSingleInput } from './LexInputComponents';
@@ -220,7 +221,7 @@ class LexEdit extends React.Component<any, any> {
         let imageSrc = imageRoot + defaultText;
         return (
           <LexSingleInput key={field} labelText={_.capitalize(field)}>
-            <Image src={imageSrc} size="tiny" bordered={true}/>
+            <Image src={imageSrc} size="tiny" bordered={true} />
           </LexSingleInput>
         );
       } else {
@@ -237,9 +238,20 @@ class LexEdit extends React.Component<any, any> {
             <Card.Meta>
               language: {_.get<any>(li, '$.id', '')}
             </Card.Meta>
+            <Card.Description>
+              {lexFields}
+            </Card.Description>
+          </Card.Content>
+          <Card.Content extra={true}>
+            <Button
+              basic={true}
+              fluid={true}
+              color="green"
+              onClick={(e, d) => this.handleOnSave(d)}
+            >
+              Save
+            </Button>
           </Card.Content>
-
-          {lexFields}
         </Card>
       </Box>
     );
@@ -248,4 +260,8 @@ class LexEdit extends React.Component<any, any> {
   private handleOnChange(event: any) {
     this.setState(event);
   }
+
+  private handleOnSave(event: any) {
+    console.log('saving object', this.props.lexItem);
+  }
 }

src/index.css

@@ -1,2 +1 @@
-@import "~normalize.css/normalize.css";
 @import "~semantic-ui-css/semantic.min.css";