2022-09-17 23:20:00 +02:00
|
|
|
import React from 'react';
|
|
|
|
import styled from 'styled-components';
|
|
|
|
|
|
|
|
export function Ad() {
|
|
|
|
const containerRef = React.useRef<HTMLDivElement>(null);
|
|
|
|
const addedScript = React.useRef(false);
|
2023-10-29 00:33:17 +02:00
|
|
|
|
2022-09-17 23:20:00 +02:00
|
|
|
React.useEffect(() => {
|
|
|
|
const container = containerRef.current;
|
2023-10-29 00:33:17 +02:00
|
|
|
|
2022-09-17 23:20:00 +02:00
|
|
|
if (container && !addedScript.current) {
|
|
|
|
addedScript.current = true;
|
|
|
|
const script = document.createElement('script');
|
|
|
|
script.async = true;
|
|
|
|
script.type = 'text/javascript';
|
2023-10-29 00:33:17 +02:00
|
|
|
|
2022-09-17 23:20:00 +02:00
|
|
|
script.src =
|
|
|
|
'//cdn.carbonads.com/carbon.js?serve=CESDK5QJ&placement=iconoircom';
|
2023-10-29 00:33:17 +02:00
|
|
|
|
2022-09-17 23:20:00 +02:00
|
|
|
script.id = '_carbonads_js';
|
|
|
|
container.appendChild(script);
|
|
|
|
}
|
|
|
|
}, []);
|
2023-10-29 00:33:17 +02:00
|
|
|
|
2022-09-17 23:20:00 +02:00
|
|
|
return <AdContainer ref={containerRef} />;
|
|
|
|
}
|
|
|
|
|
|
|
|
const AdContainer = styled.div`
|
2023-09-25 00:31:45 +02:00
|
|
|
#carbonads {
|
|
|
|
margin: 24px 0 0 0;
|
|
|
|
a {
|
2023-09-25 04:43:10 +02:00
|
|
|
text-decoration: none;
|
2022-09-17 23:20:00 +02:00
|
|
|
}
|
2023-09-25 00:31:45 +02:00
|
|
|
.carbon-wrap {
|
|
|
|
display: flex;
|
|
|
|
align-items: flex-start;
|
|
|
|
> :first-child {
|
|
|
|
margin-right: 12px;
|
|
|
|
}
|
|
|
|
& > a > img {
|
|
|
|
width: 100px;
|
|
|
|
height: 74px;
|
|
|
|
filter: grayscale(100%);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.carbon-text {
|
|
|
|
color: var(--black-80);
|
|
|
|
font-size: 14px;
|
|
|
|
}
|
|
|
|
.carbon-poweredby {
|
|
|
|
text-align: center;
|
|
|
|
font-size: 12px;
|
|
|
|
color: var(--black-40);
|
2022-09-17 23:20:00 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
`;
|