feat: add NSFW tag in mod details page

src/pages/innerMod.tsx

@@ -111,6 +111,7 @@ export const InnerModPage = () => {
                   body={modData.body}
                   screenshotsUrls={modData.screenshotsUrls}
                   tags={modData.tags}
+                  nsfw={modData.nsfw}
                 />
                 <Interactions />
                 <PublishDetails
@@ -318,6 +319,7 @@ type BodyProps = {
   body: string
   screenshotsUrls: string[]
   tags: string[]
+  nsfw: boolean
 }
 
 const Body = ({
@@ -325,7 +327,8 @@ const Body = ({
   title,
   body,
   screenshotsUrls,
-  tags
+  tags,
+  nsfw
 }: BodyProps) => {
   const postBodyRef = useRef<HTMLDivElement>(null)
   const viewFullPostBtnRef = useRef<HTMLDivElement>(null)
@@ -376,6 +379,12 @@ const Body = ({
           ))}
         </div>
         <div className='IBMSMSMBSSTags'>
+          {nsfw && (
+            <div className='IBMSMSMBSSTagsTag IBMSMSMBSSTagsTagNSFW'>
+              <p>NSFW</p>
+            </div>
+          )}
+
           {tags.map((tag, index) => (
             <a className='IBMSMSMBSSTagsTag' href='#' key={`tag-${index}`}>
               {tag}

src/styles/about.css

@@ -103,3 +103,7 @@
   max-width: 28px;
 }
 
+.IBMSMSMBSSTagsTag.IBMSMSMBSSTagsTagNSFW:hover {
+  border: unset;
+  transform: scale(1);
+}

src/styles/tags.css

@@ -34,3 +34,12 @@
   transform: scale(0.98);
 }
 
+.IBMSMSMBSSTagsTag.IBMSMSMBSSTagsTagNSFW {
+  background: rgba(255, 255, 255, 0.1);
+  color: rgb(225, 68, 68);
+  font-weight: bold;
+  border: unset;
+  font-size: 14px;
+  cursor: default;
+  box-shadow: unset;
+}