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.
44 lines
1.2 KiB
44 lines
1.2 KiB
import React from "react"; |
|
|
|
const OutlineSpan = ({ |
|
divWidth, |
|
onClick, |
|
onFocus, |
|
onBlur, |
|
textClr, |
|
borderClr, |
|
outlineTitle, |
|
outlineTitleClr, |
|
defaultValue, |
|
}) => { |
|
return ( |
|
<div className={`${divWidth}`}> |
|
<span |
|
className={`absolute right-20 -mt-2 ${outlineTitleClr} bg-white text-xs px-2 font-sansbold z-10`} |
|
> |
|
{outlineTitle} |
|
</span> |
|
<p |
|
className={`relative w-full border-2 rounded-md text-sm leading-6 text-justify p-3 |
|
focus:outline-none focus:border-[#22577E] focus:ring-1 focus:ring-[#22577E] ${borderClr} ${textClr}`} |
|
onClick={onClick} |
|
onFocus={onFocus} |
|
onBlur={onBlur} |
|
> |
|
{defaultValue} |
|
</p> |
|
</div> |
|
); |
|
}; |
|
|
|
export default OutlineSpan; |
|
|
|
OutlineSpan.defaultProps = { |
|
divWidth: "w-full", |
|
textClr: "text-red-600", |
|
borderClr: "yellow", |
|
outlineTitle: "مهدی عندلیب", |
|
outlineTitleClr: "red", |
|
defaultValue: |
|
"جنگ اول خلیج فارس، جنگی به رهبری آمریکا و با همکاری ائتلافی از ۳۵ کشور مختلف بود که علیه عراق بعثی در واکنش به اشغال کویت توسط عراق انجام گرفت", |
|
};
|
|
|