Eric's UI Kit Docs & Demo
Prose
EUIKit includes some components dedicated to displaying large passages of text, with components for displaying inline notes and figures with responsive styling. This group of components is suitable for long blog posts, articles, documentation, and other uses where good typography is vital, and readability is paramount.
These prose components take cues from Edward Tufte and the tufte-css project.
    <x-e::prose>
        <x-e::prose.h level="1">Header</x-e::prose.h>
        <x-e::prose.p>Paragraph</x-e::prose.p>
        <x-e::prose.p>Paragraph</x-e::prose.p>
    </x-e::prose>
Scaffolding for a prose section. Also an example of a marginfigure.
The <x-euikit::prose> wrapper encloses the entire article. Within it, there are components that mimic the standard HTML components, like h and p.
Headers
Headers are created with the <x-euikit::prose.h> component. It requires a level parameter, which signals the subheader level. The prose.h tag supports three levels of headings.
Header Level 1
Header Level 2
Header Level 3
As an alternative to using headers, the newthought attribute can be added to the prose.p tag. This will cause the first line of the paragraph to be rendered in uppercase with added intra-letter tracking. Newthoughts can be suitable if there is only one heading at the top of the article, and no need for sub-headings. While they can be used to break up thoughts within subheadings, it is generally considered bad practice to mix the two techniques too much.
Side notes are created with the <x-euikit::prose.sidenote> component. This component requires a marker attribute, which will be placed within the text at the placement of the tag. The contents of the sidenote will appear in the right margin beside the line containing the marker. This can be used like a footnote 1
1 This is a side note.
. The typical use is for the marker to begin at "1" and increment throughout the article. The similar <x-euikit::marginnote> component acts like a sidenote, in that the note will appear in the right margin next to the text, but the marginnote does not use a marker.
A margin note does not use a marker.
The <x-euikit::marginfigure> container will place its contents in the right margin. This is suitable for small tables, figures, code samples, or other bits of explanatory information that would be harder to fit into a "note." Margin figures are bordered, and can take an optional caption attribute.
For my reference, as I develop these components, here are some long passages of text.
Synopsis
The West Wing is an American serial political drama television series created by Aaron Sorkin that was originally broadcast on NBC from September 22, 1999, to May 14, 2006. 1
1 Keveney, Bill (January 22, 2006). "'West Wing' to end with new president". USA Today. Archived from the original on October 18, 2012. Retrieved February 12, 2006.
The series is set primarily in the West Wing of the White House, where the Oval Office and offices of presidential senior personnel are located, during the fictitious Democratic administration of President Josiah Bartlet.
Production
The West Wing was produced by Warner Bros. Television and featured an ensemble cast, including Martin Sheen, John Spencer, Allison Janney, Rob Lowe, Bradley Whitford, Richard Schiff, Janel Moloney, Dulé Hill, and Stockard Channing. For the first four seasons, there were three executive producers: Sorkin (lead writer of the first four seasons), Thomas Schlamme (primary director), and John Wells. After Sorkin left the series
Aaron Sorkin left at the end of the fourth season.
, Wells assumed the role of head writer, with later executive producers being directors Alex Graves and Christopher Misiano (seasons 6–7), and writers Lawrence O'Donnell and Peter Noah (season 7).
Ranking
The West Wing has been ranked among the best television shows of all time in publications such as Time, 2
2 "The West Wing – The 100 Best TV Shows of All-TIME". Time. September 6, 2007. Archived from the original on October 22, 2011. Retrieved March 28, 2010.
TV Guide, 3
3 Roush, Matt (February 25, 2013). "Showstoppers: The 60 Greatest Dramas of All Time". TV Guide: 16–17.
4
4 Fretts, Bruce; Roush, Matt (December 23, 2013). "TV Guide Magazine's 60 Best Series of All Time". TV Guide. Archived from the original on November 19, 2017. Retrieved October 22, 2015.
Empire, 5
5 "The 50 Best TV Shows Ever". Empire. April 24, 2018. Archived from the original on June 13, 2018. Retrieved July 16, 2018.
Rolling Stone, 6
6 Sheffield, Rob (September 21, 2016). "100 Greatest TV Shows of All Time". Rolling Stone. Archived from the original on October 24, 2016. Retrieved October 24, 2016.
and the New York Daily News. 7
7 Hinckley, David (August 22, 2014). "From 'Mad Men' to 'Breaking Bad,' the Top 10 dramas of all time". New York Daily News. Archived from the original on April 2, 2015. Retrieved October 24, 2016.
The Writers Guild of America ranked it no. 10 in its "101 Best-Written TV Series" list. 8
8 "101 Best Written TV Series of All Time". Writers Guild of America, West. June 2, 2013. Archived from the original on July 16, 2016. Retrieved June 3, 2013.
It has received praise from critics, political science professors, and former White House staffers and has been the subject of critical analysis. The West Wing received a multitude of accolades, including two Peabody Awards, three Golden Globe Awards, and 26 Primetime Emmy Awards, including the award for Outstanding Drama Series, which it won four consecutive times from 2000 to 2003. The show's ratings waned in later years following the departure of series creator Sorkin after the fourth season (Sorkin wrote or co-wrote 85 of the first 88 episodes), yet it remained popular among high-income viewers, a key demographic for the show and its advertisers, 9
9 Spitzer, Gabriel (May 14, 2001). "Rich are different. They watch 'West Wing.'". Media Life. Archived from the original on August 19, 2012. Retrieved January 21, 2010.
with around 16 million viewers.
A stage version of the season 3 episode "Hartsfield's Landing", "A West Wing Special to Benefit When We All Vote", premiered on HBO Max in October 2020, featuring the entire surviving original main cast along with key recurring cast in their original roles.