import { DownloadImageButton } from "../components/Buttons";
import H2 from "../components/Headings";
import { useTabNavigation } from "../utils/TabNavigation";

export function Notebook() {
  useTabNavigation();
  return (
    <div>
      <H2 text="Lab journals and Protocol collection"/> 
      <div className='row'>
        
        <div className="col">
          <DownloadImageButton url="" fileName="">
            <img src="https://static.igem.wiki/teams/5247/lab-journals/titelseite-lab-book-1-proof-of-concept-pe.webp" style={{height: "75%", width: "auto"}}/>
          </DownloadImageButton>
        </div>

        <div className="col">
        <DownloadImageButton url="" fileName="">
            <img src="https://static.igem.wiki/teams/5247/lab-journals/titelseite-lab-book-2-engineering-pe.webp" style={{height: "75%", width: "auto"}}/>
            </DownloadImageButton>
        </div>
      </div>
      <div className='row'>
        <div className="col">
        <DownloadImageButton url="" fileName="">
            <img src="https://static.igem.wiki/teams/5247/lab-journals/titelseite-lab-book-3-primary-cell-culture.webp" style={{height: "75%", width: "auto"}}/>
            </DownloadImageButton>
        </div>
        <div className="col">
        <DownloadImageButton url="" fileName="">
            <img src="https://static.igem.wiki/teams/5247/lab-journals/titelseite-lab-book-4-lnp.webp" style={{height: "75%", width: "auto"}}/>
            </DownloadImageButton>
        </div>
      </div>
      <div className='row'>
        <div className="col">
        <DownloadImageButton url="https://static.igem.wiki/teams/5247/pdfs/lab-book-5-downstream-experiments.pdf" fileName="lab-book-5-downstream-experiments.pdf">
            <img src="https://static.igem.wiki/teams/5247/lab-journals/titelseite-lab-book-5-downstream.webp" style={{height: "75%", width: "auto"}}/>
            </DownloadImageButton>
        </div>
        <div className="col">
        <DownloadImageButton url="" fileName="">
            <img src="https://static.igem.wiki/teams/5247/lab-journals/titelseite-lab-book-sop.webp" style={{height: "75%", width: "auto"}}/>
            </DownloadImageButton>
        </div>
      </div>
    </div>

  );
}