You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

47 lines
1.2 KiB

import React from "react";
import { Link } from "react-router-dom";
import { connect } from "react-redux";
function Info({ info, isDark }) {
return (
<div
className="flex flex-row py-4 px-3 rounded-md mt-4"
style={{
backgroundColor: info.bg,
border: `1px solid ${info.borderColor}`,
}}
>
<img src={info.icon} alt="" />
<div className="flex flex-col flex-1 mr-3">
<strong className="text-base" style={{ color: info.title.color }}>
{info.title.text}
</strong>
<p
className="text-xs lg:text-sm mt-1 lg:mt-2 lg:leading-5"
style={{
color: isDark ? info.title.color : info.description.color,
}}
>
{info.description.text}
</p>
{info.link && (
<Link
className="self-end text-xs lg:text-sm font-bold mt-2"
to={info.link.link}
style={{
color: isDark ? info.title.color : info?.link?.color,
}}
>
{info?.link?.title}
</Link>
)}
</div>
</div>
);
}
const mapStateToProps = (state) => ({
isDark: state.publicApi.isDark,
});
export default connect(mapStateToProps)(Info);