update icons

src/components/demos/read/Demo.js

@@ -10,7 +10,7 @@ import { Col, Row, DemoText, Container } from '../../shared/Common'
 import Input from '../../shared/Input'
 import ProgressBar from './ProgressBar'
 import Modal from './Modal'
-import KeychainIcon from '../../../assets/images/keychain-strip.png'
+import KeyIcon from '../../../assets/images/key.svg'
 import { Themes } from '../../../fixtures/themes'
 
 const Wrapper = styled.div`
@@ -23,6 +23,10 @@ const Wrapper = styled.div`
 `
 const Button = styled.button((props) => props)
 
+const Key = styled.img`
+  margin: 0px 25px 25px 0px;
+`
+
 export default function ReadDemo(props) {
   const state = React.useContext(Context)
 
@@ -125,7 +129,7 @@ export default function ReadDemo(props) {
                 justifyContent={isMorello ? 'center' : 'flex-start'}
                 marginTop={isMorello ? '120px' : '0px'}
               >
-                {isMorello && <img src={KeychainIcon} />}
+                {isMorello && <Key width={'50px'} src={KeyIcon} />}
                 <DemoText {...theme.font}>
                   This application will store your secret securely.
                   <br />
@@ -163,7 +167,7 @@ export default function ReadDemo(props) {
           {readDemo.isSecretSet && isMorello && (
             <Col size={10}>
               <Row justifyContent={'center'} marginTop={'120px'}>
-                <img src={KeychainIcon} />
+                <Key width={'50px'} src={KeyIcon} />
                 <DemoText {...theme.font}>
                   This application will store your secret securely.
                   <br />

src/fixtures/demos.js

@@ -65,6 +65,7 @@ export const demos = [
     title: 'Is your password what you think it is?',
     description: 'Out of Bounds write. CWE Score 65.93',
     color: '#6C3838',
+    icon: bugIcon,
     secretDesktop: [
       {
         name: 'Documents',

src/fixtures/themes.js

@@ -1,9 +1,9 @@
 import backgroundImgOsx from '../assets/images/osx-background.png'
-import iconOsx from '../assets/images/hacker-app-icon-morello.png'
-import lockIconOsx from '../assets/images/lock.png'
+import hackerIconOsx from '../assets/images/unlock.svg'
+import lockIconOsx from '../assets/images/cloud-upload-alt.svg'
 
 import backgroundImg from '../assets/images/background.png'
-import iconImg from '../assets/images/hacker-app-icon.png'
+import hackerIconImg from '../assets/images/hacker-app-icon.png'
 import lockIconImg from '../assets/images/lock.png'
 
 // LP TODO - a lot of properties are shared between morello and aarch64, abstract
@@ -128,7 +128,7 @@ export const Themes = (arch) => {
       backgroundSize: 'cover',
     },
     icons: {
-      hackerIcon: isCheri ? iconOsx : iconImg,
+      hackerIcon: isCheri ? hackerIconOsx : hackerIconImg,
     },
     modal: {
       button: isCheri