TEST SERVER

Formatting Text

Header Options

This is an H1 element that needs to wrap nicely

This is an H2 element that needs to wrap nicely

This is an H3 element that needs to wrap nicely

This is an H4 element that needs to wrap nicely

This is an H5 element that needs to wrap nicely, but we probably won't be able to test that for sure if this text isn't pretty long.

Topics


Lists

Try to use list elements when offering lists of information or options to preserve semantic markup. Note that both our style guide menu and the topics section are built using lists.

Ordered Lists

<ol> elements should be used when the order of the items in the list is important.

Best Animals

  1. parrots
  2. tuatara
  3. octopuses

Unordered Lists

<ul> elements should be used when the order of the list isn't important.

Shopping List

  • milk
  • eggs
  • bread

Ninja Lists

.simple-list can be added as a class to either an ordered list or unordered list to remove the visual list item styling (number or maker) in favor of more neutral styling. The overview employs this.

If you need to otherwise style a list item as a one-off, that's okay.

back to top

Logs

Logs are a special kind of list. <ol class="list"> can be used (class also applies to ULs if logs are not ordered).

jump to example

back to top

Code

Here are some tips for formatting code to be presented in plain text on the web:

  • <code> tags visually mark text as code
  • &lt; and &gt; can be used to escape < and > in these blocks
  • <code class="multi-line"> can be used for multi-line code blocks

Code blocks can be very visually distracting, so try to group them if you can.

# Some _why plagiarism to demonstrate a multi-line code block print( if at_hotel.nil? "No clue if he's in the hotel." elsif at_hotel == true "Definitely in." elsif at_hotel == false "He's out." else "The system is on the freee-itz." end )

back to top

Statistics

You can use the following to show statistics, etc.: <table class="stats">

Contiguous States 48
Total States 50
Population 325.7 million
GDP per capita 57,466.79 USD

back to top

Example Text

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.

Section 1.10.32 of "de Finibus Bonorum et Malorum", written by Cicero in 45 BC

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?

Some imaginary logs

  1. 09/22/2018 4:35pm - [entity] performed [action] on [object]
  2. 09/22/2018 4:34pm - [entity] performed [action] on [object]
  3. 09/22/2018 4:33pm - [aaaaaaaaa] performed [bbbbbbbbb] on [cccccccccccccc]
  4. 09/22/2018 4:32pm - [entity] performed [action] on [object]
  5. 09/22/2018 4:31pm - [entity with unusually long name] performed [action with unusually long name] on [object with unusually long name]
  6. 09/22/2018 4:30pm - [entity] performed [action] on [object]
  7. 09/22/2018 4:29pm - [ent] performed [act] on [obj]
  8. 09/22/2018 4:28pm - [entity] performed [action] on [object]
  9. 09/22/2018 4:27pm - [entity] performed [action] on [object]
  10. 09/22/2018 4:26pm - [entity] performed [action] on [object]
  11. 09/22/2018 4:25pm - [entity] performed [action] on [object]
  12. 09/22/2018 4:24pm - [entity] performed [action] on [object]
  13. 09/22/2018 4:23pm - [other entity] performed [other action] on [other object]
  14. 09/22/2018 4:22pm - [entity] performed [action] on [object]
  15. 09/22/2018 4:21pm - system restart
  16. 09/22/2018 4:20pm - [entity] performed [action] on [object]
  17. 09/22/2018 4:19pm - [entity] performed [action] on [object]
  18. 09/22/2018 4:18pm - [a] performed [b] on [c]
  19. 09/22/2018 4:17pm - [entity] performed [action] on [object]
  20. 09/22/2018 4:16pm - [entity] performed [action] on [object]
  21. 09/22/2018 4:15pm - [entity] performed [action] on [object]
  22. 09/22/2018 4:14pm - [entity] performed [action] on [object]
  23. 09/22/2018 4:13pm - [entity] performed [action] on [object]
  24. 09/22/2018 4:12pm - [entity] performed [action] on [object]
  25. 09/22/2018 4:11pm - [entity] performed [action] on [object]
  26. 09/22/2018 4:10pm - [entity] performed [action] on [object]
  27. 09/22/2018 4:09pm - [skdjflskjdfsdf] performed [skjdflkjsdlfkj] on [sdkfjsldkjfl]
  28. 09/22/2018 4:08pm - [entity] performed [action] on [object]
  29. 09/22/2018 4:07pm - [entity] performed [action] on [object]
  30. 09/22/2018 4:06pm - [entity] performed [action] on [object]
  31. 09/22/2018 4:05pm - [entity] performed [action] on [object]
  32. 09/22/2018 4:04pm - [e] performed [a] on [o]
  33. 09/22/2018 4:03pm - [entity] performed [action] on [object]
  34. 09/22/2018 4:02pm - [entity] performed [action] on [object]
  35. 09/22/2018 4:01pm - [entity] performed [action] on [object]
  36. 09/22/2018 4:00pm - [entity] performed [action] on [object]
  37. 09/22/2018 3:59pm - [entity] performed [action] on [object]
  38. 09/22/2018 3:58pm - [11111111] performed [222222] on [333333333]
  39. 09/22/2018 3:57pm - [entity] performed [action] on [object]
  40. 09/22/2018 3:56pm - [entity] performed [action] on [object]
  41. 09/22/2018 3:55pm - [entity] performed [action] on [object]
  42. 09/22/2018 3:54pm - [entity] performed [action] on [object]
  43. 09/22/2018 3:53pm - [entity] performed [action] on [object]
  44. 09/22/2018 3:52pm - [entity] performed [action] on [object]
  45. 09/22/2018 3:51pm - [entity] performed [action] on [object]
  46. 09/22/2018 3:50pm - [entity] performed [action] on [object]
  47. 09/22/2018 3:49pm - [a] performed [b] on [c]
  48. 09/22/2018 3:48pm - [entity] performed [action] on [object]
  49. 09/22/2018 3:47pm - [entity] performed [action] on [object]
  50. 09/22/2018 3:46pm - [entity] performed [action] on [object]

back to top