created by Cyle Gage
version 0.1, last updated 12/12/14

Cylesoft Style Guide (Simple)

Section Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In in nibh ut lorem viverra vulputate nec eu felis. Sed fringilla dolor feugiat arcu pharetra lacinia vitae at mi. Integer aliquet, mauris et sodales vestibulum, urna tellus aliquam libero, nec tempor risus diam nec quam. Vivamus elementum porttitor ligula, at malesuada magna pulvinar in. Nulla lobortis sit amet augue sit amet cursus. Sed bibendum nisl id magna varius, vitae tincidunt felis elementum. Nullam quis laoreet diam. Etiam eu lorem metus. Mauris sapien metus, volutpat ut orci sed, scelerisque consequat neque.

An aside!

Duis quis interdum tellus, id cursus massa. Morbi euismod lectus eleifend, venenatis turpis tristique, fringilla leo. Praesent bibendum, velit eu dapibus aliquam, arcu enim efficitur mauris, at viverra augue ligula quis arcu. Sed aliquet, tellus et pellentesque ultrices, velit arcu facilisis turpis, eget lobortis ipsum velit fringilla dui. Sed quam tortor, bibendum ac purus a, facilisis condimentum purus. Donec at ex viverra risus bibendum elementum. Nam pretium, elit sed lacinia lobortis, nibh dolor fringilla lorem, malesuada rutrum tortor mauris quis nulla.

Here's a horizontal rule as a section break:

Sub-section Title

Integer vestibulum vitae nunc ut aliquam. Fusce ornare libero mi, nec molestie mauris imperdiet vel. Duis vel augue odio. Curabitur gravida non risus in sagittis. Aliquam erat volutpat. Aliquam vel iaculis lacus. Donec eget facilisis nunc.

A list.
Of stuff! Yay!

An aside on the left! It can be decently long, but not a lot.

More text.

Block quotes are slightly inset and italicized, because why not.

Wow, what a great block quote.

Interface Elements

And even more paragraph text! Here's a table:

Column Header 1	Column Header 2
Data!	Data!
Data!	Data!
Data!	Data!

Wow. Great. Here are some buttons, which are just anchor tags with the "button" class and modifier classes:

"Small" Button Normal Button "Large" Button

"Red" Button "Grey" Button "Blue" Button

And some form elements:

Input text:

Textarea:

Submit buttons can also use regular button classes for color and size:

And a pre/code area:

$ apt-get install dicks
$ apt-get remove whatever
$ node lulzradio.js

And here's some code in a paragraph tag lol.

And here are a few boxes:

A div with class "box".

A div with class "box" and "serious".

A red alert-like box.

All the classes for buttons also work for boxes.

That's pretty much it.