diff --git a/package.json b/package.json index d9264d53ba..8f28564b19 100644 --- a/package.json +++ b/package.json @@ -18,9 +18,6 @@ "build-site-for-staging": "PRODUCTION=false OPTIMIZE=true tsx node_modules/@11ty/eleventy/cmd.cjs --config=eleventy.config.ts", "build-site-for-production": "PRODUCTION=true OPTIMIZE=true tsx node_modules/@11ty/eleventy/cmd.cjs --config=eleventy.config.ts" }, - "dependencies": { - "bootstrap-scss": "^4.6.2" - }, "devDependencies": { "@11ty/eleventy": "^3.0.0", "@types/hast": "^3.0.4", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 28f0bb20ca..ec371e1cf7 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -7,10 +7,6 @@ settings: importers: .: - dependencies: - bootstrap-scss: - specifier: ^4.6.2 - version: 4.6.2 devDependencies: '@11ty/eleventy': specifier: ^3.0.0 @@ -763,9 +759,6 @@ packages: boolbase@1.0.0: resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==} - bootstrap-scss@4.6.2: - resolution: {integrity: sha512-emVpCI/S9aeFV1/qqKrztPZLiyow4XfRWLxOAu2SR/67Vau0y6IHNRukQrTx8+OUQ+aVPDhql40eDHSxGoAceA==} - boxen@5.1.2: resolution: {integrity: sha512-9gYgQKXx+1nP8mP7CzFyaUARhg7D3n1dF/FnErWmu9l6JvGpNUN278h0aSb+QjoiKSWG+iZ3uHrcqk0qrY9RQQ==} engines: {node: '>=10'} @@ -3967,8 +3960,6 @@ snapshots: boolbase@1.0.0: {} - bootstrap-scss@4.6.2: {} - boxen@5.1.2: dependencies: ansi-align: 3.0.1 diff --git a/src/_11ty/plugins/highlight.ts b/src/_11ty/plugins/highlight.ts index a2d5e52fe6..89a2a496aa 100644 --- a/src/_11ty/plugins/highlight.ts +++ b/src/_11ty/plugins/highlight.ts @@ -1,4 +1,5 @@ import { getSingletonHighlighter, Highlighter } from 'shiki'; +import dashDarkTheme from '../syntax/dash-dark.js'; import dashLightTheme from '../syntax/dash-light.js'; import MarkdownIt from 'markdown-it'; import * as hast from 'hast'; @@ -17,7 +18,7 @@ const _terminalLanguages = { * copy buttons, etc. * - Syntax highlights the contents according to the specified language * using the shiki package that uses TextMate grammars - * and Code -OSS themes. + * and Code-OSS themes. * * @param markdown The markdown-it instance to configure syntax highlighting for. */ @@ -50,7 +51,7 @@ export async function configureHighlighting(markdown: MarkdownIt): Promise 'csharp', 'cmake', ], - themes: [dashLightTheme], + themes: [dashLightTheme, dashDarkTheme], }); markdown.renderer.rules.fence = function (tokens, index) { @@ -168,7 +169,10 @@ function _highlight( return highlighter.codeToHtml(content, { lang: language, - theme: 'dash-light', + themes: { + light: 'dash-light', + dark: 'dash-dark', + }, transformers: [ { pre(preElement) { diff --git a/src/_11ty/plugins/markdown.ts b/src/_11ty/plugins/markdown.ts index b18a831a80..0db66b8388 100644 --- a/src/_11ty/plugins/markdown.ts +++ b/src/_11ty/plugins/markdown.ts @@ -24,7 +24,7 @@ export const markdown = (() => { assistiveText: title => `Link to '${title}' section`, symbol: '#', class: 'heading-link', - wrapper: ['
', '
'] + wrapper: ['
', '
'] }), }); @@ -100,7 +100,7 @@ function _registerAsides(markdown: MarkdownIt): void { ); _registerAside(markdown, 'tip', 'Tip', 'lightbulb', 'alert-success'); _registerAside(markdown, 'recommend', 'Recommended', 'bolt', 'alert-success'); - _registerAside(markdown, 'important', 'Important', 'error', 'alert-warning'); + _registerAside(markdown, 'important', 'Important', 'error', 'alert-important'); _registerAside( markdown, 'warning', diff --git a/src/_11ty/shortcodes.ts b/src/_11ty/shortcodes.ts index 202917b897..26ed926f8d 100644 --- a/src/_11ty/shortcodes.ts +++ b/src/_11ty/shortcodes.ts @@ -11,7 +11,7 @@ function _setupMedia(eleventyConfig: UserConfig): void { let embedMarkup = `
`; + allowfullscreen loading="lazy">`; if (!skipAlternativeLink) { embedMarkup += `

${title}

`; diff --git a/src/_11ty/syntax/dash-dark.ts b/src/_11ty/syntax/dash-dark.ts new file mode 100644 index 0000000000..f0ee6c0a6c --- /dev/null +++ b/src/_11ty/syntax/dash-dark.ts @@ -0,0 +1,140 @@ +// This is the dark mode version of the +// syntax highlighting theme for code blocks on the website. +// It's imported and used by `src/_11ty/plugins/highlight.js`. +export default { + name: 'dash-dark', + colors: { + 'editor.background': '#1D2026', + 'editor.foreground': '#C2C6D6', + }, + tokenColors: [ + { + settings: { + background: '#1D2026', + foreground: '#C2C6D6', + }, + }, + { + scope: 'emphasis', + settings: { + fontStyle: 'italic', + }, + }, + { + scope: 'strong', + settings: { + fontStyle: 'bold', + }, + }, + { + scope: [ + 'punctuation', + 'punctuation.separator.inheritance-clause', + 'storage.modifier.package.java', + ], + settings: { + foreground: '#C2C6D6', + }, + }, + { + scope: ['comment', 'punctuation.definition.comment'], + settings: { + foreground: '#8B95A7', + }, + }, + { + scope: 'constant', + settings: { + foreground: '#1CDAC5', + }, + }, + { + scope: [ + 'keyword', + 'storage.modifier', + 'storage.type', + 'variable.language', + ], + settings: { + foreground: '#FF897E', + }, + }, + { + scope: [ + 'keyword.operator', + 'string.interpolated.expression', + 'constant.character.escape', + ], + settings: { + foreground: '#E1E2EC', + }, + }, + { + scope: ['string', 'string.interpolated', 'punctuation.definition.string'], + settings: { + foreground: '#1CDAC5', + }, + }, + { + scope: [ + 'entity.name.function', + 'support.function', + 'entity.other.attribute-name', + ], + settings: { + foreground: '#B581FF', + }, + }, + { + scope: [ + 'entity.name.class', + 'entity.name.type', + 'entity.name.type.class', + 'entity.name.type.enum', + 'entity.name.type.protocol', + 'support.class', + 'support.type', + 'entity.name.tag', + ], + settings: { + foreground: '#1A86FF', + }, + }, + { + scope: ['variable', 'variable.other'], + settings: { + foreground: '#E1E2EC', + }, + }, + { + scope: 'markup.underline', + settings: { + fontStyle: 'underline', + }, + }, + { + scope: 'markup.bold', + settings: { + fontStyle: 'bold', + }, + }, + { + scope: 'markup.heading', + settings: { + fontStyle: 'bold', + }, + }, + { + scope: 'markup.italic', + settings: { + fontStyle: 'italic', + }, + }, + { + scope: 'markup.strikethrough', + settings: { + fontStyle: 'strikethrough', + }, + }, + ], +}; diff --git a/src/_11ty/syntax/dash-light.ts b/src/_11ty/syntax/dash-light.ts index 204c3d0340..6226f53ef3 100644 --- a/src/_11ty/syntax/dash-light.ts +++ b/src/_11ty/syntax/dash-light.ts @@ -4,14 +4,14 @@ export default { name: 'dash-light', colors: { - 'editor.background': '#F8F9FA', - 'editor.foreground': '#222222', + 'editor.background': '#ECEDF7', + 'editor.foreground': '#191C22', }, tokenColors: [ { settings: { - background: '#F8F9FA', - foreground: '#222222', + background: '#ECEDF7', + foreground: '#191C22', }, }, { @@ -33,19 +33,19 @@ export default { 'storage.modifier.package.java', ], settings: { - foreground: '#222222', + foreground: '#191C22', }, }, { scope: ['comment', 'punctuation.definition.comment'], settings: { - foreground: '#6E6E70', + foreground: '#59616E', }, }, { scope: 'constant', settings: { - foreground: '#0c7064', + foreground: '#0C7064', }, }, { @@ -56,7 +56,7 @@ export default { 'variable.language', ], settings: { - foreground: '#bd2314', + foreground: '#BD2314', }, }, { @@ -66,13 +66,13 @@ export default { 'constant.character.escape', ], settings: { - foreground: '#222222', + foreground: '#191C22', }, }, { scope: ['string', 'string.interpolated', 'punctuation.definition.string'], settings: { - foreground: '#0c7064', + foreground: '#0C7064', }, }, { @@ -97,13 +97,13 @@ export default { 'entity.name.tag', ], settings: { - foreground: '#0468D7', + foreground: '#146BCD', }, }, { scope: ['variable', 'variable.other'], settings: { - foreground: '#222222', + foreground: '#191C22', }, }, { diff --git a/src/_includes/banner.html b/src/_includes/banner.html index 13ef82f9e6..9bc3a58d23 100644 --- a/src/_includes/banner.html +++ b/src/_includes/banner.html @@ -1,9 +1,6 @@ {% comment %} For headings use h3 elements. {% endcomment -%} - - +Celebrating Flutter's production era! +Learn more
+Also, check out What's new on the website. diff --git a/src/_includes/breadcrumbs.html b/src/_includes/breadcrumbs.html index eecf919213..9fb4b859df 100644 --- a/src/_includes/breadcrumbs.html +++ b/src/_includes/breadcrumbs.html @@ -17,7 +17,7 @@
  • - + {{crumb.title}} diff --git a/src/_includes/cookie-notice.html b/src/_includes/cookie-notice.html index 27275c27c6..0c7646db60 100644 --- a/src/_includes/cookie-notice.html +++ b/src/_includes/cookie-notice.html @@ -1,9 +1,7 @@ diff --git a/src/_includes/docs/catalog-page-material.md b/src/_includes/docs/catalog-page-material.md index 8df5a208b3..76eee2b58b 100644 --- a/src/_includes/docs/catalog-page-material.md +++ b/src/_includes/docs/catalog-page-material.md @@ -11,15 +11,15 @@ {% for comp in components -%}
    -
    - Rendered example of the {{comp.name}} Material widget. -
    +
    +
    + Rendered example of the {{comp.name}} Material widget.
    -
    {{comp.name}}
     +
    {{comp.name}}

    {{ comp.description | truncatewords: 25 }}

    diff --git a/src/_includes/docs/code-and-image.md b/src/_includes/docs/code-and-image.md index 014661a8ef..b6940b3b22 100644 --- a/src/_includes/docs/code-and-image.md +++ b/src/_includes/docs/code-and-image.md @@ -12,19 +12,17 @@ {% endif -%} -
    -
    -
    - {{code}} -
    -
    - {{alt}} - {% if caption -%} -
    - {{caption}} -
    - {% endif -%} -
    +
    +
    + {{code}} +
    +
    + {{alt}} + {% if caption -%} +
    + {{caption}} +
    + {% endif -%}
    diff --git a/src/_includes/docs/install/deprecated/get-sdk-linux.md b/src/_includes/docs/install/deprecated/get-sdk-linux.md index f4961371d5..9d1babc72d 100644 --- a/src/_includes/docs/install/deprecated/get-sdk-linux.md +++ b/src/_includes/docs/install/deprecated/get-sdk-linux.md @@ -35,7 +35,7 @@ If you aren't using `snapd`, follow these steps to install Flutter. 1. Download the installation bundle for the latest {{site.sdk.channel}} release of the Flutter SDK: - [(loading...)](#){:.download-latest-link-{{os}} .btn .btn-primary} + [(loading...)](#){:.download-latest-link-{{os}} .filled-button} You can find older builds and other release channels in the [SDK archive][]. diff --git a/src/_includes/docs/install/deprecated/get-sdk-mac.md b/src/_includes/docs/install/deprecated/get-sdk-mac.md index c0b4c2f2b1..c6488c017b 100644 --- a/src/_includes/docs/install/deprecated/get-sdk-mac.md +++ b/src/_includes/docs/install/deprecated/get-sdk-mac.md @@ -7,7 +7,7 @@ |Intel | | Apple Silicon | |------| | ---------------| - |[(loading...)](#){:.download-latest-link-{{os}} .btn .btn-primary} | | [(loading...)](#){:.download-latest-link-{{os}}-arm64 .apple-silicon .btn .btn-primary} | + |[(loading...)](#){:.download-latest-link-{{os}} .filled-button} | | [(loading...)](#){:.download-latest-link-{{os}}-arm64 .apple-silicon .filled-button} |
    For other release channels, and older builds, diff --git a/src/_includes/docs/install/deprecated/get-sdk-win.md b/src/_includes/docs/install/deprecated/get-sdk-win.md index 1aa91d5f1d..caba1678f7 100644 --- a/src/_includes/docs/install/deprecated/get-sdk-win.md +++ b/src/_includes/docs/install/deprecated/get-sdk-win.md @@ -7,7 +7,7 @@ 1. Download the following installation bundle to get the latest {{site.sdk.channel}} release of the Flutter SDK: - [(loading...)](#){:.download-latest-link-{{os}} .btn .btn-primary} + [(loading...)](#){:.download-latest-link-{{os}} .filled-button} For other release channels, and older builds, check out the [SDK archive][]. diff --git a/src/_includes/docs/install/flutter/download.md b/src/_includes/docs/install/flutter/download.md index ec1dc36787..3127240530 100644 --- a/src/_includes/docs/install/flutter/download.md +++ b/src/_includes/docs/install/flutter/download.md @@ -57,13 +57,13 @@ then extract the SDK. {% if include.os=='macOS' %} - | Intel Processor | Apple Silicon | - |---------------------------------------------------------------------|-------------------------------------------------------------------------------------------| - | [(loading...)](#){:.download-latest-link-{{osl}} .btn .btn-primary} | [(loading...)](#){:.download-latest-link-{{osl}}-arm64 .apple-silicon .btn .btn-primary} | + | Intel Processor | Apple Silicon | + |------------------------------------------------------------------|---------------------------------------------------------------------------------------| + | [(loading...)](#){:.download-latest-link-{{osl}} .filled-button} | [(loading...)](#){:.download-latest-link-{{osl}}-arm64 .apple-silicon .filled-button} | {% else %} - [(loading...)](#){:.download-latest-link-{{osl}} .btn .btn-primary} + [(loading...)](#){:.download-latest-link-{{osl}} .filled-button} {% endif -%} diff --git a/src/_includes/footer.html b/src/_includes/footer.html deleted file mode 100644 index 3520b8f674..0000000000 --- a/src/_includes/footer.html +++ /dev/null @@ -1,29 +0,0 @@ - diff --git a/src/_includes/header.html b/src/_includes/header.html index 9e104de113..7a86ff93a2 100644 --- a/src/_includes/header.html +++ b/src/_includes/header.html @@ -1,158 +1,92 @@ -{% assign route = page.url|regex_replace:'/index$|/index\.html$|\.html$|/$' %} - -
    - +
    diff --git a/src/_includes/inline-toc.html b/src/_includes/inline-toc.html deleted file mode 100644 index 0827b05ac4..0000000000 --- a/src/_includes/inline-toc.html +++ /dev/null @@ -1,40 +0,0 @@ -{% assign itemCount = tocContents.count %} -{% if itemCount > 1 %} -{% if itemCount > 10 %} -{% assign collapsible = true %} -{% endif -%} - -{% if collapsible %} -{% assign topStyle = ' toc-collapsible toc-collapsed' %} -{% else %} -{% assign topStyle = '' %} -{% endif -%} -
    -
    - Contents - {% if collapsible %} - - - {% endif -%} -
    -
      - {% for topLevel in tocContents.toc %} -
    • - {{topLevel.text}} - {% if topLevel.children and topLevel.children.size > 0 %} -
        - {% for child in topLevel.children %} -
      • - {{child.text}} -
        • - {% endfor -%} -
      - {% endif -%} -
      • - {% endfor -%} -
    - {% if collapsible %} - - {% endif -%} -
    -{% endif -%} diff --git a/src/_includes/next-prev-nav.html b/src/_includes/next-prev-nav.html index 192044a050..8876c85db9 100644 --- a/src/_includes/next-prev-nav.html +++ b/src/_includes/next-prev-nav.html @@ -1,21 +1,27 @@ -{% if include.next or include.prev -%} - {% if include.next and include.prev -%} +{% if next or prev -%} + {% if next and prev -%} {% assign nav_class = 'site-nextprev-nav' -%} {% else -%} {% assign nav_class = 'site-nextprev-nav__single' -%} {% endif -%} - diff --git a/src/_includes/sidenav-level-1.html b/src/_includes/sidenav-level-1.html index 8d234f7767..7966d7cb9f 100644 --- a/src/_includes/sidenav-level-1.html +++ b/src/_includes/sidenav-level-1.html @@ -4,7 +4,7 @@