From dafdb9d4637a62d48ab31146489d82b85806d646 Mon Sep 17 00:00:00 2001
From: asal sahami <asalsahami22@gmail.com>
Date: Wed, 25 Sep 2024 18:35:52 +0200
Subject: [PATCH] fanzor
---
src/components/Fanzorviewer.tsx | 12 ++++++------
src/contents/description.tsx | 1 +
src/contents/engineering.tsx | 1 +
3 files changed, 8 insertions(+), 6 deletions(-)
diff --git a/src/components/Fanzorviewer.tsx b/src/components/Fanzorviewer.tsx
index 65029ebf..dd58af6c 100644
--- a/src/components/Fanzorviewer.tsx
+++ b/src/components/Fanzorviewer.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import React, { useRef, useEffect } from 'react';
import * as THREE from 'three';
export const ProteinViewer: React.FC = () => {
@@ -9,9 +9,9 @@ export const ProteinViewer: React.FC = () => {
const camera = new THREE.PerspectiveCamera(75, 1, 0.1, 1000); // Adjust aspect ratio if needed
const renderer = new THREE.WebGLRenderer({ antialias: true });
- renderer.setSize(200, 200);
+ renderer.setSize(100, 100); // Set a smaller size
- // Append the renderer to the div container instead of body
+
if (viewerRef.current) {
viewerRef.current.appendChild(renderer.domElement);
}
@@ -20,7 +20,7 @@ export const ProteinViewer: React.FC = () => {
light.position.set(0, 1, 2);
scene.add(light);
- camera.position.z = 5;
+ camera.position.z = 10;
// Render loop
const animate = () => {
@@ -41,8 +41,8 @@ export const ProteinViewer: React.FC = () => {
<div
ref={viewerRef}
style={{
- width: '400px', // Customize the width
- height: '400px', // Customize the height
+ width: '100px', // Smaller width
+ height: '100px', // Smaller height
margin: '0 auto', // Center it if you want
border: '1px solid #ddd', // Optional: border around the viewer
}}
diff --git a/src/contents/description.tsx b/src/contents/description.tsx
index 3df8bbfa..a3a6176a 100644
--- a/src/contents/description.tsx
+++ b/src/contents/description.tsx
@@ -63,6 +63,7 @@ export function Description() {
</div>
<div className="col">
<p>Text about CFTR <LoremMedium/></p>
+ <img src="https://static.igem.wiki/teams/5247/fanzor/cftr.gif"></img>
</div>
</div>
</Subesction>
diff --git a/src/contents/engineering.tsx b/src/contents/engineering.tsx
index d0b2ead0..2fd73c3f 100644
--- a/src/contents/engineering.tsx
+++ b/src/contents/engineering.tsx
@@ -169,6 +169,7 @@ export function Engineering() {
<H3 id="Nikase" text="Nikase"></H3>
<p><LoremShort></LoremShort></p>
<img src="https://static.igem.wiki/teams/5247/fanzor/movie4-ezgif-com-video-to-gif-converter.gif"></img>
+ <img src="https://static.igem.wiki/teams/5247/fanzor/movie5-ezgif-com-video-to-gif-converter-2.gif"></img>
</div>
<div className="box" >
<p id="nik1">
--
GitLab