-
Notifications
You must be signed in to change notification settings - Fork 4.8k
Docusaurus 3.8 #4607
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
Docusaurus 3.8 #4607
Changes from all commits
dede178
f6ee389
a761cf1
a3e2d75
da91238
01d3d03
f813793
94cd833
4219522
0200da9
5773cce
0d4477d
33a6489
858ccc6
0a614b4
e3d4313
d56b594
b1b7e48
52fda41
f778c03
2567cdb
af4fe5f
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -43,7 +43,6 @@ | |
--ifm-table-border-color: var(--ifm-toc-border-color); | ||
--ifm-table-cell-padding: 10px; | ||
--ifm-table-stripe-background: rgba(0, 0, 0, 0.02); | ||
--docusaurus-blog-social-icon-size: 16px; | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This was not used, and after introducing cascade layers, it became used and produced a visual diff that my tool caught. The effective icon size on the RN website in prod is 17px, not 16px. |
||
|
||
@media (min-width: 340px) { | ||
--ifm-navbar-sidebar-width: 340px; | ||
|
@@ -223,8 +222,14 @@ html[data-theme="dark"] { | |
} | ||
} | ||
|
||
main[class^="docMainContainer"] > .container { | ||
padding-top: 2rem !important; | ||
/* | ||
Layer needed to override utility rules using !important in the Infima layer | ||
See also https://css-tricks.com/css-cascade-layers/#aa-important-layers | ||
*/ | ||
@layer docusaurus.infima.importantOverrides { | ||
main[class^="docMainContainer"] > .container { | ||
padding-top: 2rem !important; | ||
} | ||
} | ||
Comment on lines
+225
to
233
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Our Infima utility types such as Once layered, these rules can't be overridden by unlayered CSS, and you have to add your override directly to the Infima layer with All this is explained here: https://css-tricks.com/css-cascade-layers/#aa-important-layers. This may seem annoying, but I think it makes sense. Utility classes serve to drive the styling from the markup. If you write The proper way would be to swizzle the component and remove PS: the name |
||
|
||
div[class^="generatedIndexPage"] { | ||
|
@@ -268,6 +273,10 @@ hr { | |
} | ||
|
||
blockquote { | ||
> :last-child { | ||
margin-bottom: 0; | ||
} | ||
Comment on lines
+276
to
+278
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
|
||
background-color: var(--rn-note-background); | ||
border-left: 8px solid var(--ifm-color-warning); | ||
padding: 15px 30px 15px 15px; | ||
|
@@ -568,8 +577,10 @@ html[data-theme="dark"] .alert--secondary { | |
text-decoration-thickness: 1px !important; | ||
} | ||
|
||
.margin-top--md { | ||
margin-top: 0.33rem !important; | ||
@layer docusaurus.infima.importantOverrides { | ||
.margin-top--md { | ||
margin-top: 0.33rem !important; | ||
} | ||
} | ||
} | ||
|
||
|
@@ -1854,6 +1865,10 @@ html[data-theme="dark"] .docsRating { | |
border-radius: var(--ifm-global-radius); | ||
} | ||
|
||
.tabs-container .snack-player:last-child { | ||
margin-bottom: 0; | ||
} | ||
|
||
/* Two columns code block */ | ||
|
||
.two-columns { | ||
|
@@ -1888,10 +1903,15 @@ html[data-theme="dark"] .docsRating { | |
color: var(--ifm-font-color-secondary); | ||
} | ||
|
||
@layer docusaurus.infima.importantOverrides { | ||
.container.margin-vert--lg { | ||
margin-top: 0 !important; | ||
margin-bottom: 0 !important; | ||
} | ||
} | ||
|
||
.container.margin-vert--lg { | ||
max-width: calc(100% - (var(--ifm-spacing-horizontal)) * 4); | ||
margin-top: 0 !important; | ||
margin-bottom: 0 !important; | ||
|
||
.col.text--right a { | ||
@extend %button-link-style; | ||
|
@@ -1934,8 +1954,10 @@ html[data-theme="dark"] .docsRating { | |
} | ||
} | ||
|
||
article.margin-bottom--xl { | ||
margin-bottom: 2.5rem !important; | ||
@layer docusaurus.infima.importantOverrides { | ||
article.margin-bottom--xl { | ||
margin-bottom: 2.5rem !important; | ||
} | ||
} | ||
|
||
aside nav { | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Optional but this can significantly reduce build time for local production builds and deploy previews.
See also facebook/docusaurus#11199
See benchmarks with/without this optimization in the PR description.