Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

NG: Add all styles from Furo #509

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
//@import "print"
@import "print"
@import "screen-readers"
@import "theme"
//@import "typography"
@import "typography"
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
// This file contains styles for managing print media.

////////////////////////////////////////////////////////////////////////////////
// Hide elements not relevant to print media.
////////////////////////////////////////////////////////////////////////////////
@media print
// Hide icon container.
.content-icon-container
display: none !important

// Hide showing header links if hovering over when printing.
.headerlink
display: none !important

// Hide mobile header.
.mobile-header
display: none !important

// Hide navigation links.
.related-pages
display: none !important

////////////////////////////////////////////////////////////////////////////////
// Tweaks related to decolorization.
////////////////////////////////////////////////////////////////////////////////
@media print
// Apply a border around code which no longer have a color background.
.highlight
border: 0.1pt solid var(--color-foreground-border)

////////////////////////////////////////////////////////////////////////////////
// Avoid page break in some relevant cases.
////////////////////////////////////////////////////////////////////////////////
@media print
ul, ol, dl, a, table, pre, blockquote
page-break-inside: avoid

h1, h2, h3, h4, h5, h6, img, figure, caption
page-break-inside: avoid
page-break-after: avoid

ul, ol, dl
page-break-before: avoid
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ body
@include fonts
@include spacing
@include icons
// @include admonitions
// @include default-admonition(#651fff, "abstract")
// @include default-topic(#14B8A6, "pencil")
@include admonitions
@include default-admonition(#651fff, "abstract")
@include default-topic(#14B8A6, "pencil")

// @include colors

Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,105 @@
// This file contains the styling for making the content throughout the page,
// including fonts, paragraphs, headings and spacing among these elements.

body
font-family: var(--font-stack)
pre,
code,
kbd,
samp
font-family: var(--font-stack--monospace)

// Make fonts look slightly nicer.
body
-webkit-font-smoothing: antialiased
-moz-osx-font-smoothing: grayscale

// Line height from Bootstrap 4.1
article
line-height: 1.5

//
// Headings
//
h1,
h2,
h3,
h4,
h5,
h6
line-height: 1.25
font-family: var(--font-stack--headings)
font-weight: bold

border-radius: 0.5rem
margin-top: 0.5rem
margin-bottom: 0.5rem
margin-left: -0.5rem
margin-right: -0.5rem
padding-left: 0.5rem
padding-right: 0.5rem

+ p
margin-top: 0

h1
font-size: 2.5em
margin-top: 1.75rem
margin-bottom: 1rem
h2
font-size: 2em
margin-top: 1.75rem
h3
font-size: 1.5em
h4
font-size: 1.25em
h5
font-size: 1.125em
h6
font-size: 1em

small
opacity: 75%
font-size: 80%

// Paragraph
p
margin-top: 0.5rem
margin-bottom: 0.75rem

// Horizontal rules
hr.docutils
height: 1px
padding: 0
margin: 2rem 0
background-color: var(--color-background-border)
border: 0

.centered
text-align: center

// Links
a
text-decoration: underline

color: var(--color-link)
text-decoration-color: var(--color-link-underline)

&:visited
color: var(--color-link--visited)
text-decoration-color: var(--color-link-underline--visited)
&:hover
color: var(--color-link--visited--hover)
text-decoration-color: var(--color-link-underline--visited--hover)

&:hover
color: var(--color-link--hover)
text-decoration-color: var(--color-link-underline--hover)
&.muted-link
color: inherit
&:hover
color: var(--color-link--hover)
text-decoration-color: var(--color-link-underline--hover)
&:visited
color: var(--color-link--visited--hover)
text-decoration-color: var(--color-link-underline--visited--hover)
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
//
// The design here is strongly inspired by mkdocs-material.
.admonition, .topic
margin: 1rem auto
padding: 0 0.5rem 0.5rem 0.5rem

background: var(--color-admonition-background)

border-radius: 0.2rem
box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.05), 0 0 0.0625rem rgba(0, 0, 0, 0.1)

font-size: var(--admonition-font-size)

overflow: hidden
page-break-inside: avoid

// First element should have no margin, since the title has it.
> :nth-child(2)
margin-top: 0

// Last item should have no margin, since we'll control that w/ padding
> :last-child
margin-bottom: 0

.admonition p.admonition-title,
p.topic-title
position: relative
margin: 0 -0.5rem 0.5rem
padding-left: 2rem
padding-right: .5rem
padding-top: .4rem
padding-bottom: .4rem

font-weight: 500
font-size: var(--admonition-title-font-size)
line-height: 1.3

// Our fancy icon
&::before
content: ""
position: absolute
left: 0.5rem
width: 1rem
height: 1rem

// Default styles
p.admonition-title
background-color: var(--color-admonition-title-background)
&::before
background-color: var(--color-admonition-title)
mask-image: var(--icon-admonition-default)
mask-repeat: no-repeat

p.topic-title
background-color: var(--color-topic-title-background)
&::before
background-color: var(--color-topic-title)
mask-image: var(--icon-topic-default)
mask-repeat: no-repeat

//
// Variants
//
.admonition
border-left: 0.2rem solid var(--color-admonition-title)

@each $type, $value in $admonitions
&.#{$type}
border-left-color: var(--color-admonition-title--#{$type})
> .admonition-title
background-color: var(--color-admonition-title-background--#{$type})
&::before
background-color: var(--color-admonition-title--#{$type})
mask-image: var(--icon-#{nth($value, 2)})

.admonition-todo > .admonition-title
text-transform: uppercase
121 changes: 121 additions & 0 deletions src/crate/theme/rtd/crate/static/vendor/furo/styles/content/_api.sass
Original file line number Diff line number Diff line change
@@ -0,0 +1,121 @@
// This file stylizes the API documentation (stuff generated by autodoc). It's
// deeply nested due to how autodoc structures the HTML without enough classes
// to select the relevant items.

// API docs!
dl[class]:not(.option-list):not(.field-list):not(.footnote):not(.glossary):not(.simple)
// Tweak the spacing of all the things!
dd
margin-left: 2rem
> :first-child
margin-top: 0.125rem
> :last-child
margin-bottom: 0.75rem

// This is used for the arguments
.field-list
margin-bottom: 0.75rem

// "Headings" (like "Parameters" and "Return")
> dt
text-transform: uppercase
font-size: var(--font-size--small)

dd:empty
margin-bottom: 0.5rem
dd > ul
margin-left: -1.2rem
> li
> p:nth-child(2)
margin-top: 0
// When the last-empty-paragraph follows a paragraph, it doesn't need
// to augument the existing spacing.
> p + p:last-child:empty
margin-top: 0
margin-bottom: 0

// Colorize the elements
> dt
color: var(--color-api-overall)

.sig:not(.sig-inline)
font-weight: bold

font-size: var(--api-font-size)
font-family: var(--font-stack--monospace)

margin-left: -0.25rem
margin-right: -0.25rem
padding-top: 0.25rem
padding-bottom: 0.25rem
padding-right: 0.5rem

// These are intentionally em, to properly match the font size.
padding-left: 3em
text-indent: -2.5em

border-radius: 0.25rem

background: var(--color-api-background)
transition: background 100ms ease-out

&:hover
background: var(--color-api-background-hover)

// adjust the size of the [source] link on the right.
a.reference
.viewcode-link
font-weight: normal
width: 4.25rem

em.property
font-style: normal
&:first-child
color: var(--color-api-keyword)
.sig-name
color: var(--color-api-name)
.sig-prename
font-weight: normal
color: var(--color-api-pre-name)
.sig-paren
color: var(--color-api-paren)
.sig-param
font-style: normal

div.versionadded,
div.versionchanged,
div.deprecated,
div.versionremoved
border-left: 0.1875rem solid
border-radius: 0.125rem

padding-left: 0.75rem

p
margin-top: 0.125rem
margin-bottom: 0.125rem

div.versionadded
border-color: var(--color-api-added-border)
.versionmodified
color: var(--color-api-added)

div.versionchanged
border-color: var(--color-api-changed-border)
.versionmodified
color: var(--color-api-changed)

div.deprecated
border-color: var(--color-api-deprecated-border)
.versionmodified
color: var(--color-api-deprecated)

div.versionremoved
border-color: var(--color-api-removed-border)
.versionmodified
color: var(--color-api-removed)

// Align the [docs] and [source] to the right.
.viewcode-link, .viewcode-back
float: right
text-align: right
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
.line-block
margin-top: 0.5rem
margin-bottom: 0.75rem
.line-block
margin-top: 0rem
margin-bottom: 0rem
padding-left: 1rem
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
// Captions
article p.caption,
table > caption,
.code-block-caption
font-size: var(--font-size--small)
text-align: center

// Caption above a TOCTree
.toctree-wrapper.compound
.caption, :not(.caption) > .caption-text
font-size: var(--font-size--small)
text-transform: uppercase

text-align: initial
margin-bottom: 0

> ul
margin-top: 0
margin-bottom: 0
Loading
Loading