tutorials > Demo Post

Demo Post

July 10, 2019

This page demonstrates some of the basic features and functionality of this help site.

Since this is MDX, we can use a <Tip> component for helpful suggestions.

tipTip!

Here is some extra information that you might find helpful. However, feel free to ignore it.

There is also a <Warning> component for more serious information.

warningWarning!

Don't ignore this! It is important information!

We also have a custom codeblock component so that we can have nice syntax highlighting in code samples. Click the clipboard to copy the code.

You can change the syntax highlighting theme based on the overall site theme as well. Try clicking the Sun/Moon icon at the very top of the page to see.

let sandwich = "grilled rachel";

function testing() {
  let three = 1 + 2;
  return three;
}

Gatsby provides many nice features by default:

  • Lazy loading images
  • Fast loading pages

The rest of the page is just filler content demonstrating some styles and heading levels. Thanks for exporing the project!

Here is a heading 2

flower

Eget arcu dictum varius duis at consectetur lorem. Amet facilisis magna etiam tempor orci eu lobortis. Elementum pulvinar etiam non quam lacus suspendisse faucibus interdum posuere. Elementum sagittis vitae et leo. Ipsum dolor sit amet consectetur adipiscing. Sit amet risus nullam eget. Neque vitae tempus quam pellentesque nec nam aliquam sem. Luctus accumsan tortor posuere ac ut consequat. Pulvinar sapien et ligula ullamcorper malesuada proin libero nunc consequat.

A sample heading 3

Bibendum enim facilisis gravida neque convallis a cras semper auctor. Purus faucibus ornare suspendisse sed nisi. Tempor id eu nisl nunc mi ipsum faucibus vitae aliquet. Ornare massa eget egestas purus viverra accumsan in nisl. Eleifend quam adipiscing vitae proin. Aliquet sagittis id consectetur purus ut faucibus pulvinar. Placerat vestibulum lectus mauris ultrices eros in cursus turpis. Mattis nunc sed blandit libero volutpat. Urna molestie at elementum eu. Vulputate mi sit amet mauris commodo. Felis donec et odio pellentesque. Ut consequat semper viverra nam libero justo. Nam at lectus urna duis convallis convallis tellus id interdum. Nunc sed velit dignissim sodales ut eu sem integer. Sapien faucibus et molestie ac feugiat sed lectus vestibulum mattis. Dolor sit amet consectetur adipiscing. Mattis rhoncus urna neque viverra justo nec ultrices.

 flower

Bibendum enim facilisis gravida neque convallis a cras semper auctor. Purus faucibus ornare suspendisse sed nisi. Tempor id eu nisl nunc mi ipsum faucibus vitae aliquet. Ornare massa eget egestas purus viverra accumsan in nisl. Eleifend quam adipiscing vitae proin. Aliquet sagittis id consectetur purus ut faucibus pulvinar. Placerat vestibulum lectus mauris ultrices eros in cursus turpis. Mattis nunc sed blandit libero volutpat. Urna molestie at elementum eu. Vulputate mi sit amet mauris commodo. Felis donec et odio pellentesque. Ut consequat semper viverra nam libero justo. Nam at lectus urna duis convallis convallis tellus id interdum. Nunc sed velit dignissim sodales ut eu sem integer. Sapien faucibus et molestie ac feugiat sed lectus vestibulum mattis. Dolor sit amet consectetur adipiscing. Mattis rhoncus urna neque viverra justo nec ultrices.

This is a heading 3

function test() {
  return "test";
}

Enim nec dui nunc mattis enim ut. Dictum at tempor commodo ullamcorper a. Vivamus at augue eget arcu dictum. Turpis massa tincidunt dui ut ornare lectus sit amet. Tortor pretium viverra suspendisse potenti nullam. Nec sagittis aliquam malesuada bibendum. Cursus metus aliquam eleifend mi in nulla posuere. Aenean et tortor at risus viverra adipiscing at. Scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique senectus. Mi bibendum neque egestas congue quisque.

let theme = "not working";

function checkTheme(theme) {
  console.log(theme);
}

checkTheme(theme);
  1. Step one, go do the thing.
  2. For the second step, do the second thing that you do.
  3. The third thing to do is to do the third thing. The results of this action are shown.
  4. Finally, we're back to the final step of the main list.

Heading 2 again

Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Arcu felis bibendum ut tristique et egestas quis. Nibh tortor id aliquet lectus proin nibh nisl condimentum id. Vestibulum morbi blandit cursus risus at ultrices mi tempus imperdiet. Risus at ultrices mi tempus imperdiet. Morbi enim nunc faucibus a pellentesque sit. Integer feugiat scelerisque varius morbi enim nunc faucibus a pellentesque. Et tortor consequat id porta nibh venenatis cras sed felis. Vitae tempus quam pellentesque nec nam aliquam sem et tortor. Sed egestas egestas fringilla phasellus faucibus scelerisque eleifend donec pretium. Nec nam aliquam sem et tortor consequat. Iaculis at erat pellentesque adipiscing.

This is another somewhat longer heading 3 This is another somewhat longer heading 3

Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Arcu felis bibendum ut tristique et egestas quis. Nibh tortor id aliquet lectus proin nibh nisl condimentum id. Vestibulum morbi blandit cursus risus at ultrices mi tempus imperdiet. Risus at ultrices mi tempus imperdiet. Morbi enim nunc faucibus a pellentesque sit. Integer feugiat scelerisque varius morbi enim nunc faucibus a pellentesque. Et tortor consequat id porta nibh venenatis cras sed felis. Vitae tempus quam pellentesque nec nam aliquam sem et tortor. Sed egestas egestas fringilla phasellus faucibus scelerisque eleifend donec pretium. Nec nam aliquam sem et tortor consequat. Iaculis at erat pellentesque adipiscing.

Heading 4

Lacus suspendisse faucibus interdum posuere lorem ipsum. Purus in massa tempor nec feugiat. At tempor commodo ullamcorper a lacus vestibulum sed arcu non. Arcu cursus euismod quis viverra nibh cras pulvinar. Odio facilisis mauris sit amet massa vitae tortor. In vitae turpis massa sed. Risus viverra adipiscing at in tellus integer. Sodales neque sodales ut etiam sit. Massa massa ultricies mi quis hendrerit dolor. Arcu non odio euismod lacinia at quis risus sed vulputate. In pellentesque massa placerat duis ultricies lacus.