From 3bb9140d1f0d939fb640d8c99c4004f0829d223f Mon Sep 17 00:00:00 2001
From: zxa666 <zxadeguge@gmail.com>
Date: Wed, 18 Sep 2024 23:30:50 +0800
Subject: [PATCH] add new feature in notebook.tsx

---
 src/containers/App/App.css |  5 +++++
 src/contents/notebook.tsx  | 35 +++++++++++++++++++++++------------
 2 files changed, 28 insertions(+), 12 deletions(-)

diff --git a/src/containers/App/App.css b/src/containers/App/App.css
index ccd9e09..053f0f7 100644
--- a/src/containers/App/App.css
+++ b/src/containers/App/App.css
@@ -316,6 +316,7 @@ footer a:hover {
   width: 100%; /* 图片宽度自适应容器 */
   height: auto; /* 保持图片纵横比 */
   display: block; /* 去掉图片下方的空隙 */
+  margin: 2px;
 }
 
 .full-height-element {
@@ -616,4 +617,8 @@ footer a:hover {
 
 .mt--8 {
   margin-top: -8vh;
+}
+
+.height100 {
+  height: 100%;
 }
\ No newline at end of file
diff --git a/src/contents/notebook.tsx b/src/contents/notebook.tsx
index 2956bf6..34c1f05 100644
--- a/src/contents/notebook.tsx
+++ b/src/contents/notebook.tsx
@@ -63,27 +63,38 @@ export function Notebook() {
         <div className="col-8">
           
               
-              <Element name="section1" className="element rounded-border" id='section1'>
-                 <h2>Section 1</h2>
+              <Element name="section1" className="element" id='section1'>
+                <div className='row'>
+                  <div className='col-4'><img src='https://placehold.co/600x400' className='responsive-img' /></div>
+                  <div className='col-6 rounded-border'>
+                    <h4 className="center-text">我是大帅B</h4>
+              <p className="indent">las ijffs aiskfd fskj iiwls asd.aass ffas awssd awus iisal fask.aisisad ksjdfkaf iwjasifjakdshf wijdfalksjf wiksjkfjksalhf, gsahfjhgejkfh  uhaejkfh sjdihgfuqiw jh sjiafhjsaj fh asd.</p>
+              <p className="indent">las ijffs aiskfd fskj iiwls asd.aass ffas awssd awus iisal fask.aisisad ksjdfkaf iwjasifjakdshf wijdfalksjf wiksjkfjksalhf, gsahfjhgejkfh  uhaejkfh sjdihgfuqiw jh sjiafhjsaj fh asd.</p>
+                </div>
+                </div>
+                </Element>
+                 {/* <h2>Section 1</h2>
                  <p>Content for section 1.</p>
                  <img 
                 src="https://static.igem.wiki/teams/5378/school-badge/yanyintech.webp"
                 alt="example"
                 className="responsive-img"
-              />
-               </Element>
+              /> */}
+
           
 
           
               
-              <Element name="section2" className="element rounded-border" id='section2'>
-                <h2>Section 2</h2>
-                <p>Content for section 2.</p>
-                <img 
-                src="https://static.igem.wiki/teams/5378/school-badge/yanyintech.webp"
-                alt="example"
-                className="responsive-img"
-              />
+              <Element name="section2" className="element" id='section2'>
+              <div className='row'>
+              <div className='col-6 rounded-border'>
+                    <h4 className="center-text">我是大帅B</h4>
+              <p className="indent">las ijffs aiskfd fskj iiwls asd.aass ffas awssd awus iisal fask.aisisad ksjdfkaf iwjasifjakdshf wijdfalksjf wiksjkfjksalhf, gsahfjhgejkfh  uhaejkfh sjdihgfuqiw jh sjiafhjsaj fh asd.</p>
+              <p className="indent">las ijffs aiskfd fskj iiwls asd.aass ffas awssd awus iisal fask.aisisad ksjdfkaf iwjasifjakdshf wijdfalksjf wiksjkfjksalhf, gsahfjhgejkfh  uhaejkfh sjdihgfuqiw jh sjiafhjsaj fh asd.</p>
+                </div>
+                  <div className='col-4'><img src='https://placehold.co/600x400' className='responsive-img' /></div>
+                  
+                </div>
               </Element>
           
 
-- 
GitLab