title | header | footer | header-dark | footer-dark |
---|---|---|---|---|
Testbed |
false |
false |
{% include section.html %}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
italic text
bold text
strike-through text
Text with extra blank lines above and below
- list item a
- list item b
- list item c
- ordered list item 1
- ordered list item 2
- ordered list item 3
- top level list item
- nested list item
- even deeper nested list item
- nested list item
Plain image:
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
TABLE | Game 1 | Game 2 | Game 3 | Total |
---|---|---|---|---|
Anna | 144 | 123 | 218 | 485 |
Bill | 90 | 175 | 120 | 385 |
Cara | 102 | 214 | 233 | 549 |
It was the best of times it was the worst of times. It was the age of wisdom, it was the age of foolishness. It was the spring of hope, it was the winter of despair.
// some code with syntax highlighting
const popup = document.querySelector("#popup");
popup.style.width = "100%";
popup.innerText =
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.";
This sentence has inline code
, useful for making references to variables, packages, versions, etc. within a sentence.
Lorem ipsum dolor sit amet. {:.left} Consectetur adipiscing elit. {:.center} Sed do eiusmod tempor incididunt. {:.right}
{% include section.html %}
Stage | Direct Products | ATP Yields |
---|---|---|
Glycolysis | 2 ATP | |
^^ | 2 NADH | 3--5 ATP |
Pyruvaye oxidation | 2 NADH | 5 ATP |
Citric acid cycle | 2 ATP | |
^^ | 6 NADH | 15 ATP |
^^ | 2 FADH | 3 ATP |
30--32 ATP |
$ a * b = c ^ b $
$ 2^{\frac{n-1}{3}} $
$ \int_a^b f(x),dx. $
pie title Pets adopted by volunteers
"Dogs" : 386
"Cats" : 85
"Rats" : 35
{% include section.html %}
{% include section.html background="images/background.jpg" %}
Section, background
{% include section.html dark=true %}
Section, dark=true
{% include section.html background="images/background.jpg" dark=true %}
Section, background
dark=true
{% include section.html size="wide" %}
Section, size=wide
{% include section.html size="full" %}
Section, size=full
w/ figure
{% include figure.html image="https://images.rawpixel.com/image_1000/cHJpdmF0ZS9sci9pbWFnZXMvd2Vic2l0ZS8yMDIyLTA1L2ZsMjYyODgwODcyMjYtaW1hZ2VfMS1rb3k1Zzkxay5qcGc.jpg" link="team" width="100%" %}
{% include section.html %}
{% include figure.html image="images/icon.png" %}
{% include figure.html image="images/icon.png" caption="Lorem ipsum." %}
{% include figure.html image="images/icon.png" caption="Lorem ipsum. px
width" width="400px" %}
{% include figure.html image="images/icon.png" caption="Lorem ipsum. %
width" link="team" width="50%" %}
{% include figure.html image="images/icon.png" caption="Lorem ipsum. px
height" link="team" height="200px" %}
{% include figure.html image="images/fallback.svg" caption="Lorem ipsum. px
width, svg" link="team" width="400px" %}
{% include figure.html image="images/fallback.svg" caption="Lorem ipsum. %
width, svg" link="team" width="50%" %}
{% include figure.html image="images/fallback.svg" caption="Lorem ipsum. px
height, svg" link="team" height="200px" %}
{% include section.html %}
{% include button.html type="github" %} {% include button.html type="github" style="bare" %} {% include button.html type="github" icon="fa-brands fa-youtube" text="Override Text" tooltip="Override tooltip" %} {% include button.html type="github" text="" style="bare" %} {% include button.html type="github" text="" link="github-handle" %}
{% include section.html %}
{% include icon.html icon="fa-solid fa-bacteria" %} {% include icon.html icon="fa-solid fa-virus" %} {% include icon.html icon="fa-solid fa-flask" %} {% include icon.html icon="manubot.svg" %}
{% include icon.html icon="fa-brands fa-github" %} Lorem {% include icon.html icon="fa-solid fa-microscope" %} Ipsum {% include icon.html icon="manubot.svg" %} Dolor
{% include section.html %}
{% capture text %} Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. {% endcapture%} {% include feature.html image="images/icon.png" link="team" title="Title" text=text %} {% include feature.html image="images/icon.png" title="Title" text=text flip=true %} {% include feature.html link="team" %}
{% include section.html %}
{% include list.html data="citations" component="citation" filters="roger-tu-list: true" %}
{% include list.html data="projects" component="card" %}
{% include list.html data="members" component="portrait" filters="role: phd" %}
{% include list.html data="posts" component="post-excerpt" %}
{% include section.html %}
{% include citation.html lookup="doi:10.1016/j.csbj.2020.05.017" %} {% include citation.html lookup="Open collaborative writing" style="rich" %} {% include citation.html title="Manual title" authors="Manual authors" %}
{% include section.html %}
{% include card.html image="images/icon.png" link="https://nasa.gov/" title="A Large Card" subtitle="A cool card" description="A cool description" tooltip="A cool tooltip" tags="manual tag" repo="greenelab/lab-website-template" %} {% include card.html image="images/icon.png" title="A Small Card" subtitle="A cool card" description="Lorem ipsum" tooltip="A cool tooltip" tags="manual tag" repo="greenelab/lab-website-template" style="small" %}
{% include section.html %}
{% include portrait.html lookup="jane-smith" %} {% include portrait.html lookup="john-doe" style="small" %} {% include portrait.html name="Manual name" style="small" %} {% include portrait.html style="small" %}
{% include section.html %}
{% include post-excerpt.html lookup="example-post-1" %} {% include post-excerpt.html title="Manual title" author="Manual author" date="2020-02-20" last_modified_at="" %}
{% include section.html %}
{% capture lorem %} Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. {% endcapture %} {% capture content %}Tip {{ lorem }}{% endcapture %} {% include alert.html type="tip" content=content %} {% capture content %}Help {{ lorem }}{% endcapture %} {% include alert.html type="help" content=content %} {% capture content %}Info {{ lorem }}{% endcapture %} {% include alert.html type="info" content=content %} {% capture content %}Success {{ lorem }}{% endcapture %} {% include alert.html type="success" content=content %} {% capture content %}Warning {{ lorem }}{% endcapture %} {% include alert.html type="warning" content=content %} {% capture content %}Error {{ lorem }}{% endcapture %} {% include alert.html type="error" content=content %}
{% include section.html %}
{% include tags.html tags="ovarian cancer, dataset, gene expression" repo="greenelab/lab-website-template" link="blog" %}
{% include section.html %}
{% capture content %} {% include figure.html image="images/icon.png" caption="Caption" width="200px" %} {% endcapture %} {% include float.html content=content %} Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. {% include float.html clear=true %}
{% capture content %}
const test = "Lorem ipsum dolor sit amet, consectetur adipiscing elit.";
{% endcapture %} {% include float.html content=content flip=true %} Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nulla facilisi etiam dignissim diam quis. Id aliquet lectus proin nibh nisl condimentum id venenatis a. Tristique magna sit amet purus gravida quis blandit turpis cursus. Ultrices eros in cursus turpis massa tincidunt dui ut ornare. A cras semper auctor neque vitae tempus quam pellentesque nec. At tellus at urna condimentum mattis pellentesque. Ipsum consequat nisl vel pretium. Ultrices mi tempus imperdiet nulla malesuada pellentesque elit eget gravida. Integer vitae justo eget magna fermentum iaculis eu non diam. Mus mauris vitae ultricies leo integer malesuada nunc vel. Leo integer malesuada nunc vel risus. Ornare arcu odio ut sem nulla pharetra. Purus semper eget duis at tellus at urna condimentum. Enim neque volutpat ac tincidunt vitae semper quis lectus.
{% include section.html %}
With Markdown images
![image]({{ "/images/icon.png" | relative_url }})
![image]({{ "/images/icon.png" | relative_url }})
![image]({{ "/images/icon.png" | relative_url }}) {% endcapture %} {% include grid.html content=content %}
With figure components
{% capture content %} {% include figure.html image="https://journals.plos.org/ploscompbiol/article/figure/image?size=inline&id=info:doi/10.1371/journal.pcbi.1007128.g001&rev=2" %} {% include figure.html image="https://ars.els-cdn.com/content/image/1-s2.0-S2001037020302804-gr1.jpg" %} {% include figure.html image="https://iiif.elifesciences.org/lax:32822%2Felife-32822-fig8-v3.tif/full/863,/0/default.webp" %} {% include figure.html image="images/icon.png" %} {% include figure.html image="images/icon.png" %} {% include figure.html image="images/icon.png" %} {% endcapture %} {% include grid.html style="square" content=content %}
{% capture content %} {% include list.html data="citations" component="citation" style="rich" filters="roger-tu-list: true" %} {% endcapture %} {% include grid.html content=content %}
{% capture content %} {% include list.html data="posts" component="post-excerpt" %} {% endcapture %} {% include grid.html content=content %}
{% include section.html %}
{% capture col1 %} Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. {% endcapture %} {% capture col2 %} Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nulla facilisi etiam dignissim diam quis. Id aliquet lectus proin nibh nisl condimentum id venenatis a. {% endcapture %} {% capture col3 %} Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nulla facilisi etiam dignissim diam quis. Id aliquet lectus proin nibh nisl condimentum id venenatis a. Tristique magna sit amet purus gravida quis blandit turpis cursus. Ultrices eros in cursus turpis massa tincidunt dui ut ornare. A cras semper auctor neque vitae tempus quam pellentesque nec. At tellus at urna condimentum mattis pellentesque. Ipsum consequat nisl vel pretium. Ultrices mi tempus imperdiet nulla malesuada pellentesque elit eget gravida. Integer vitae justo eget magna fermentum iaculis eu non diam. Mus mauris vitae ultricies leo integer malesuada nunc vel. Leo integer malesuada nunc vel risus. Ornare arcu odio ut sem nulla pharetra. Purus semper eget duis at tellus at urna condimentum. Enim neque volutpat ac tincidunt vitae semper quis lectus. {% endcapture %} {% include cols.html col1=col1 col2=col2 col3=col3 %}
{% capture col1 %} {% include figure.html image="images/icon.png" caption="Fig. 1a" %} Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. {% endcapture %} {% capture col2 %} {% include figure.html image="images/icon.png" caption="Fig. 1b" %} Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. {% endcapture %} {% capture col3 %} {% include figure.html image="images/icon.png" caption="Fig. 1c" %} Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. {% endcapture %} {% include cols.html col1=col1 col2=col2 col3=col3 %}
{% capture col1 %}
const test = "Lorem ipsum dolor sit amet";
{% endcapture %} {% capture col2 %}
const test = "Lorem ipsum dolor sit amet";
{% endcapture %} {% capture col3 %}
const test = "Lorem ipsum dolor sit amet";
{% endcapture %} {% include cols.html col1=col1 col2=col2 col3=col3 %}
{% include section.html %}
{% include search-box.html %} {% include search-info.html %}
{% include section.html %}
{% include site-search.html %}