From 0fc989ccb8d27bc331765d4418aa7bf3b7de7dd0 Mon Sep 17 00:00:00 2001
From: Xingan Zhao <2081098605@qq.com>
Date: Fri, 27 Sep 2024 22:40:23 +0800
Subject: [PATCH] fix

---
 src/containers/App/App.css | 21 +++++++++++++++++++--
 src/contents/safety.tsx    | 10 +++++++++-
 2 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/src/containers/App/App.css b/src/containers/App/App.css
index d26b388..95ab15d 100644
--- a/src/containers/App/App.css
+++ b/src/containers/App/App.css
@@ -354,7 +354,6 @@ footer a:hover {
   height: auto; /* 保持图片纵横比 */
   display: block; /* 去掉图片下方的空隙 */
   margin: 2px;
-  max-height: 100vh;
 }
 
 .full-height-element {
@@ -455,7 +454,8 @@ footer a:hover {
   /* max-width: 0.9vw; */
   background-color: #ffa6009f;
   /* box-shadow: 15px 15px 5px rgba(0,0,0,0.1); */
-
+  /* display: flex;
+  flex-direction: column;  */
 }
 
 .rounded-border:hover {
@@ -847,4 +847,21 @@ span.formula_line::-webkit-scrollbar-track {
   font-style: italic; 
   align-items: center;
   justify-content: center;
+}
+
+.image-wide {
+  width: 70%;
+  height: auto;
+}
+
+.image-height {
+  width: auto;
+  height: 70vh;
+}
+
+.image-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
 }
\ No newline at end of file
diff --git a/src/contents/safety.tsx b/src/contents/safety.tsx
index 752e4b3..1db666d 100644
--- a/src/contents/safety.tsx
+++ b/src/contents/safety.tsx
@@ -90,11 +90,15 @@ The next page details the security measures and considerations our team has take
                 <h3>2.2Parts Safety</h3>
                 <h3>2.3Suicidal System</h3>
                 <h3>2.4Safety Module</h3>
+                <div className='image-container'>
                 <img 
                 src="https://static.igem.wiki/teams/5378/safety/03-1.webp"
                 alt="example"
-                className="responsive-img"
+                className="image-wide"
               />
+              <figcaption className='caption'>Describe.......</figcaption>
+                </div>
+                
               </Element>
           
 
@@ -105,6 +109,7 @@ The next page details the security measures and considerations our team has take
               <h3>3.1  Laboratory</h3>
               {/* <h4 className="center-text">3.1Laboratory</h4> */}
               <p className="indent">Our experiment was conducted by the iGEM laboratory of Southern Medical University. It is a laboratory with a biosafety protection level of Level 2 (BSL-II), which complies with the provisions of the Biosafety Law of the People's Republic of China and the General Biosafety Guidelines for Pathogenic Microbial Laboratories.</p>
+              <div className='image-container'>
               <img 
                 src="https://static.igem.wiki/teams/5378/safety/03-1.webp"
                 alt="example"
@@ -127,6 +132,9 @@ The next page details the security measures and considerations our team has take
               />
               </div>
               </div>
+                <figcaption className='caption'>Example</figcaption>
+              </div>
+              
               
               
               <h4>Experimental equipment</h4>
-- 
GitLab