diff --git a/src/App/mediarules.css b/src/App/mediarules.css index 0a4919df9ea83f5014ca81a312c3414e07cc2bca..3a08971f90df719e1d38ac20e19546a645150d25 100644 --- a/src/App/mediarules.css +++ b/src/App/mediarules.css @@ -89,22 +89,8 @@ .bfh-slider{ width: 100em !important; max-width: 250px !important; - } - .sidebar, #eng-sidebar { - display: block; /* Sicherstellen, dass die Sidebar sichtbar ist */ - width: 100%; /* Die Sidebar nimmt die volle Breite ein */ - position: relative; /* Sidebar bleibt relativ zum Inhalt */ - padding: 10px; /* Etwas Abstand für die Sidebar */ - background-color: #f8f9fa; /* Beispiel Hintergrundfarbe */ - z-index: 1000; /* Sicherstellen, dass es über dem Inhalt bleibt */ - } + } - /* Hauptinhalt unter der Sidebar */ - .content { - width: 100%; /* Der Inhalt nimmt die volle Breite ein */ - margin-top: 20px; /* Etwas Platz unter der Sidebar */ - } -} .tag{ width: min-content !important; @@ -198,8 +184,8 @@ body { .row{ display: grid !important; } - } + /*For small Smartphones*/ @media screen and (max-width: 750px){ diff --git a/src/contents/notebook.tsx b/src/contents/notebook.tsx index 78111950f1c44e9e3ea1d69175a4fa863a24422b..d793791243ff38a35acec955034fc1595e1e0a91 100644 --- a/src/contents/notebook.tsx +++ b/src/contents/notebook.tsx @@ -1,22 +1,27 @@ -import H1 from "../components/Headings"; +import H2 from "../components/Headings"; import { useTabNavigation } from "../utils/TabNavigation"; export function Notebook() { useTabNavigation(); return ( - <> - <div className="row mt-4"> - <div className="col-lg-8"> - <strong> - <H1 text="Ich bin ein Header!"/> - </strong> - <i> - <p> Ich bin ein Paragraph. </p> - </i> + <div> + <H2 text="Lab journals"/> + <div className='row'> + <div className="col"> + <figure> + <img src="https://static.igem.wiki/teams/5247/photos/for-wiki-texts/meth-patch-clamp/bild-meth-patch-clamp.png" alt="Text test"/> + <figcaption><b>Figure 1.</b> Text test</figcaption> + </figure> + </div> + <div className="col"> + <figure> + <img src="https://static.igem.wiki/teams/5247/photos/for-wiki-texts/meth-patch-clamp/bild-meth-patch-clamp.png" alt="Text2"/> + <figcaption><b>Figure 2.</b> Text2</figcaption> + </figure> </div> - </div> - </> + </div> + ); }