Skip to content

Commit

Permalink
contact page improved
Browse files Browse the repository at this point in the history
  • Loading branch information
Nobatgeldi committed Feb 17, 2024
1 parent f2231fd commit f5b9670
Show file tree
Hide file tree
Showing 6 changed files with 165 additions and 13 deletions.
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,9 @@
"private": true,
"homepage": "https://ngs.covisart.com/",
"dependencies": {
"@ant-design/icons": "^5.2.6",
"@ant-design/icons": "^5.3.0",
"@pmndrs/branding": "^0.0.8",
"@react-google-maps/api": "^2.19.3",
"@react-three/drei": "^9.84.3",
"@react-three/fiber": "^8.14.3",
"@react-three/postprocessing": "^2.15.1",
Expand Down
4 changes: 2 additions & 2 deletions src/elements/contact/ContactOne.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,8 +30,8 @@ const ContactOne = () => {
</div>
<div className="inner">
<h4 className="title">Our Email Address</h4>
<p><a href="mailto:[email protected]">admin@covisart.com</a></p>
<p><a href="mailto:[email protected]">contact@covisart.com</a></p>
<p><a href="mailto:[email protected]">info@covisart.com</a></p>
<p><a href="mailto:[email protected]">support@covisart.com</a></p>
</div>
</div>
</div>
Expand Down
27 changes: 21 additions & 6 deletions src/elements/contact/GoogleMapStyle.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,22 @@
import React, { Component } from 'react';
import GoogleMapReact from 'google-map-react';
import { HomeOutlined } from '@ant-design/icons';

const AnyReactComponent = ({ text }) => <div>{text}</div>;
const AnyReactComponent = ({ text }) => (
<div style={{
color: 'white',
background: 'grey',
padding: '10px 10px',
display: 'inline-flex',
textAlign: 'center',
alignItems: 'center',
justifyContent: 'center',
borderRadius: '5%',
transform: 'translate(-50%, -50%)'
}}>
{text}
</div>
);
class GoogleMapStyle extends Component {
static defaultProps = {
center: {
Expand All @@ -16,15 +31,15 @@ class GoogleMapStyle extends Component {
// Important! Always set the container height explicitly
<div className="google-map-style-1">
<GoogleMapReact
// bootstrapURLKeys={{ key: /* YOUR KEY HERE */ }}
bootstrapURLKeys={{ key: 'AIzaSyBPJffuk5iqp_6IjD42JZX1-NGBM3wPSbw' }}
defaultCenter={this.props.center}
defaultZoom={this.props.zoom}
>
defaultZoom={this.props.zoom}>
<AnyReactComponent
lat={39.995639}
lng={32.752335}
text="COVISART"
/>
text="COVISART - Research & Development Company.">
</AnyReactComponent>

</GoogleMapReact>
</div>
);
Expand Down
48 changes: 48 additions & 0 deletions src/elements/contact/GoogleMaps.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
import React from 'react'
import { GoogleMap, useJsApiLoader } from '@react-google-maps/api';

const containerStyle = {
width: '400px',
height: '400px'
};

const center = {
lat: -3.745,
lng: -38.523
};

function Maps() {
const { isLoaded } = useJsApiLoader({
id: 'google-map-script',
googleMapsApiKey: "AIzaSyBPJffuk5iqp_6IjD42JZX1-NGBM3wPSbw"
})

const [map, setMap] = React.useState(null)

const onLoad = React.useCallback(function callback(map) {
// This is just an example of getting and using the map instance!!! don't just blindly copy!
const bounds = new window.google.maps.LatLngBounds(center);
map.fitBounds(bounds);

setMap(map)
}, [])

const onUnmount = React.useCallback(function callback(map) {
setMap(null)
}, [])

return isLoaded ? (
<GoogleMap
mapContainerStyle={containerStyle}
center={center}
zoom={10}
onLoad={onLoad}
onUnmount={onUnmount}
>
{ /* Child components, such as markers, info windows, etc. */ }
<></>
</GoogleMap>
) : <></>
}

export default React.memo(Maps)
2 changes: 1 addition & 1 deletion src/pages/Company.js
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ class Company extends Component {
<li><span className="icon"><FiCheck /></span>Pilot spatial awareness and commercial aviation mishap prevention</li>
</ul>
<div className="button-group mt--40">
<a id="purchase" className="btn-default btn-medium round btn-icon" href="/ngs">Purchase Now <i className="icon"><FiArrowRight /></i></a>
<a id="purchase" className="btn-default btn-medium round btn-icon" href="/ngs">Pre-Order <i className="icon"><FiArrowRight /></i></a>
<Link className="btn-default btn-medium btn-border round btn-icon" to="/contact">Contact Us <i className="icon"><FiArrowRight /></i></Link>
</div>
</div>
Expand Down
94 changes: 91 additions & 3 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,13 @@ __metadata:
languageName: node
linkType: hard

"@ant-design/icons-svg@npm:^4.4.0":
version: 4.4.2
resolution: "@ant-design/icons-svg@npm:4.4.2"
checksum: c66cda4533ec2f86162a9adda04be2aba5674d5c758ba886bd9d8de89dc45473ef3124eb755b4cfbd09121d3bdc34e075ee931e47dd0f8a7fdc01be0cb3d6c40
languageName: node
linkType: hard

"@ant-design/icons@npm:^5.2.6":
version: 5.2.6
resolution: "@ant-design/icons@npm:5.2.6"
Expand All @@ -86,6 +93,22 @@ __metadata:
languageName: node
linkType: hard

"@ant-design/icons@npm:^5.3.0":
version: 5.3.0
resolution: "@ant-design/icons@npm:5.3.0"
dependencies:
"@ant-design/colors": ^7.0.0
"@ant-design/icons-svg": ^4.4.0
"@babel/runtime": ^7.11.2
classnames: ^2.2.6
rc-util: ^5.31.1
peerDependencies:
react: ">=16.0.0"
react-dom: ">=16.0.0"
checksum: 6b58bb057f0c92b5d1fc5bd062119e070ac0ef86979c011dbae657b54e51bdfc4efd1d7f52cd3e0e05a8f82c81847f86bb4bb7f797154b5fcfc750f4758b4a45
languageName: node
linkType: hard

"@ant-design/react-slick@npm:~1.0.2":
version: 1.0.2
resolution: "@ant-design/react-slick@npm:1.0.2"
Expand Down Expand Up @@ -1995,7 +2018,7 @@ __metadata:
languageName: node
linkType: hard

"@googlemaps/js-api-loader@npm:^1.13.8":
"@googlemaps/js-api-loader@npm:1.16.2, @googlemaps/js-api-loader@npm:^1.13.8":
version: 1.16.2
resolution: "@googlemaps/js-api-loader@npm:1.16.2"
dependencies:
Expand All @@ -2004,6 +2027,16 @@ __metadata:
languageName: node
linkType: hard

"@googlemaps/markerclusterer@npm:2.5.3":
version: 2.5.3
resolution: "@googlemaps/markerclusterer@npm:2.5.3"
dependencies:
fast-deep-equal: ^3.1.3
supercluster: ^8.0.1
checksum: aa74e9b59d302a0c7444c48818f017532172973dece223c9a3f9b5cdb8aeba7ea3dd87ee785420972d24e7738937e76373e8aae8a0cf10f045bf9869d1b6b9ee
languageName: node
linkType: hard

"@humanwhocodes/config-array@npm:^0.11.11":
version: 0.11.11
resolution: "@humanwhocodes/config-array@npm:0.11.11"
Expand Down Expand Up @@ -2962,6 +2995,37 @@ __metadata:
languageName: node
linkType: hard

"@react-google-maps/api@npm:^2.19.3":
version: 2.19.3
resolution: "@react-google-maps/api@npm:2.19.3"
dependencies:
"@googlemaps/js-api-loader": 1.16.2
"@googlemaps/markerclusterer": 2.5.3
"@react-google-maps/infobox": 2.19.2
"@react-google-maps/marker-clusterer": 2.19.2
"@types/google.maps": 3.55.2
invariant: 2.2.4
peerDependencies:
react: ^16.8 || ^17 || ^18
react-dom: ^16.8 || ^17 || ^18
checksum: fd12a3ee4ee2c987dff07f791396b57b16c60dcffc53cd151afe2c6a0cb3f1fc1c21d341871b8b0b362cfc6a17541d42ff5e6f5960e6795bc05314bd81b10250
languageName: node
linkType: hard

"@react-google-maps/infobox@npm:2.19.2":
version: 2.19.2
resolution: "@react-google-maps/infobox@npm:2.19.2"
checksum: e2022d857931492d0fd457b72fa729076da1e3e0c5281a402a71127e35d683cb7ca4074e2888682a612ca4b5d2b0d6abc26cce94aa9a315abeaa61b4f6239f24
languageName: node
linkType: hard

"@react-google-maps/marker-clusterer@npm:2.19.2":
version: 2.19.2
resolution: "@react-google-maps/marker-clusterer@npm:2.19.2"
checksum: fde23240ae153ec8aeddd1d702f1e2a8ee51412fe3b5079a88d4e1697f8c580e743afe6bb815214b218cefddb1a2097a9d982440c2207906dd1dd2a88b8068cb
languageName: node
linkType: hard

"@react-spring/animated@npm:~9.6.1":
version: 9.6.1
resolution: "@react-spring/animated@npm:9.6.1"
Expand Down Expand Up @@ -3690,6 +3754,13 @@ __metadata:
languageName: node
linkType: hard

"@types/google.maps@npm:3.55.2":
version: 3.55.2
resolution: "@types/google.maps@npm:3.55.2"
checksum: c0b554fddb0a59ddbe7cfb1ef8bc4aeacd9660b726546ec75fca62619680572338ceb3bcc5c63b035c87e6cc91532fa78f7f0d1aa2b5be4ac7fdebcffb396b39
languageName: node
linkType: hard

"@types/graceful-fs@npm:^4.1.2":
version: 4.1.7
resolution: "@types/graceful-fs@npm:4.1.7"
Expand Down Expand Up @@ -6634,8 +6705,9 @@ __metadata:
version: 0.0.0-use.local
resolution: "doob@workspace:."
dependencies:
"@ant-design/icons": ^5.2.6
"@ant-design/icons": ^5.3.0
"@pmndrs/branding": ^0.0.8
"@react-google-maps/api": ^2.19.3
"@react-three/drei": ^9.84.3
"@react-three/fiber": ^8.14.3
"@react-three/postprocessing": ^2.15.1
Expand Down Expand Up @@ -8686,7 +8758,7 @@ __metadata:
languageName: node
linkType: hard

"invariant@npm:^2.2.4":
"invariant@npm:2.2.4, invariant@npm:^2.2.4":
version: 2.2.4
resolution: "invariant@npm:2.2.4"
dependencies:
Expand Down Expand Up @@ -10009,6 +10081,13 @@ __metadata:
languageName: node
linkType: hard

"kdbush@npm:^4.0.2":
version: 4.0.2
resolution: "kdbush@npm:4.0.2"
checksum: 6782ef2cdaec9322376b9955a16b0163beda0cefa2f87da76e8970ade2572d8b63bec915347aaeac609484b0c6e84d7b591f229ef353b68b460238095bacde2d
languageName: node
linkType: hard

"keyv@npm:^4.5.3":
version: 4.5.4
resolution: "keyv@npm:4.5.4"
Expand Down Expand Up @@ -14679,6 +14758,15 @@ __metadata:
languageName: node
linkType: hard

"supercluster@npm:^8.0.1":
version: 8.0.1
resolution: "supercluster@npm:8.0.1"
dependencies:
kdbush: ^4.0.2
checksum: 39d141f768a511efa53260252f9dab9a2ce0228b334e55482c8d3019e151932f05e1a9a0252d681737651b13c741c665542a6ddb40ec27de96159ea7ad41f7f4
languageName: node
linkType: hard

"supports-color@npm:^5.3.0":
version: 5.5.0
resolution: "supports-color@npm:5.5.0"
Expand Down

0 comments on commit f5b9670

Please sign in to comment.