Scope markdown body (#21082)
* update article content to markdown ui component * decouple lunr indexing from class name * remove summary outline none rule, apply utility class instead * improve typing * scope more styles down to markdown-body/extended-markdown * move all markdown-body style overrides to MarkdownContent component * fix class targeting within css module * clean up MarkdownContent header style * rename data-lunr to data-search * fix: inline code color issue * fix: update article markdown to work with MarkdownContent
This commit is contained in:
@@ -3,7 +3,7 @@ import parseUserAgent from './user-agent'
|
||||
import { sendEvent, EventType } from './events'
|
||||
|
||||
const supportedPlatforms = ['mac', 'windows', 'linux']
|
||||
const detectedPlatforms = new Set()
|
||||
const detectedPlatforms = new Set<string>()
|
||||
|
||||
// Emphasize content for the visitor's OS (inferred from user agent string)
|
||||
|
||||
@@ -66,9 +66,7 @@ function setActiveSwitcherLinks(platform: string) {
|
||||
function showPlatformSpecificContent(platform: string) {
|
||||
// find all platform-specific *block* elements and hide or show as appropriate
|
||||
// example: {{ #mac }} block content {{/mac}}
|
||||
const markdowns = Array.from(
|
||||
document.querySelectorAll('.extended-markdown')
|
||||
) as Array<HTMLElement>
|
||||
const markdowns = Array.from(document.querySelectorAll<HTMLElement>('.extended-markdown'))
|
||||
markdowns
|
||||
.filter((el) => supportedPlatforms.some((platform) => el.classList.contains(platform)))
|
||||
.forEach((el) => {
|
||||
@@ -78,8 +76,8 @@ function showPlatformSpecificContent(platform: string) {
|
||||
// find all platform-specific *inline* elements and hide or show as appropriate
|
||||
// example: <span class="platform-mac">inline content</span>
|
||||
const platforms = Array.from(
|
||||
document.querySelectorAll('.platform-mac, .platform-windows, .platform-linux')
|
||||
) as Array<HTMLElement>
|
||||
document.querySelectorAll<HTMLElement>('.platform-mac, .platform-windows, .platform-linux')
|
||||
)
|
||||
platforms.forEach((el) => {
|
||||
el.style.display = el.classList.contains('platform-' + platform) ? '' : 'none'
|
||||
})
|
||||
@@ -108,11 +106,11 @@ function getDetectedPlatforms(): Array<string> {
|
||||
// find all platform-specific *inline* elements and hide or show as appropriate
|
||||
// example: <span class="platform-mac">inline content</span>
|
||||
const platformEls = Array.from(
|
||||
document.querySelectorAll('.platform-mac, .platform-windows, .platform-linux')
|
||||
) as Array<HTMLElement>
|
||||
document.querySelectorAll<HTMLElement>('.platform-mac, .platform-windows, .platform-linux')
|
||||
)
|
||||
platformEls.forEach((el) => detectPlatforms(el))
|
||||
|
||||
return Array.from(detectedPlatforms) as Array<string>
|
||||
return Array.from(detectedPlatforms)
|
||||
}
|
||||
|
||||
function detectPlatforms(el: HTMLElement) {
|
||||
|
||||
Reference in New Issue
Block a user