From f49ef5783e47e246d80a4dbba658c170b1a0e6ac Mon Sep 17 00:00:00 2001
From: evgenykatyshev <me@ekatyshev.ru>
Date: Thu, 19 Nov 2020 23:53:49 +0300
Subject: [PATCH] Marking destroyed monuments

---
 src/components/Sidebar/Sidebar.module.scss | 15 +++++++++++
 src/components/Sidebar/index.tsx           | 30 +++++++++++++++++-----
 2 files changed, 38 insertions(+), 7 deletions(-)

diff --git a/src/components/Sidebar/Sidebar.module.scss b/src/components/Sidebar/Sidebar.module.scss
index 2d4deade..734c8c1b 100644
--- a/src/components/Sidebar/Sidebar.module.scss
+++ b/src/components/Sidebar/Sidebar.module.scss
@@ -45,6 +45,21 @@
   line-height: 20px;
 }
 
+.destroyed {
+  color: red;
+  font-weight: bold;
+  margin-bottom: 16px;
+  
+  svg {
+    margin: 0 0 -3px 0;
+  }
+  
+  span {
+    margin-left: 2px;
+  }
+  
+}
+
 .mainInfo {
   display: block;
   margin-block-start: 0;
diff --git a/src/components/Sidebar/index.tsx b/src/components/Sidebar/index.tsx
index 4e333690..fd8c1b8f 100644
--- a/src/components/Sidebar/index.tsx
+++ b/src/components/Sidebar/index.tsx
@@ -24,12 +24,14 @@ interface SidebarPropsInterface {
 }
 
 interface InfoInterface {
+  knid: string;
+  type: Type;
+  status?: string;
+  precise?: string;
   year: string;
   description: string;
   author: string;
   protection?: 'Ф' | 'Р' | 'М' | 'В';
-  type: Type;
-  knid: string;
   knid_new?: string;
   style?: string;
   wiki?: string;
@@ -108,10 +110,6 @@ const Sidebar = () => {
         <p className={styles.mainInfo}>{info.year}</p>
       )}
 
-      {info?.description && (
-        <p className={styles.mainInfo}>{info?.description}</p>
-      )}
-
       {info?.style && (
         <p className={styles.mainInfo}>Стиль: {info?.style}</p>
       )}
@@ -120,6 +118,25 @@ const Sidebar = () => {
         <p className={styles.mainInfo}>{info?.author}</p>
       )}
 
+      {(info?.description || info?.status === 'destroyed') && (
+        <p className={styles.mainInfo}>
+        {info?.status === 'destroyed' && (
+          <span className={styles.destroyed}>
+            <svg width="18" height="18" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M14.5803 8.99878C13.3041 5.61617 8.76023 5.43377 9.85759 0.517379C9.93888 0.152588 9.55683 -0.129296 9.24795 0.06139C6.29726 1.8356 4.1757 5.39232 5.95586 10.0517C6.10218 10.4331 5.66323 10.7896 5.34622 10.5408C3.87494 9.40502 3.7205 7.77175 3.85055 6.60276C3.89932 6.17164 3.34658 5.96438 3.11085 6.32088C2.5581 7.18311 1.99723 8.57595 1.99723 10.6735C2.30612 15.3163 6.15095 16.7423 7.53281 16.9247C9.50806 17.1817 11.6459 16.8086 13.1822 15.3743C14.8729 13.7742 15.4907 11.2207 14.5803 8.99878ZM7.03697 13.169C8.20749 12.8788 8.809 12.0166 8.97157 11.2538C9.23982 10.0683 8.19123 8.90758 8.89842 7.03388C9.16666 8.58424 11.5565 9.55425 11.5565 11.2456C11.6215 13.3431 9.39426 15.1422 7.03697 13.169Z" fill="red"/>
+            </svg>
+            
+            <span>Утрачен{info?.description ? '. ' : ''}</span>
+          </span>
+        )}
+
+        {info?.description && (
+          <span>{info?.description}</span>
+        )}
+        </p>
+      
+      )}
+
       {status && (
         <div className={styles.info}>
           <svg width="18" height="18" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -140,7 +157,6 @@ const Sidebar = () => {
             <path fillRule="evenodd" clipRule="evenodd" d="M3 6.95C3 3.6605 5.68286 1 9 1C12.3171 1 15 3.6605 15 6.95C15 11.4125 9 18 9 18C9 18 3 11.4125 3 6.95ZM9 9C10.1046 9 11 8.10457 11 7C11 5.89543 10.1046 5 9 5C7.89543 5 7 5.89543 7 7C7 8.10457 7.89543 9 9 9Z" fill="black"/>
           </svg>
 
-
           <div className={styles.text}>{address}</div>
         </div>
       )}