diff --git a/src/Components/mobileMockup/mobileMockup.css b/src/Components/mobileMockup/mobileMockup.css index 2547a4e..2dce8f8 100644 --- a/src/Components/mobileMockup/mobileMockup.css +++ b/src/Components/mobileMockup/mobileMockup.css @@ -47,4 +47,30 @@ vertical-align: middle; align-items : center; transform: rotate(90deg); +} +.mobileMockup .secondSection{ + display: flex; + justify-content: space-between; + border:2px solid rgba(0,0,0,0.1); + border-radius: 12px; + width:90%; + margin: 20px 0px; + align-items: center; + vertical-align: middle; +} +.mobileMockup .secondSection div{ + width:20%; + display: flex; + align-items: center; + justify-content: center; + height: 40px; + margin:0px 2.5%; + border-bottom: 3px solid #1577F8; + + +} +.mobileMockup .secondSection div img{ + height: 25px; + width:25px; + cursor: pointer; } \ No newline at end of file diff --git a/src/Components/mobileMockup/mobileMockup.js b/src/Components/mobileMockup/mobileMockup.js index fcb7917..47db574 100644 --- a/src/Components/mobileMockup/mobileMockup.js +++ b/src/Components/mobileMockup/mobileMockup.js @@ -1,6 +1,11 @@ import React from 'react'; import './mobileMockup.css'; +import whatsAppLogo from '../../assets/images/XMLID_468_.png'; +import bookIcon from '../../assets/images/vuesax-bold-book.png'; +import chatIcon from '../../assets/images/vuesax-bold-message-text.png'; +import smsIcon from '../../assets/images/vuesax-bold-sms.png'; + const MobileMockup = () => { return (