diff --git a/boostlook_tino.css b/boostlook_tino.css deleted file mode 100644 index be91966..0000000 --- a/boostlook_tino.css +++ /dev/null @@ -1,4119 +0,0 @@ -/** - * Boost Look CSS Framework - * Version: 1.0.0 - * Description: A comprehensive CSS framework for styling Boost C++ Library documentation - * Author: Boost C++ Libraries - * License: BSL-1.0 - */ - -/** - * File Structure Overview: - * 1. Root Variables (Light/Dark themes) - * 2. HTML Variables - * 3. Font-Face Declarations - * 4. CSS Reset - * 5. Global Styles for .boostlook - * 6. Styling for Scrollbar Display - * 7. AsciiDoctor-specific Styles - * 8. Antora Templates Styles - * 9. Quickbook Documentation Styles - * 10. Library README Styles - */ - -/** - * Template Structure: - * The framework supports these main documentation templates: - * - * 1. AsciiDoctor Template: - * example: https://www.boost.io/doc/libs/1_87_0/libs/charconv/doc/html/charconv.html - *
- *
- *

Title

- *
- * - *
    TOC Links
- *
- *
- *
- *
Content Sections
- *
- * - *
- * - * 2. Antora Template: - * example: https://www.boost.io/doc/libs/1_87_0/doc/antora/url/index.html - *
- * - *
- *
- *
Breadcrumbs and Spirit Nav
- *

Title

- *
Content Sections
- *
- *
- * - *
- * - * 3. Quickbook Template: - * example: https://www.boost.io/doc/libs/1_87_0/doc/html/accumulators.html - *
- *
Navigation
- *
- *
Title and information
- *
Table of Contents
- *
Footer
- *
- *
- * - * 4. README Template: - * example: https://www.boost.io/library/1.87.0/beast/ - *
ReadMe Content
- */ - -/** - * Design Philosophy: - * - Consistent styling across different documentation templates - * - Responsive design with mobile-first approach - * - Dark/Light theme support - * - Accessible typography and color schemes - * - Modern scrolling and navigation experience - */ - -/** - * Framework Selector Conventions - * - * The framework uses the following selector prefixes: - * - * 1. .boostlook - * - Primary selector for cross-template styles - * - Applies to all documentation formats - * - Used for common components and layouts - * - * 2. .boostlook:not(:has(.doc)), - * .boostlook#boost-legacy-docs-wrapper - (DEPRECATED), - * .boostlook#antora-template-wrapper, - * div.source-docs-antora.boostlook:not(:has(>.boostlook)) - (Fallback) - * - Specific to legacy Quickbook templates - * - Maintains backward compatibility - * - Handles specialized Quickbook formatting - * - * 3. .boostlook#libraryReadMe - * - Dedicated to README template styling - * - Optimized for library documentation - * - Ensures consistent README presentation - */ - -/*----------------- Root Variables - Start -----------------*/ - -/* Root CSS Variables - * Defines core design tokens used throughout the framework. - * Organized into: - * 1. General Variables - Global settings used across themes - * 2. Color System - Comprehensive color palette including brand, state, and UI colors - * 3. Typography - Font sizes, line heights, and text styling variables - * 4. Spacing System - Padding, margins, and layout spacing tokens - * 5. Icons - SVG icon definitions for light and dark themes - * 6. Responsive Design - Mobile-first breakpoint variables - */ - -:root { - /* General Variables - Core design tokens for all themes */ - --bl-primary-color: rgb(255, 159, 0); /* Boost's signature orange color */ - - /*----------------- New Look Variables Start -----------------*/ - /* New Look Primitives */ - /* Colors Shades of Grey */ - --colors-neutral-0: #ffffff; - --colors-neutral-50: #f5f6f8; - --colors-neutral-100: #e4e7ea; - --colors-neutral-200: #c7cccf; - --colors-neutral-300: #afb3b6; - --colors-neutral-400: #949a9e; - --colors-neutral-500: #798086; - --colors-neutral-600: #62676b; - --colors-neutral-700: #494d50; - --colors-neutral-800: #393b3f; - --colors-neutral-900: #18191b; - --colors-neutral-950: #0d0e0f; - - /* Colors Brand Shades */ - --colors-brand-orange-50: #fbf2e6; - --colors-brand-orange-100: #ffeaca; - --colors-brand-orange-200: #ffd897; - --colors-brand-orange-300: #ffc364; - --colors-brand-orange-400: #ffb030; - --colors-brand-orange-500: #ff9f00; - --colors-brand-orange-600: #cd7e00; - --colors-brand-orange-700: #9b5f00; - --colors-brand-orange-800: #694000; - --colors-brand-orange-900: #352000; - --colors-brand-orange-950: #1e1200; - - /* Colors Negative Shades */ - --colors-negative-100: #ffe6ea; - --colors-negative-200: #ffcad2; - --colors-negative-300: #fe9aab; - --colors-negative-400: #f9677f; - --colors-negative-500: #eb3856; - --colors-negative-600: #bc233c; - --colors-negative-700: #8d1529; - --colors-negative-800: #600d1b; - --colors-negative-900: #39070f; - --colors-negative-950: #1d0408; - - /* Colors Positive Shades */ - --colors-positive-100: #def7eb; - --colors-positive-200: #bdeed6; - --colors-positive-300: #9ce6c2; - --colors-positive-400: #7bddad; - --colors-positive-500: #5ad599; - --colors-positive-600: #48ac7b; - --colors-positive-700: #36825d; - --colors-positive-800: #255940; - --colors-positive-850: #1c4431; - --colors-positive-900: #132f22; - --colors-positive-950: #0a1b13; - - /* Colors Warning Shades */ - --colors-warning-100: #ffefe2; - --colors-warning-200: #ffd4b3; - --colors-warning-300: #feb780; - --colors-warning-400: #ff9442; - --colors-warning-500: #fd760f; - --colors-warning-600: #c25909; - --colors-warning-700: #914104; - --colors-warning-800: #5d2a02; - --colors-warning-900: #341700; - --colors-warning-950: #1f0e01; - - /* Colors Blue Shades */ - --colors-blue-50: #daeef9; - --colors-blue-100: #c2e2f4; - --colors-blue-200: #92cbe9; - --colors-blue-300: #62b3dd; - --colors-blue-400: #329cd2; - --colors-blue-500: #0284c7; - --colors-blue-600: #026a9f; - --colors-blue-700: #014f77; - --colors-blue-800: #013550; - --colors-blue-850: #01283c; - --colors-blue-900: #001a28; - --colors-blue-950: #000d14; - - /* Colors Code Syntax Pallette */ - --colors-code-colors-red: var(--colors-negative-400); - --colors-code-colors-green: var(--colors-positive-500); - --colors-code-colors-blue: var(--colors-blue-300); - --colors-code-colors-black: var(--colors-neutral-950); - --colors-code-colors-yellow: #ebc419; - --colors-code-colors-purple: #b350ed; - --colors-code-colors-turquoise: #67eaf9; - --colors-code-colors-white: var(--colors-neutral-0); - --colors-code-colors-red-contrast: var(--colors-negative-500); - --colors-code-colors-green-contrast: var(--colors-positive-600); - --colors-code-colors-blue-contrast: var(--colors-blue-400); - --colors-code-colors-yellow-contrast: #d7a200; - --colors-code-colors-purple-contrast: #9f26e5; - --colors-code-colors-turquoise-contrast: #0dc4d5; - --colors-code-colors-navy: #5469f7; - --colors-code-colors-navy-contrast: #162ec6; - - /* Colors Other */ - --colors-neutral-150: #d5d7d9; - --colors-neutral-850: #2a2c30; - --colors-overlay-overlay-white-40: rgba(255 255 255 / 0.40); - --colors-overlay-overlay-black-40: rgba(13 14 15 / 0.40); - --colors-overlay-overlay-white-64: rgba(255 255 255 / 0.64); - --colors-overlay-overlay-black-64: rgba(13 14 15 / 0.64); - --colors-overlay-overlay-white-88: rgba(255 255 255 / 0.88); - --colors-overlay-overlay-black-88: rgba(13 14 15 / 0.88); - - /* Spacings And Sizes */ - --spacing-size-size-0: 0rem; - --spacing-size-4xs: 0.125rem; - --spacing-size-3xs: 0.25rem; - --spacing-size-2xs: 0.5rem; - --spacing-size-xs: 0.75rem; - --spacing-size-sm: 1rem; - --spacing-size-md: 1.125rem; - --spacing-size-lg: 1.5rem; - --spacing-size-xl: 2rem; - --spacing-size-2xl: 2.5rem; - --spacing-size-3xl: 3rem; - --main-container: 90rem; - - /* New Look Typography */ - --font-family-code: "Noto Sans Mono"; - --font-size-3xs: 0.625rem; - --font-size-2xs: 0.75rem; - --font-size-xs: 0.875rem; - --font-size-sm: 1rem; - --font-size-md: 1.125rem; - --font-size-lg: 1.25rem; - --font-size-xl: 1.5rem; - --font-size-2xl: 1.75rem; - --font-size-3xl: 2rem; - --font-size-4xl: 2.5rem; - --font-line-height-xs: 0.75rem; - --font-line-height-sm: 1rem; - --font-line-height-md: 1.25rem; - --font-line-height-lg: 1.5rem; - --font-line-height-xl: 1.75rem; - --font-line-height-2xl: 2rem; - --font-line-height-3xl: 2.5rem; - --font-line-height-4xl: 3rem; - - /* New Look Icons */ - /* Themed Headings Anchor Icon */ - --icon-anchor-light: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%3E%3Cg%20clip-path%3D%22url(%23clip0_618_10452)%22%3E%3Cpath%20d%3D%22M13.2084%202.77855C11.8904%201.46053%209.75343%201.46053%208.43541%202.77855L6.31409%204.89987L5.4302%204.01599L7.55152%201.89467C9.3577%200.0884953%2012.2861%200.0884955%2014.0923%201.89467C15.8984%203.70085%2015.8984%206.62923%2014.0923%208.43541L11.9709%2010.5567L11.0871%209.67284L13.2084%207.55152C14.5264%206.2335%2014.5264%204.09657%2013.2084%202.77855Z%22%20fill%3D%22%2318191B%22%2F%3E%3Cpath%20d%3D%22M2.77855%2013.2084C4.09657%2014.5264%206.23351%2014.5264%207.55153%2013.2084L9.67285%2011.0871L10.5567%2011.9709L8.43541%2014.0923C6.62923%2015.8984%203.70085%2015.8984%201.89467%2014.0923C0.0884953%2012.2861%200.0884953%209.3577%201.89467%207.55152L4.01599%205.4302L4.89987%206.31409L2.77855%208.43541C1.46053%209.75343%201.46053%2011.8904%202.77855%2013.2084Z%22%20fill%3D%22%2318191B%22%2F%3E%3Cpath%20d%3D%22M10.5567%206.31409C10.8008%206.07001%2010.8008%205.67428%2010.5567%205.4302C10.3126%205.18613%209.91692%205.18613%209.67284%205.4302L5.4302%209.67284C5.18613%209.91692%205.18613%2010.3127%205.4302%2010.5567C5.67428%2010.8008%206.07001%2010.8008%206.31409%2010.5567L10.5567%206.31409Z%22%20fill%3D%22%2318191B%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_618_10452%22%3E%3Crect%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); - --icon-anchor-dark: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%3E%3Cg%20clip-path%3D%22url(%23clip0_618_7189)%22%3E%3Cpath%20d%3D%22M13.2084%202.77855C11.8904%201.46053%209.75343%201.46053%208.43541%202.77855L6.31409%204.89987L5.4302%204.01599L7.55152%201.89467C9.3577%200.0884953%2012.2861%200.0884955%2014.0923%201.89467C15.8984%203.70085%2015.8984%206.62923%2014.0923%208.43541L11.9709%2010.5567L11.0871%209.67284L13.2084%207.55152C14.5264%206.2335%2014.5264%204.09657%2013.2084%202.77855Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M2.77855%2013.2084C4.09657%2014.5264%206.23351%2014.5264%207.55153%2013.2084L9.67285%2011.0871L10.5567%2011.9709L8.43541%2014.0923C6.62923%2015.8984%203.70085%2015.8984%201.89467%2014.0923C0.0884953%2012.2861%200.0884953%209.3577%201.89467%207.55152L4.01599%205.4302L4.89987%206.31409L2.77855%208.43541C1.46053%209.75343%201.46053%2011.8904%202.77855%2013.2084Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M10.5567%206.31409C10.8008%206.07001%2010.8008%205.67428%2010.5567%205.4302C10.3126%205.18613%209.91692%205.18613%209.67284%205.4302L5.4302%209.67284C5.18613%209.91692%205.18613%2010.3127%205.4302%2010.5567C5.67428%2010.8008%206.07001%2010.8008%206.31409%2010.5567L10.5567%206.31409Z%22%20fill%3D%22white%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_618_7189%22%3E%3Crect%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); - - /* Themed Left Arrow Icon */ - --icon-arrow-left-light: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M12.5303%204.46967C12.8232%204.76256%2012.8232%205.23744%2012.5303%205.53033L6.81066%2011.25H19C19.4142%2011.25%2019.75%2011.5858%2019.75%2012C19.75%2012.4142%2019.4142%2012.75%2019%2012.75H6.81066L12.5303%2018.4697C12.8232%2018.7626%2012.8232%2019.2374%2012.5303%2019.5303C12.2374%2019.8232%2011.7626%2019.8232%2011.4697%2019.5303L4.46967%2012.5303C4.17678%2012.2374%204.17678%2011.7626%204.46967%2011.4697L11.4697%204.46967C11.7626%204.17678%2012.2374%204.17678%2012.5303%204.46967Z%22%20fill%3D%22%2318191B%22%2F%3E%3C%2Fsvg%3E"); - --icon-arrow-left-dark: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M12.5303%204.46967C12.8232%204.76256%2012.8232%205.23744%2012.5303%205.53033L6.81066%2011.25H19C19.4142%2011.25%2019.75%2011.5858%2019.75%2012C19.75%2012.4142%2019.4142%2012.75%2019%2012.75H6.81066L12.5303%2018.4697C12.8232%2018.7626%2012.8232%2019.2374%2012.5303%2019.5303C12.2374%2019.8232%2011.7626%2019.8232%2011.4697%2019.5303L4.46967%2012.5303C4.17678%2012.2374%204.17678%2011.7626%204.46967%2011.4697L11.4697%204.46967C11.7626%204.17678%2012.2374%204.17678%2012.5303%204.46967Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); - - /* Themed Right Arrow Icon */ - --icon-arrow-right-light: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M11.4697%204.46967C11.7626%204.17678%2012.2374%204.17678%2012.5303%204.46967L19.5303%2011.4697C19.8232%2011.7626%2019.8232%2012.2374%2019.5303%2012.5303L12.5303%2019.5303C12.2374%2019.8232%2011.7626%2019.8232%2011.4697%2019.5303C11.1768%2019.2374%2011.1768%2018.7626%2011.4697%2018.4697L17.1893%2012.75H5C4.58579%2012.75%204.25%2012.4142%204.25%2012C4.25%2011.5858%204.58579%2011.25%205%2011.25H17.1893L11.4697%205.53033C11.1768%205.23744%2011.1768%204.76256%2011.4697%204.46967Z%22%20fill%3D%22%2318191B%22%2F%3E%3C%2Fsvg%3E"); - --icon-arrow-right-dark: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M11.4697%204.46967C11.7626%204.17678%2012.2374%204.17678%2012.5303%204.46967L19.5303%2011.4697C19.8232%2011.7626%2019.8232%2012.2374%2019.5303%2012.5303L12.5303%2019.5303C12.2374%2019.8232%2011.7626%2019.8232%2011.4697%2019.5303C11.1768%2019.2374%2011.1768%2018.7626%2011.4697%2018.4697L17.1893%2012.75H5C4.58579%2012.75%204.25%2012.4142%204.25%2012C4.25%2011.5858%204.58579%2011.25%205%2011.25H17.1893L11.4697%205.53033C11.1768%205.23744%2011.1768%204.76256%2011.4697%204.46967Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); - - /* Themed Up Arrow Icon */ - --icon-arrow-up-light: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M19.5303%2012.5303C19.2374%2012.8232%2018.7626%2012.8232%2018.4697%2012.5303L12.75%206.81066L12.75%2019C12.75%2019.4142%2012.4142%2019.75%2012%2019.75C11.5858%2019.75%2011.25%2019.4142%2011.25%2019L11.25%206.81066L5.53033%2012.5303C5.23744%2012.8232%204.76256%2012.8232%204.46967%2012.5303C4.17678%2012.2374%204.17678%2011.7626%204.46967%2011.4697L11.4697%204.46967C11.7626%204.17678%2012.2374%204.17678%2012.5303%204.46967L19.5303%2011.4697C19.8232%2011.7626%2019.8232%2012.2374%2019.5303%2012.5303Z%22%20fill%3D%22%2318191B%22%2F%3E%3C%2Fsvg%3E"); - --icon-arrow-up-dark: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M19.5303%2012.5303C19.2374%2012.8232%2018.7626%2012.8232%2018.4697%2012.5303L12.75%206.81066L12.75%2019C12.75%2019.4142%2012.4142%2019.75%2012%2019.75C11.5858%2019.75%2011.25%2019.4142%2011.25%2019L11.25%206.81066L5.53033%2012.5303C5.23744%2012.8232%204.76256%2012.8232%204.46967%2012.5303C4.17678%2012.2374%204.17678%2011.7626%204.46967%2011.4697L11.4697%204.46967C11.7626%204.17678%2012.2374%204.17678%2012.5303%204.46967L19.5303%2011.4697C19.8232%2011.7626%2019.8232%2012.2374%2019.5303%2012.5303Z%22%20fill%3D%22%23FFFFFF%22%2F%3E%3C%2Fsvg%3E"); - - /* Themed Clipboard Icon */ - --icon-clipboard-light: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M4.8%203.75C4.52152%203.75%204.25445%203.86062%204.05754%204.05754C3.86062%204.25445%203.75%204.52152%203.75%204.8V12.9C3.75%2013.1785%203.86062%2013.4455%204.05754%2013.6425C4.25445%2013.8394%204.52152%2013.95%204.8%2013.95H5.7C6.11421%2013.95%206.45%2014.2858%206.45%2014.7C6.45%2015.1142%206.11421%2015.45%205.7%2015.45H4.8C4.1237%2015.45%203.4751%2015.1813%202.99688%2014.7031C2.51866%2014.2249%202.25%2013.5763%202.25%2012.9V4.8C2.25%204.1237%202.51866%203.4751%202.99688%202.99688C3.4751%202.51866%204.1237%202.25%204.8%202.25H12.9C13.5763%202.25%2014.2249%202.51866%2014.7031%202.99688C15.1813%203.4751%2015.45%204.1237%2015.45%204.8V5.7C15.45%206.11421%2015.1142%206.45%2014.7%206.45C14.2858%206.45%2013.95%206.11421%2013.95%205.7V4.8C13.95%204.52152%2013.8394%204.25445%2013.6425%204.05754C13.4455%203.86062%2013.1785%203.75%2012.9%203.75H4.8ZM11.1%2010.05C10.5201%2010.05%2010.05%2010.5201%2010.05%2011.1V19.2C10.05%2019.7799%2010.5201%2020.25%2011.1%2020.25H19.2C19.7799%2020.25%2020.25%2019.7799%2020.25%2019.2V11.1C20.25%2010.5201%2019.7799%2010.05%2019.2%2010.05H11.1ZM8.55%2011.1C8.55%209.69167%209.69167%208.55%2011.1%208.55H19.2C20.6083%208.55%2021.75%209.69167%2021.75%2011.1V19.2C21.75%2020.6083%2020.6083%2021.75%2019.2%2021.75H11.1C9.69167%2021.75%208.55%2020.6083%208.55%2019.2V11.1Z%22%20fill%3D%22%2318191B%22%2F%3E%3C%2Fsvg%3E"); - --icon-clipboard-dark: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M4.8%203.75C4.52152%203.75%204.25445%203.86062%204.05754%204.05754C3.86062%204.25445%203.75%204.52152%203.75%204.8V12.9C3.75%2013.1785%203.86062%2013.4455%204.05754%2013.6425C4.25445%2013.8394%204.52152%2013.95%204.8%2013.95H5.7C6.11421%2013.95%206.45%2014.2858%206.45%2014.7C6.45%2015.1142%206.11421%2015.45%205.7%2015.45H4.8C4.1237%2015.45%203.4751%2015.1813%202.99688%2014.7031C2.51866%2014.2249%202.25%2013.5763%202.25%2012.9V4.8C2.25%204.1237%202.51866%203.4751%202.99688%202.99688C3.4751%202.51866%204.1237%202.25%204.8%202.25H12.9C13.5763%202.25%2014.2249%202.51866%2014.7031%202.99688C15.1813%203.4751%2015.45%204.1237%2015.45%204.8V5.7C15.45%206.11421%2015.1142%206.45%2014.7%206.45C14.2858%206.45%2013.95%206.11421%2013.95%205.7V4.8C13.95%204.52152%2013.8394%204.25445%2013.6425%204.05754C13.4455%203.86062%2013.1785%203.75%2012.9%203.75H4.8ZM11.1%2010.05C10.5201%2010.05%2010.05%2010.5201%2010.05%2011.1V19.2C10.05%2019.7799%2010.5201%2020.25%2011.1%2020.25H19.2C19.7799%2020.25%2020.25%2019.7799%2020.25%2019.2V11.1C20.25%2010.5201%2019.7799%2010.05%2019.2%2010.05H11.1ZM8.55%2011.1C8.55%209.69167%209.69167%208.55%2011.1%208.55H19.2C20.6083%208.55%2021.75%209.69167%2021.75%2011.1V19.2C21.75%2020.6083%2020.6083%2021.75%2019.2%2021.75H11.1C9.69167%2021.75%208.55%2020.6083%208.55%2019.2V11.1Z%22%20fill%3D%22%23FFFFFF%22%2F%3E%3C%2Fsvg%3E"); - - /* Themed Home Icon */ - --icon-home-light: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M10.1192%203.23498C11.177%202.24329%2012.823%202.24329%2013.8808%203.23498L19.8808%208.85998C20.4354%209.37986%2020.75%2010.1061%2020.75%2010.8662V18.9997C20.75%2019.9662%2019.9665%2020.7497%2019%2020.7497H15C14.5858%2020.7497%2014.25%2020.414%2014.25%2019.9997V15.9998C14.25%2015.8617%2014.1381%2015.7498%2014%2015.7498H10C9.86193%2015.7498%209.75%2015.8617%209.75%2015.9998V19.9997C9.75%2020.414%209.41421%2020.7497%209%2020.7497H5C4.0335%2020.7497%203.25%2019.9662%203.25%2018.9997V10.8662C3.25%2010.1061%203.56462%209.37986%204.11916%208.85998L10.1192%203.23498ZM12.8549%204.32929C12.3741%203.87852%2011.6259%203.87852%2011.1451%204.32929L5.14507%209.95429C4.89301%2010.1906%204.75%2010.5207%204.75%2010.8662V18.9997C4.75%2019.1378%204.86193%2019.2497%205%2019.2497H8.25V15.9998C8.25%2015.0333%209.0335%2014.2498%2010%2014.2498H14C14.9665%2014.2498%2015.75%2015.0333%2015.75%2015.9998V19.2497H19C19.1381%2019.2497%2019.25%2019.1378%2019.25%2018.9997V10.8662C19.25%2010.5207%2019.107%2010.1906%2018.8549%209.95429L12.8549%204.32929Z%22%20fill%3D%22%2318191B%22%2F%3E%3C%2Fsvg%3E"); - --icon-home-dark: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M10.1192%203.23523C11.177%202.24353%2012.823%202.24353%2013.8808%203.23523L19.8808%208.86023C20.4354%209.38011%2020.75%2010.1063%2020.75%2010.8665V19C20.75%2019.9665%2019.9665%2020.75%2019%2020.75H15C14.5858%2020.75%2014.25%2020.4142%2014.25%2020V16C14.25%2015.8619%2014.1381%2015.75%2014%2015.75H10C9.86193%2015.75%209.75%2015.8619%209.75%2016V20C9.75%2020.4142%209.41421%2020.75%209%2020.75H5C4.0335%2020.75%203.25%2019.9665%203.25%2019V10.8665C3.25%2010.1063%203.56462%209.38011%204.11916%208.86023L10.1192%203.23523ZM12.8549%204.32953C12.3741%203.87876%2011.6259%203.87876%2011.1451%204.32953L5.14507%209.95453C4.89301%2010.1908%204.75%2010.5209%204.75%2010.8665V19C4.75%2019.1381%204.86193%2019.25%205%2019.25H8.25V16C8.25%2015.0335%209.0335%2014.25%2010%2014.25H14C14.9665%2014.25%2015.75%2015.0335%2015.75%2016V19.25H19C19.1381%2019.25%2019.25%2019.1381%2019.25%2019V10.8665C19.25%2010.5209%2019.107%2010.1908%2018.8549%209.95453L12.8549%204.32953Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); - - /* Themed File Icon */ - --icon-file-light: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M5%2011.5H10V10.5H5V11.5Z%22%20fill%3D%22%2362676B%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M4%201.5C3.17157%201.5%202.5%202.17157%202.5%203V13C2.5%2013.8284%203.17157%2014.5%204%2014.5H12C12.8284%2014.5%2013.5%2013.8284%2013.5%2013V6.41421C13.5%206.01639%2013.342%205.63486%2013.0607%205.35355L9.64645%201.93934C9.36514%201.65803%208.98361%201.5%208.58579%201.5H4ZM3.5%203C3.5%202.72386%203.72386%202.5%204%202.5H8.58579C8.71839%202.5%208.84557%202.55268%208.93934%202.64645L12.3536%206.06066C12.4473%206.15443%2012.5%206.28161%2012.5%206.41421V13C12.5%2013.2761%2012.2761%2013.5%2012%2013.5H4C3.72386%2013.5%203.5%2013.2761%203.5%2013V3Z%22%20fill%3D%22%2362676B%22%2F%3E%3C%2Fsvg%3E"); - --icon-file-dark: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M5%2011.5H10V10.5H5V11.5Z%22%20fill%3D%22%23949A9E%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M4%201.5C3.17157%201.5%202.5%202.17157%202.5%203V13C2.5%2013.8284%203.17157%2014.5%204%2014.5H12C12.8284%2014.5%2013.5%2013.8284%2013.5%2013V6.41421C13.5%206.01639%2013.342%205.63486%2013.0607%205.35355L9.64645%201.93934C9.36514%201.65803%208.98361%201.5%208.58579%201.5H4ZM3.5%203C3.5%202.72386%203.72386%202.5%204%202.5H8.58579C8.71839%202.5%208.84557%202.55268%208.93934%202.64645L12.3536%206.06066C12.4473%206.15443%2012.5%206.28161%2012.5%206.41421V13C12.5%2013.2761%2012.2761%2013.5%2012%2013.5H4C3.72386%2013.5%203.5%2013.2761%203.5%2013V3Z%22%20fill%3D%22%23949A9E%22%2F%3E%3C%2Fsvg%3E"); - - /* Themed Menu Icon */ - --icon-menu-light: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M3%206C3.55228%206%204%205.55228%204%205C4%204.44772%203.55228%204%203%204C2.44772%204%202%204.44772%202%205C2%205.55228%202.44772%206%203%206Z%22%20fill%3D%22%2318191B%22%2F%3E%3Cpath%20d%3D%22M22%205.75H6V4.25H22V5.75Z%22%20fill%3D%22%2318191B%22%2F%3E%3Cpath%20d%3D%22M22%2012.75H6V11.25H22V12.75Z%22%20fill%3D%22%2318191B%22%2F%3E%3Cpath%20d%3D%22M16%2019.75H6V18.25H16V19.75Z%22%20fill%3D%22%2318191B%22%2F%3E%3Cpath%20d%3D%22M4%2012C4%2012.5523%203.55228%2013%203%2013C2.44772%2013%202%2012.5523%202%2012C2%2011.4477%202.44772%2011%203%2011C3.55228%2011%204%2011.4477%204%2012Z%22%20fill%3D%22%2318191B%22%2F%3E%3Cpath%20d%3D%22M3%2020C3.55228%2020%204%2019.5523%204%2019C4%2018.4477%203.55228%2018%203%2018C2.44772%2018%202%2018.4477%202%2019C2%2019.5523%202.44772%2020%203%2020Z%22%20fill%3D%22%2318191B%22%2F%3E%3C%2Fsvg%3E"); - --icon-menu-dark: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M3%206C3.55228%206%204%205.55228%204%205C4%204.44772%203.55228%204%203%204C2.44772%204%202%204.44772%202%205C2%205.55228%202.44772%206%203%206Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M22%205.75H6V4.25H22V5.75Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M22%2012.75H6V11.25H22V12.75Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M16%2019.75H6V18.25H16V19.75Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M4%2012C4%2012.5523%203.55228%2013%203%2013C2.44772%2013%202%2012.5523%202%2012C2%2011.4477%202.44772%2011%203%2011C3.55228%2011%204%2011.4477%204%2012Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M3%2020C3.55228%2020%204%2019.5523%204%2019C4%2018.4477%203.55228%2018%203%2018C2.44772%2018%202%2018.4477%202%2019C2%2019.5523%202.44772%2020%203%2020Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); - - /* New Look Responsive Mobile First */ - /* Spacing */ - --leftbar-paddings-leftbar-padding-sm: var(--spacing-size-sm); - --leftbar-paddings-leftbar-padding-md: var(--spacing-size-md); - --leftbar-paddings-leftbar-padding-0: var(--spacing-size-size-0); - --leftbar-paddings-leftbar-padding-lg: var(--spacing-size-lg); - --padding-padding-lg: var(--spacing-size-md); - --padding-padding-sm: var(--spacing-size-xs); - --padding-padding-xs: var(--spacing-size-xs); - --padding-padding-2xs: var(--spacing-size-2xs); - --padding-padding-3xs: var(--spacing-size-3xs); - --leftbar-paddings-leftbar-padding-4xs: var(--spacing-size-4xs); - --leftbar-paddings-leftbar-padding-2xs: var(--spacing-size-2xs); - --leftbar-paddings-leftbar-padding-3xs: var(--spacing-size-3xs); - --padding-padding-md: var(--spacing-size-sm); - --main-margin: var(--spacing-size-sm); - --main-max-width-leftbar: 0rem; - --main-content-width: 54rem; - --icons-24: 1.5rem; - --icons-20: 1.25rem; - --icons-16: 1rem; - --icons-12: 0.75rem; - - /* Typography */ - --typography-font-size-3xs: var(--font-size-3xs); - --typography-font-size-2xs: var(--font-size-2xs); - --typography-font-size-xs: var(--font-size-xs); - --typography-font-size-sm: var(--font-size-xs); - --typography-font-size-md: var(--font-size-sm); - --typography-font-size-lg: var(--font-size-md); - --typography-font-size-xl: var(--font-size-lg); - --typography-font-size-2xl: var(--font-size-xl); - --typography-font-size-3xl: var(--font-size-2xl); - --typography-font-size-4xl: var(--font-size-3xl); - --typography-line-height-xs: var(--font-line-height-xs); - --typography-line-height-sm: var(--font-line-height-sm); - --typography-line-height-md: var(--font-line-height-md); - --typography-line-height-lg: var(--font-line-height-md); - --typography-line-height-xl: var(--font-line-height-lg); - --typography-line-height-2xl: var(--font-line-height-lg); - --typography-line-height-3xl: var(--font-line-height-2xl); - --typography-line-height-4xl: var(--font-line-height-3xl); - /*----------------- New Look Variables End -----------------*/ -} - -/*----------------- New Look Responsive Desktop Start -----------------*/ -@media (min-width: 768px) { - :root { - /* Spacing */ - --leftbar-paddings-leftbar-padding-sm: var(--spacing-size-sm); - --leftbar-paddings-leftbar-padding-md: var(--spacing-size-md); - --leftbar-paddings-leftbar-padding-0: var(--spacing-size-size-0); - --leftbar-paddings-leftbar-padding-lg: var(--spacing-size-lg); - --padding-padding-lg: var(--spacing-size-lg); - --padding-padding-sm: var(--spacing-size-sm); - --padding-padding-xs: var(--spacing-size-xs); - --padding-padding-2xs: var(--spacing-size-2xs); - --padding-padding-3xs: var(--spacing-size-3xs); - --leftbar-paddings-leftbar-padding-4xs: var(--spacing-size-4xs); - --leftbar-paddings-leftbar-padding-2xs: var(--spacing-size-2xs); - --leftbar-paddings-leftbar-padding-3xs: var(--spacing-size-3xs); - --padding-padding-md: var(--spacing-size-md); - --main-margin: var(--spacing-size-xl); - --main-max-width-leftbar: 18.25rem; - --icons-24: 1.5rem; - --icons-20: 1.25rem; - --icons-16: 1rem; - --icons-12: 0.75rem; - - /* Typography */ - --typography-font-size-3xs: var(--font-size-3xs); - --typography-font-size-2xs: var(--font-size-2xs); - --typography-font-size-xs: var(--font-size-xs); - --typography-font-size-sm: var(--font-size-sm); - --typography-font-size-md: var(--font-size-md); - --typography-font-size-lg: var(--font-size-lg); - --typography-font-size-xl: var(--font-size-xl); - --typography-font-size-2xl: var(--font-size-2xl); - --typography-font-size-3xl: var(--font-size-3xl); - --typography-font-size-4xl: var(--font-size-4xl); - --typography-line-height-xs: var(--font-line-height-xs); - --typography-line-height-sm: var(--font-line-height-sm); - --typography-line-height-md: var(--font-line-height-md); - --typography-line-height-lg: var(--font-line-height-lg); - --typography-line-height-xl: var(--font-line-height-xl); - --typography-line-height-2xl: var(--font-line-height-2xl); - --typography-line-height-3xl: var(--font-line-height-3xl); - --typography-line-height-4xl: var(--font-line-height-4xl); - } -} - -@media (min-width: 990px) { - :root { - --main-max-width-leftbar: 21.25rem; - --main-margin: var(--spacing-size-3xl); - } -} - -/*----------------- New Look Responsive Desktop End -----------------*/ - -/*----------------- Root Variables - End -----------------*/ - -/*----------------- HTML Variables - Start -----------------*/ - -/** - * HTML Theme Variables - * These variables are applied to the HTML element and control the active theme. - * The framework supports two themes: - * 1. Light Theme (default) - * 2. Dark Theme (activated by html.dark class) - */ - -/* Light Theme (Default) Configuration */ -html { - /*----------------- New Look Variables Start -----------------*/ - --icon-anchor: var(--icon-anchor-light); - --icon-arrow-left: var(--icon-arrow-left-light); - --icon-arrow-right: var(--icon-arrow-right-light); - --icon-arrow-up: var(--icon-arrow-up-light); - --icon-clipboard: var(--icon-clipboard-light); - --icon-home: var(--icon-home-light); - --icon-file: var(--icon-file-light); - --icon-menu: var(--icon-menu-light); - - --text-buttons-button-label-primary-default: var(--colors-neutral-0); - --text-buttons-button-label-secondary-default: var(--colors-neutral-900); - --text-buttons-button-label-inactive: var(--colors-neutral-500); - - --text-main-text-primary: var(--colors-neutral-900); - --text-main-text-link-blue-secondary: var(--colors-blue-500); - --text-main-text-link-blue-tetriary: var(--colors-blue-400); - --text-main-text-body-secondary: var(--colors-neutral-700); - --text-main-text-body-quaternary: var(--colors-neutral-400); - --text-main-text-body-tetriary: var(--colors-neutral-600); - --text-main-text-body-primary: var(--colors-neutral-850); - --text-main-text-link-blue: var(--colors-blue-600); - - --text-states-text-warning-tetriary: var(--colors-warning-600); - --text-states-text-warning-secondary: var(--colors-warning-500); - --text-states-text-positive-secondary: var(--colors-positive-500); - --text-states-text-positive-tetriary: var(--colors-positive-600); - --text-states-text-negative-secondary: var(--colors-negative-500); - --text-states-text-negative-tetriary: var(--colors-negative-600); - --text-states-text-warning: var(--colors-warning-400); - --text-states-text-positive: var(--colors-positive-400); - --text-states-text-negative: var(--colors-negative-400); - --text-states-text-additional: var(--colors-blue-400); - --text-states-text-additional-secondary: var(--colors-blue-500); - --text-states-text-additional-tetriary: var(--colors-blue-600); - - --text-code-red: var(--colors-code-colors-red-contrast); - --text-code-green: var(--colors-code-colors-green-contrast); - --text-code-blue: var(--colors-code-colors-blue-contrast); - --text-code-yellow: var(--colors-code-colors-yellow-contrast); - --text-code-purple: var(--colors-code-colors-purple-contrast); - --text-code-turquoise: var(--colors-code-colors-turquoise-contrast); - --text-code-neutral: var(--colors-code-colors-black); - --text-code-navy: var(--colors-code-colors-navy-contrast); - - --surface-button-button-bg-secondary-ta-default: var(--colors-brand-orange-400); - --surface-button-button-bg-primary-default: var(--colors-blue-700); - --surface-button-button-bg-primary-pressed: var(--colors-blue-700); - --surface-button-button-bg-primary-inactive: var(--colors-neutral-200); - --surface-button-button-bg-secondary-cta-hover: var(--colors-brand-orange-500); - --surface-button-button-bg-primary-hover: var(--colors-blue-800); - --surface-button-button-bg-secondary-cta-pressed: var(--colors-brand-orange-400); - --surface-button-button-bg-secondary-cta-inactive: var(--colors-neutral-200); - - --surface-background-main-base-primary: var(--colors-neutral-0); - --surface-background-main-surface-primary: var(--colors-neutral-50); - --surface-background-main-surface-secondary: var(--colors-neutral-100); - --surface-background-main-surface-tetriary: var(--colors-neutral-150); - --surface-background-main-surface-blue-secondary: var(--colors-blue-50); - --surface-background-main-surface-blue-tetriary: var(--colors-blue-100); - --surface-background-main-surface-blue-quaternary: var(--colors-blue-200); - --surface-background-main-surface-transparent: var(--colors-overlay-overlay-white-64); - --surface-background-main-surface-transparent-inverse: var(--colors-overlay-overlay-black-40); - --surface-background-main-surface-transparent-secondary: var(--colors-overlay-overlay-white-88); - - --surface-background-states-surface-warning-secondary: var(--colors-warning-100); - --surface-background-states-surface-warning-tetriary: var(--colors-warning-200); - --surface-background-states-surface-warning-quaternary: var(--colors-warning-300); - --surface-background-states-surface-positive-secondary: var(--colors-positive-100); - --surface-background-states-surface-positive-tetriary: var(--colors-positive-200); - --surface-background-states-surface-positive-quaternary: var(--colors-positive-300); - --surface-background-states-surface-negative-secondary: var(--colors-negative-100); - --surface-background-states-surface-negative-tetriary: var(--colors-negative-200); - --surface-background-states-surface-negative-quaternary: var(--colors-negative-300); - --surface-background-states-surface-additional-secondary: var(--colors-blue-100); - --surface-background-states-surface-additional-tetriary: var(--colors-blue-200); - --surface-background-states-surface-additional-quaternary: var(--colors-blue-300); - - --surface-icons-icon-primary: var(--colors-neutral-900); - --surface-icons-icon-button-primary: var(--colors-neutral-0); - --surface-icons-icon-button-secondary: var(--colors-neutral-900); - --surface-icons-icon-button-inactive: var(--colors-neutral-500); - --surface-icons-icon-secondary: var(--colors-neutral-600); - --surface-icons-icon-quaternary: var(--colors-neutral-200); - --surface-icons-icon-cta: var(--colors-brand-orange-500); - --surface-icons-icon-hover: var(--colors-brand-orange-400); - --surface-icons-icon-tetriary: var(--colors-neutral-400); - --surface-icons-icon-warning: var(--colors-warning-600); - --surface-icons-icon-positive: var(--colors-positive-600); - --surface-icons-icon-negative: var(--colors-negative-600); - --surface-icons-icon-brand-orange: var(--colors-brand-orange-600); - --surface-icons-icon-blue: var(--colors-blue-600); - --surface-icons-icon-blue-light: var(--colors-blue-200); - - --border-border-primary: var(--colors-neutral-100); - --border-border-secondary: var(--colors-neutral-150); - --border-border-tetriary: var(--colors-neutral-300); - --border-border-quaternary: var(--colors-neutral-600); - --border-border-active: var(--colors-neutral-900); - --border-border-brand-orange: var(--colors-brand-orange-200); - --border-border-warning: var(--colors-warning-200); - --border-border-positive: var(--colors-positive-200); - --border-border-negative: var(--colors-negative-200); - --border-border-blue: var(--colors-blue-200); - --border-border-blue-hover: var(--colors-blue-400); - - /*----------------- New Look Variables End -----------------*/ -} - -/* Dark Theme Configuration */ -html.dark { - /*----------------- New Look Variables Dark Mode Start -----------------*/ - --icon-anchor: var(--icon-anchor-dark); - --icon-arrow-left: var(--icon-arrow-left-dark); - --icon-arrow-right: var(--icon-arrow-right-dark); - --icon-arrow-up: var(--icon-arrow-up-dark); - --icon-clipboard: var(--icon-clipboard-dark); - --icon-home: var(--icon-home-dark); - --icon-file: var(--icon-file-dark); - --icon-menu: var(--icon-menu-dark); - - --text-buttons-button-label-primary-default: var(--colors-neutral-0); - --text-buttons-button-label-secondary-default: var(--colors-neutral-950); - --text-buttons-button-label-inactive: var(--colors-neutral-500); - - --text-main-text-primary: var(--colors-neutral-0); - --text-main-text-link-blue-secondary: var(--colors-blue-500); - --text-main-text-link-blue-tetriary: var(--colors-blue-600); - --text-main-text-link-blue: var(--colors-blue-400); - --text-main-text-body-secondary: var(--colors-neutral-200); - --text-main-text-body-tetriary: var(--colors-neutral-300); - --text-main-text-body-quaternary: var(--colors-neutral-600); - --text-main-text-body-primary: var(--colors-neutral-50); - - --text-states-text-warning-tetriary: var(--colors-warning-400); - --text-states-text-warning-secondary: var(--colors-warning-500); - --text-states-text-warning: var(--colors-warning-600); - --text-states-text-positive-secondary: var(--colors-positive-500); - --text-states-text-positive-tetriary: var(--colors-positive-400); - --text-states-text-positive: var(--colors-positive-600); - --text-states-text-negative-secondary: var(--colors-negative-500); - --text-states-text-negative-tetriary: var(--colors-negative-400); - --text-states-text-negative: var(--colors-negative-600); - --text-states-text-additional: var(--colors-blue-600); - --text-states-text-additional-secondary: var(--colors-blue-500); - --text-states-text-additional-tetriary: var(--colors-blue-400); - - --text-code-red: var(--colors-code-colors-red); - --text-code-green: var(--colors-code-colors-green); - --text-code-blue: var(--colors-code-colors-blue); - --text-code-yellow: var(--colors-code-colors-yellow); - --text-code-purple: var(--colors-code-colors-purple); - --text-code-turquoise: var(--colors-code-colors-turquoise); - --text-code-neutral: var(--colors-code-colors-white); - --text-code-navy: var(--colors-code-colors-navy); - - --surface-button-button-bg-secondary-ta-default: var(--colors-brand-orange-500); - --surface-button-button-bg-primary-default: var(--colors-blue-800); - --surface-button-button-bg-primary-pressed: var(--colors-blue-800); - --surface-button-button-bg-primary-inactive: var(--colors-neutral-800); - --surface-button-button-bg-secondary-cta-hover: var(--colors-brand-orange-400); - --surface-button-button-bg-primary-hover: var(--colors-blue-700); - --surface-button-button-bg-secondary-cta-pressed: var(--colors-brand-orange-500); - --surface-button-button-bg-secondary-cta-inactive: var(--colors-neutral-800); - - --surface-background-main-base-primary: var(--colors-neutral-950); - --surface-background-main-surface-primary: var(--colors-neutral-900); - --surface-background-main-surface-secondary: var(--colors-neutral-850); - --surface-background-main-surface-tetriary: var(--colors-neutral-800); - --surface-background-main-surface-blue-secondary: var(--colors-blue-900); - --surface-background-main-surface-blue-tetriary: var(--colors-blue-850); - --surface-background-main-surface-blue-quaternary: var(--colors-blue-800); - --surface-background-main-surface-transparent: var(--colors-overlay-overlay-black-64); - --surface-background-main-surface-transparent-inverse: var(--colors-overlay-overlay-white-40); - --surface-background-main-surface-transparent-secondary: var(--colors-overlay-overlay-black-88); - - --surface-background-states-surface-warning-secondary: var(--colors-warning-950); - --surface-background-states-surface-warning-tetriary: var(--colors-warning-800); - --surface-background-states-surface-warning-quaternary: var(--colors-warning-700); - --surface-background-states-surface-positive-secondary: var(--colors-positive-950); - --surface-background-states-surface-positive-tetriary: var(--colors-positive-800); - --surface-background-states-surface-positive-quaternary: var(--colors-positive-700); - --surface-background-states-surface-negative-secondary: var(--colors-negative-950); - --surface-background-states-surface-negative-tetriary: var(--colors-negative-800); - --surface-background-states-surface-negative-quaternary: var(--colors-negative-700); - --surface-background-states-surface-additional-secondary: var(--colors-blue-950); - --surface-background-states-surface-additional-tetriary: var(--colors-blue-800); - --surface-background-states-surface-additional-quaternary: var(--colors-blue-700); - - --surface-icons-icon-primary: var(--colors-neutral-0); - --surface-icons-icon-button-primary: var(--colors-neutral-0); - --surface-icons-icon-button-secondary: var(--colors-neutral-950); - --surface-icons-icon-button-inactive: var(--colors-neutral-600); - --surface-icons-icon-secondary: var(--colors-neutral-400); - --surface-icons-icon-quaternary: var(--colors-neutral-600); - --surface-icons-icon-cta: var(--colors-brand-orange-500); - --surface-icons-icon-hover: var(--colors-brand-orange-600); - --surface-icons-icon-warning: var(--colors-warning-400); - --surface-icons-icon-positive: var(--colors-positive-400); - --surface-icons-icon-negative: var(--colors-negative-400); - --surface-icons-icon-brand-orange: var(--colors-brand-orange-400); - --surface-icons-icon-blue: var(--colors-blue-400); - --surface-icons-icon-blue-light: var(--colors-blue-700); - - --border-border-primary: var(--colors-neutral-850); - --border-border-secondary: var(--colors-neutral-800); - --border-border-tetriary: var(--colors-neutral-700); - --border-border-quaternary: var(--colors-neutral-500); - --border-border-active: var(--colors-neutral-0); - --border-border-brand-orange: var(--colors-brand-orange-900); - --border-border-warning: var(--colors-warning-800); - --border-border-positive: var(--colors-positive-800); - --border-border-negative: var(--colors-negative-800); - --border-border-blue: var(--colors-blue-700); - --border-border-blue-hover: var(--colors-blue-500); - - /*----------------- New Look Variables Dark Mode Start -----------------*/ -} - -/*----------------- HTML Variables - End -----------------*/ - -/* Override for Antora default styles */ -html:has(.boostlook) { - -webkit-box-sizing: border-box; - box-sizing: border-box; - font-size: 1rem; - height: 100%; - scroll-behavior: smooth; -} - -/*----------------- Font-Face Declarations start -----------------*/ - -/** - * Typography Configuration - * The framework uses Noto Sans family as its primary font system: - * 1. Noto Sans Display: Main text font with variable weight support - * 2. Noto Sans Mono: Monospace font for code blocks - * - * Font Loading Strategy: - * - Multiple source paths for resilient loading - * - Variable fonts for optimal performance - * - Font-display: block to prevent FOIT (Flash of Invisible Text) - */ - -/* Noto Sans Display - Regular */ -@font-face { - font-family: "Noto Sans Display"; - font-style: normal; - font-weight: 100 900; - /* Variable font weight range */ - font-variation-settings: "wght" 400; - font-stretch: semi-condensed; - font-display: block; - /* Prevents FOIT */ - src: url("/_/fonts/NotoSansDisplay.ttf") format("truetype"), url("../../../../tools/boostlook/NotoSansDisplay.ttf") format("truetype"), - url("https://cppalliance.org/fonts/NotoSansDisplay.ttf") format("truetype"); -} - -/* Noto Sans Display - Italic */ -@font-face { - font-family: "Noto Sans Display"; - font-style: italic; - font-weight: 100 900; - /* Variable font weight range */ - font-variation-settings: "wght" 400; - font-stretch: semi-condensed; - font-display: block; - /* Prevents FOIT */ - src: url("/font/NotoSansDisplay-Italic.ttf") format("truetype"), url("../../../../tools/boostlook/NotoSansDisplay-Italic.ttf") format("truetype"), - url("https://cppalliance.org/fonts/NotoSansDisplay-Italic.ttf") format("truetype"); -} - -/* Noto Sans Mono - Variable Weight */ -@font-face { - font-family: "Noto Sans Mono"; - font-style: normal; - font-weight: 100 900; - /* Variable font weight range */ - font-variation-settings: "wght" 400; - font-stretch: semi-condensed; - font-display: block; - /* Prevents FOIT */ - src: url("/_/boostlook/NotoSansMono.ttf") format("truetype"), url("../../../../tools/boostlook/NotoSansMono.ttf") format("truetype"), - url("https://cppalliance.org/fonts/NotoSansMono.ttf") format("truetype"); -} - -/* Noto Sans Mono - Fixed Weight */ -@font-face { - font-family: "Noto Sans Mono"; - font-style: normal; - font-weight: 400; - /* Fixed weight for specific use cases */ - font-stretch: ultra-condensed; - font-display: block; - /* Prevents FOIT */ - src: url("/_/boostlook/NotoSansMono.ttf") format("truetype"), url("../../../../tools/boostlook/NotoSansMono.ttf") format("truetype"), - url("https://cppalliance.org/fonts/NotoSansMono.ttf") format("truetype"); -} - -/*----------------- Font-Face Declarations end -----------------*/ - -/*----------------- CSS Reset start -----------------*/ - -/** - * Modern CSS Reset - * A minimal CSS reset that: - * 1. Uses the modern box-sizing model - * 2. Removes default margins - * 3. Improves text rendering - * 4. Ensures responsive media elements - * 5. Normalizes form elements - * 6. Prevents text overflow issues - * 7. Provides a proper stacking context - * 8. Resets legacy table and adjacent element styles - */ - -/* Box sizing rules */ -*, -*::before, -*::after { - box-sizing: border-box; -} - -/* Remove default margin */ -* { - margin: 0; -} - -html body { - margin: 0; -} - -/* Body defaults */ -body { - line-height: 1.5; - -webkit-font-smoothing: antialiased; - margin: 0; - /* Improves text rendering on WebKit */ -} - -/* Media elements */ -img, -picture, -video, -canvas, -svg { - display: block; - max-width: 100%; - /* Responsive media elements */ -} - -/* Form elements */ -input, -button, -textarea, -select { - font: inherit; - /* Inherit typography */ -} - -/* Text elements */ -p, -h1, -h2, -h3, -h4, -h5, -h6 { - overflow-wrap: break-word; - /* Prevent text overflow */ -} - -body :not(pre):not([class^="L"]) > code { - /* ovverrides builtin colors */ - color: var(--text-code-neutral, #0d0e0f); -} - -/* Stacking context */ -#root, -#__next { - isolation: isolate; - /* Create new stacking context */ -} - -/* Reset Legacy Table and Next to Table Element Styles */ -.boostlook .tablecontainer, -.boostlook .tablecontainer + *, -.boostlook :not(.tablecontainer) > table.tableblock, -.boostlook :not(.tablecontainer) > table.tableblock + *, -.boostlook .doc .tablecontainer, -.boostlook .doc .tablecontainer + *, -.boostlook .doc :not(.tablecontainer) > table.tableblock, -.boostlook .doc :not(.tablecontainer) > table.tableblock + *, -.boostlook.boostlook:not(:has(.doc)) table.table, -.boostlook.boostlook:not(:has(.doc)) table.table + * { - margin: revert; -} - -.boostlook .underline:has(> code:only-child) { - text-decoration-line: none; -} - -/*----------------- CSS Reset end -----------------*/ - -/*----------------- Global Styles for .boostlook start -----------------*/ - -/** - * Global Styles for .boostlook - * Core styles that apply to all .boostlook containers regardless of template. - * These styles establish: - * 1. Base container styling - * 2. Typography hierarchy and spacing - * 3. Link appearances and interactions - * 4. Code block formatting and syntax highlighting - * 5. List and table styles - * 6. Special block elements (quotes, admonitions, etc.) - * 7. Pagination and navigation elements - * 8. Layout structure and spacing - */ - -/* Base Container */ -.boostlook { - font-family: "Noto Sans Display" !important; - font-stretch: 100%; - background: var(--surface-background-main-base-primary, #fff); -} - -/* Typography Hierarchy - * Establishes consistent heading sizes and spacing - * while maintaining proper visual hierarchy - */ -.boostlook h1, -.boostlook .doc h1, -.boostlook h2, -.boostlook .doc h2, -.boostlook h3, -.boostlook .doc h3, -.boostlook h4, -.boostlook .doc h4, -.boostlook h5, -.boostlook .doc h5, -.boostlook h6, -.boostlook .doc h6 { - color: var(--text-main-text-primary, #18191b); - display: block; - line-height: var(--typography-line-height-xl, 1.75rem); - margin-top: var(--padding-padding-md, 1.125rem); - letter-spacing: var(--spacing-size-size-0, 0rem); - margin-bottom: 0.5rem; - font-weight: 500; - position: relative; -} - -/* Heading Sizes */ -.boostlook h1, -.boostlook .doc h1 { - font-size: var(--typography-font-size-2xl, 1.75rem); - line-height: var(--typography-line-height-3xl, 2.5rem); /* 142.857% */ -} - -/* Primary headings */ -.boostlook h2, -.boostlook .doc h2 { - font-size: var(--typography-font-size-lg, 1.25rem); -} - -/* Section headings */ -.boostlook h3, -.boostlook .doc h3 { - font-size: var(--typography-font-size-md, 1.125rem); - line-height: var(--typography-line-height-xl, 1.75rem); /* 155.556% */ -} - -/* Subsection headings */ -.boostlook h4, -.boostlook .doc h4 { - font-size: var(--font-size-sm, 1rem); - line-height: var(--font-line-height-lg, 1.5rem); -} - -/* Topic headings */ -.boostlook h5, -.boostlook .doc h5 { - font-size: var(--font-size-xs, 0.875rem); - line-height: var(--font-line-height-md, 1.25rem); -} - -/* Subtopic headings */ -.boostlook h6, -.boostlook .doc h6 { - font-size: var(--font-size-xs, 0.875rem); - line-height: var(--font-line-height-md, 1.25rem); -} - -/* Document-specific headings adjustments */ -.boostlook .doc h2:not(.discrete) { - /* website-v2-doc styles overrides */ - margin-left: 0; - padding-left: 0; - border-bottom: revert; - margin-right: revert; - padding: revert; -} - -.boostlook h2:has(+ .sectionbody > .sect2:first-child > h3), -.boostlook .doc h2:has(+ .sectionbody > .sect2:first-child > h3) { - margin-bottom: 0; -} - -.boostlook h3:has(+ .sect3 > h4:first-child), -.boostlook .doc h2:has(+ .sect3 > h4:first-child) { - margin-bottom: 0; -} - -/* Override default docs site css */ -.boostlook .doc .dlist, -.boostlook .doc .exampleblock, -.boostlook .doc .hdlist, -.boostlook .doc .imageblock, -.boostlook .doc .listingblock, -.boostlook .doc .literalblock, -.boostlook .doc .olist, -.boostlook .doc .paragraph, -.boostlook .doc .partintro, -.boostlook .doc .quoteblock, -.boostlook .doc .sidebarblock, -.boostlook .doc .tabs, -.boostlook .doc .ulist, -.boostlook .doc .verseblock, -.boostlook .doc .videoblock, -.boostlook .doc details, -.boostlook .doc hr { - margin: revert; -} - -/* Anchor positioning within headings */ -.boostlook .doc h1:has(.anchor), -.boostlook .doc h2:has(.anchor), -.boostlook .doc h3:has(.anchor), -.boostlook .doc h4:has(.anchor), -.boostlook .doc h5:has(.anchor), -.boostlook .doc h6:has(.anchor), -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]) { - display: inline-block; - /* Anchor width and spacing compensation */ - padding-right: 3rem; -} - -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]) a[href] { - text-decoration: none; - color: inherit; -} - -/* Heading Anchors */ -.boostlook .doc h1 .anchor, -.boostlook .doc h2 .anchor, -.boostlook .doc h3 .anchor, -.boostlook .doc h4 .anchor, -.boostlook .doc h5 .anchor, -.boostlook .doc h6 .anchor, -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]) a[id], -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]) a[href]:before { - position: absolute; - top: 50%; - right: 0; - display: flex; - align-items: center; - justify-content: center; - margin-left: revert; - width: 2rem; - height: 2rem; - border: 1px; - visibility: hidden; - opacity: 0; - text-decoration: none; - border-radius: var(--spacing-size-lg, 1.5rem); - border: 1px solid var(--border-border-primary, #e4e7ea); - background: var(--surface-background-main-base-primary, #fff); - transform: translateY(-50%); - transition: all 0.2s ease; -} - -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]) a[id] { - visibility: visible; -} -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]) a[href]:before { - content: ""; -} - -.boostlook .doc h1 .anchor::before, -.boostlook .doc h2 .anchor::before, -.boostlook .doc h3 .anchor::before, -.boostlook .doc h4 .anchor::before, -.boostlook .doc h5 .anchor::before, -.boostlook .doc h6 .anchor::before, -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]) a[href]:after { - content: var(--icon-anchor); - display: block; - line-height: 1; - opacity: 0.6; - transition: opacity 0.3s ease; -} - -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]) a[href]:after { - position: absolute; - top: 50%; - right: 0; - width: 2rem; - height: 2rem; - display: flex; - align-items: center; - justify-content: center; - opacity: 0; - visibility: hidden; - line-height: 0; - transform: translateY(-50%); - transition: all 0.2s ease; -} - -.doc h1:hover .anchor, -.doc h2:hover .anchor, -.doc h3:hover .anchor, -.doc h4:hover .anchor, -.doc h5:hover .anchor, -.doc h6:hover .anchor, -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]):hover a[href]:before { - opacity: 1; - visibility: visible; -} - -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]):hover a[href]:after { - opacity: 0.6; - visibility: visible; -} - -.boostlook .doc h1 .anchor:hover, -.boostlook .doc h2 .anchor:hover, -.boostlook .doc h3 .anchor:hover, -.boostlook .doc h4 .anchor:hover, -.boostlook .doc h5 .anchor:hover, -.boostlook .doc h6 .anchor:hover, -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]:hover) a[href]:before { - border-color: var(--border-border-blue, #92cbe9); -} - -.boostlook .doc h1 .anchor:active, -.boostlook .doc h2 .anchor:active, -.boostlook .doc h3 .anchor:active, -.boostlook .doc h4 .anchor:active, -.boostlook .doc h5 .anchor:active, -.boostlook .doc h6 .anchor:active, -.boostlook :where(h1, h2, h3, h4, h5, h6):has(> a[id]):has(> a[href]) a[href]:active:before { - border-color: var(--border-border-blue, #92cbe9); - background: var(--surface-background-main-surface-blue-secondary, #daeef9); -} - -.boostlook .doc h1 .anchor:hover::before, -.boostlook .doc h2 .anchor:hover::before, -.boostlook .doc h3 .anchor:hover::before, -.boostlook .doc h4 .anchor:hover::before, -.boostlook .doc h5 .anchor:hover::before, -.boostlook .doc h6 .anchor:hover::before { - opacity: 1; -} - -/* Paragraph Styling */ -.boostlook p { - padding-top: initial !important; - padding-bottom: initial !important; - color: var(--text-main-text-body-primary, #2a2c30); - font-size: var(--typography-font-size-sm, 1rem); - font-weight: 400; - line-height: var(--typography-line-height-lg, 1.5rem); /* 150% */ -} - -/* Components margins */ -.boostlook .paragraph + .paragraph, -.boostlook:not(:has(.doc)) .section > p + p, -.boostlook:not(:has(.doc)) .chapter > p + p, -.boostlook div.blockquote blockquote p + p, -.boostlook#libraryReadMe > p:not(:first-child) + p, -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content > p + p, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content > p + p, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content > p + p { - margin-top: var(--padding-padding-3xs, 0.25rem); -} - -.boostlook .paragraph + .tabs, -.boostlook #content .paragraph + .admonitionblock, -.boostlook #content .tabs + .paragraph, -.boostlook #content .colist + .paragraph, -.boostlook #content .admonitionblock + .tabs, -.boostlook #content .admonitionblock + .admonitionblock, -.boostlook #content .olist + .admonitionblock, -.boostlook #content .olist + .paragraph, -.boostlook:not(:has(.doc)) div.orderedlist + p, -.boostlook:not(:has(.doc)) p + div.orderedlist, -.boostlook:not(:has(.doc)) .itemizedlist + p, -.boostlook:not(:has(.doc)) div.itemizedlist:has(+ a[id^="bind"]) + a + *, -.boostlook:not(:has(.doc)) div.table:has(+ .table-break) + .table-break + *, -.boostlook #content .paragraph + .olist, -.boostlook #content .ulist + .admonitionblock, -.boostlook #content .ulist + .paragraph, -.boostlook #content .colist + .admonitionblock, -.boostlook #content .admonitionblock + .paragraph, -.boostlook #content .paragraph + table.tableblock, -.boostlook.boostlook:not(:has(.doc)) p + table.table, -.boostlook.boostlook:not(:has(.doc)) p + .informaltable, -.boostlook #content table.tableblock + .paragraph, -.boostlook #content table.tableblock + .admonitionblock, -.boostlook:not(:has(.doc)) .informaltable + p, -.boostlook #content .imageblock + .paragraph, -.boostlook:not(:has(.doc)) .inlinemediaobject + p, -.boostlook:not(:has(.doc)) p:has(> .inlinemediaobject:only-child) + p, -.boostlook#libraryReadMe > p + table, -.boostlook#libraryReadMe > table + p, -.boostlook#libraryReadMe > ul + p, -.boostlook#libraryReadMe .literalblock + .paragraph, -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content > ul:not([class]) + p, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content > ul:not([class]) + p, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content > ul:not([class]) + p { - margin-top: var(--padding-padding-xs, 0.75rem); -} - -.boostlook #content .dlist + .paragraph, -.boostlook #content .dlist + .listingblock, -.boostlook:not(:has(.doc)) div.blockquote + p, -.boostlook:not(:has(.doc)) .variablelist + p { - margin-top: var(--padding-padding-2xs, 0.5rem); -} - -.boostlook h2 + .tabs, -.boostlook .doc h2 + .tabs, -.boostlook h3 + .tabs, -.boostlook .doc h3 + .tabs, -.boostlook h4 + .tabs, -.boostlook .doc h4 + .tabs, -.boostlook h5 + .tabs, -.boostlook .doc h5 + .tabs, -.boostlook h5 + .tabs, -.boostlook .doc h6 + .tabs, -.boostlook #content .sectionbody .olist:first-child, -.boostlook:not(:has(.doc)) .section div.orderedlist:first-child { - margin-top: var(--padding-padding-3xs, 0.25rem); -} - -.boostlook .olist .imageblock .content, -.boostlook .ulist .imageblock .content { - margin-bottom: var(--padding-padding-xs, 0.75rem); -} - -/* Special paragraph cases */ -.boostlook table p, -.boostlook ul p { - margin: 0; -} - -/* Link Styling */ -.boostlook a, -.boostlook .doc a { - color: var(--text-main-text-link-blue, #026a9f); - text-decoration: none; - transition: color 0.3s ease; -} - -/* Link Hover States */ -.boostlook a:hover, -.boostlook .doc a:hover { - color: var(--text-states-text-warning, #FF9442); - cursor: pointer; -} - -/* Link States */ -.boostlook p a:visited:not(:hover), -.boostlook table a:visited:not(:hover) { - color: var(--text-main-text-body-tetriary, #62676b); -} - -/* Emphasis within code */ -.boostlook em, -.boostlook code em { - font-family: "Noto Sans Display"; - font-size: inherit; -} - -/* Text Emphasis */ -.boostlook b, -.boostlook strong { - font-variation-settings: "wght" 600; -} - -/* Code Block Styling */ -.boostlook .doc .listingblock, -.boostlook .listingblock { - position: relative; -} - -.boostlook .doc .listingblock code, -.boostlook .listingblock code { - display: initial; -} - -.boostlook .hljs { - background: transparent; -} - -.boostlook code { - font-family: var(--font-family-code, "Noto Sans Mono"), monospace; -} - -.boostlook table thead code { - background: inherit; -} - -.boostlook pre code, -.boostlook pre code.hljs, -.boostlook .doc .content pre code, -.boostlook .doc pre.highlight code { - font-size: var(--typography-font-size-xs, 0.875rem); - font-weight: 400; - line-height: var(--typography-line-height-lg, 1.5rem); /* 171.429% */ - letter-spacing: var(--spacing-size-size-0, 0rem); - color: var(--text-main-text-primary, #18191b); - padding: revert; - border: none; -} - -.boostlook pre:not(:has(> code)), -.boostlook pre:not(:has(> code)):has(p, span) { - font-size: var(--typography-font-size-xs, 0.875rem); - font-weight: 400; - line-height: var(--typography-line-height-lg, 1.5rem); /* 171.429% */ - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -.boostlook pre, -.boostlook pre.rouge, -.boostlook .doc .content pre, -.boostlook .doc pre.highlight, -.boostlook .doc .listingblock pre:not(.highlight), -.boostlook .doc .literalblock pre { - padding: var(--spacing-size-xs, 0.75rem) var(--spacing-size-sm, 1rem); - background: var(--surface-background-main-surface-primary, #f5f6f8); - border-radius: var(--spacing-size-2xs); - border: unset; -} - -.boostlook .doc pre { - padding: initial; -} - -.boostlook .content:has(> pre), -.boostlook .content:has(> pre.highlight) { - border-radius: var(--spacing-size-2xs, 0.5rem); - border: 1px solid var(--border-border-secondary, #d5d7d9); - background: var(--surface-background-main-surface-secondary, #e4e7ea); -} - -.boostlook pre.programlisting { - border: 1px solid var(--border-border-secondary, #d5d7d9); -} - -/* Code Block Regular Title */ -.boostlook .doc .listingblock .title, -.boostlook .listingblock .title { - color: var(--text-main-text-body-primary, #2a2c30); - font-size: var(--typography-font-size-xs, 0.875rem); - font-style: normal; - font-weight: 600; - line-height: var(--typography-line-height-md, 1.25rem); - letter-spacing: unset; - padding-bottom: var(--padding-padding-2xs, 0.5rem); -} - -.boostlook .doc .listingblock .title a, -.boostlook .listingblock .title a { - font: inherit; - text-decoration: none; -} - -/* Code Block Title With File Name. - * Applies only if codeblock has child with class .toolbox - * and it`s title doesn`t includes any other elems as children -*/ -.boostlook .doc .listingblock:has(.source-toolbox) .title:not(:has(a, span, p, code, pre)), -.boostlook .listingblock:has(.source-toolbox) .title:not(:has(a, span, p, code, pre)) { - position: absolute; - top: 1px; - height: 2rem; - max-width: calc(100% - 5rem); - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - padding: 0; - padding-left: var(--spacing-size-sm); - display: flex; - align-items: center; - gap: var(--spacing-size-2xs, 0.5rem); - color: var(--text-main-text-body-tetriary, #62676b); - font-family: "Noto Sans Display"; - font-size: var(--typography-font-size-2xs, 0.75rem); - font-style: normal; - font-weight: 400; - line-height: var(--typography-line-height-sm, 1rem); - letter-spacing: var(--spacing-size-size-0, 0rem); - z-index: 1; -} - -.boostlook .doc .listingblock:has(.source-toolbox) .title:not(:has(a, span, p, code, pre))::before, -.boostlook .listingblock:has(.source-toolbox) .title:not(:has(a, span, p, code, pre))::before { - content: var(--icon-file); - line-height: 0; -} - -/* Code Block Margins */ -.boostlook .listingblock:has(> .content > pre), -.boostlook .listingblock:has(> .content > pre.highlight), -.boostlook:not(:has(.doc)) pre.programlisting, -.boostlook#libraryReadMe > pre, -.boostlook#libraryReadMe .literalblock:has(pre), -.boostlook#libraryReadMe div.highlight:has(> pre) { - margin: 0; - margin-top: var(--padding-padding-2xs, 0.5rem); -} - -/* Apply left margin only if code block not in definition block */ -.boostlook .listingblock:has(> .content > pre):not(:is(dd pre)), -.boostlook .listingblock:has(> .content > pre.highlight):not(:is(dd pre)), -.boostlook:not(:has(.doc)) pre.programlisting:not(:is(dd pre)), -.boostlook#libraryReadMe > pre:not(:is(dd pre)), -.boostlook#libraryReadMe .literalblock:has(pre):not(:is(dd pre)), -.boostlook#libraryReadMe div.highlight:has(> pre):not(:is(dd pre)) { - margin-left: var(--spacing-size-xl); -} - -.boostlook .listingblock:has(> .content > pre):not(:last-child), -.boostlook .listingblock:has(> .content > pre.highlight):not(:last-child), -.boostlook:not(:has(.doc)) pre.programlisting:not(:last-child), -.boostlook#libraryReadMe > pre:not(:last-child) { - margin-bottom: var(--padding-padding-xs, 0.75rem); -} - -.boostlook .content:has(> pre):has(> .source-toolbox) { - position: relative; - display: flex; - flex-direction: column-reverse; -} - -.boostlook .content:has(> pre):has(> .source-toolbox) pre { - border-top: 1px solid var(--border-border-secondary, #d5d7d9); - border-radius: var(--spacing-size-2xs, 0.5rem); -} - -.boostlook .content:has(> pre):has(> .source-toolbox) .source-toolbox { - position: static; - order: 0; - display: flex; - visibility: visible; - top: unset; - right: unset; - color: var(--text-main-text-body-tetriary, #62676b); - font-family: inherit; - z-index: 1; - padding: var(--article-article-compressing-from-12-8--, 0.5rem) var(--spacing-size-sm, 1rem); - min-height: 2rem; -} - -.boostlook .content:has(> pre):has(> .source-toolbox) .source-lang { - color: var(--text-main-text-body-quaternary, #949a9e); - text-align: right; - font-family: "Noto Sans Display"; - font-size: var(--typography-font-size-2xs, 0.75rem); - font-style: normal; - font-weight: 500; - line-height: var(--typography-line-height-sm, 1rem); /* 133.333% */ - letter-spacing: var(--spacing-size-size-0, 0rem); - text-transform: uppercase; - margin-left: auto; -} -.boostlook .content:has(> pre):has(> .source-toolbox) .source-lang::after { - content: none; -} - -/* Code Block Copy to Clipboard Icon */ -.boostlook .content:has(> pre):has(> .source-toolbox) .copy-button { - position: absolute; - top: 2.25rem; - right: 0.25rem; - display: flex; - flex-direction: column; - align-items: center; - color: inherit; - outline: none; - font-size: inherit; - line-height: inherit; - width: 2rem; - height: 2rem; - padding: var(--spacing-size-3xs, 0.25rem); - border-radius: var(--spacing-size-2xs, 0.5rem); - border: 1px solid var(--border-border-primary, #e4e7ea); - background: var(--surface-background-main-surface-primary, #f5f6f8); - opacity: 0; - visibility: hidden; - transition: all 0.2s ease; -} - -.boostlook .content:has(> pre):has(> .source-toolbox) .copy-button:hover { - border: 1px solid var(--border-border-blue, #92cbe9); -} - -.boostlook .content:has(> pre):has(> .source-toolbox):hover .copy-button { - opacity: 1; - visibility: visible; -} - -.boostlook .content:has(> pre):has(> .source-toolbox) .copy-button img { - display: none; -} - -.boostlook .content:has(> pre):has(> .source-toolbox) .copy-button::before { - content: var(--icon-clipboard); - width: var(--icons-24, 1.5rem); - height: var(--icons-24, 1.5rem); - aspect-ratio: 1/1; -} - -/* Code Block Copied Toast */ -.boostlook .content:has(> pre):has(> .source-toolbox) .copy-toast { - flex: none; - position: relative; - display: inline-flex; - justify-content: center; - padding: var(--padding-padding-3xs, 0.25rem) var(--padding-padding-xs, 0.75rem); - flex-direction: column; - align-items: center; - margin-top: 1em; - background: var(--surface-background-main-surface-primary, #f5f6f8); - border-radius: var(--spacing-size-2xs, 0.5rem); - border: 1px solid var(--border-border-secondary, #d5d7d9); - color: var(--text-main-text-primary, #18191b); - cursor: auto; - opacity: 0; - transition: opacity 0.5s ease 0.5s; -} - -.boostlook .content:has(> pre):has(> .source-toolbox) .copy-toast::after { - content: url("data:image/svg+xml,%3Csvg%20width%3D%2212%22%20height%3D%2212%22%20viewBox%3D%220%200%2012%2012%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M6%2011.95L11.6569%206.2931L6%200.636243L0.343146%206.2931L6%2011.95Z%22%20fill%3D%22%23F5F6F8%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M0.343146%206.2931L6%200.636243L11.6569%206.2931L10.9497%207.0002L6%202.05046L1.05025%207.0002L0.343146%206.2931Z%22%20fill%3D%22%23E4E7EA%22%2F%3E%3C%2Fsvg%3E"); - position: absolute; - top: -62%; - width: 1em; - height: 1em; - border: unset; - border-left-color: unset; - transform: unset; - transform-origin: unset; - color: var(--text-main-text-primary, #18191b); - text-align: center; - font-size: var(--typography-font-size-sm, 1rem); - font-weight: 500; - line-height: var(--typography-line-height-lg, 1.5rem); /* 150% */ -} - -/* Code Styling */ -.boostlook p code:not(:has(> code)), -.boostlook li code:not(:has(> code)), -.boostlook .doc p code:not(:has(> code)), -.boostlook .doc .colist > table code:not(:has(> code)) { - display: inline; - color: var(--text-code-neutral, #0d0e0f); - font-size: 0.96em; - font-style: normal; - font-weight: 400; - line-height: var(--typography-line-height-md); - letter-spacing: var(--spacing-size-size-0, 0rem); - font-stretch: 90%; -} - -.boostlook p:not(:is(table p)) code:not(:has(> code)), -.boostlook li code:not(:has(> code)), -.boostlook .doc p:not(:is(table p)) code:not(:has(> code)), -.boostlook .doc .colist > table code:not(:has(> code)) { - border-radius: unset; - padding: unset; - /* border: 1px solid var(--border-border-secondary, #d5d7d9); */ - background: transparent !important; -} - -/* Code Links */ -.boostlook p:not(:is(table p)) a code, -.boostlook li:not(:is(table li)) a code, -.boostlook .doc p:not(:is(table p)) a code, -.boostlook .doc table a code, -.boostlook .doc .colist > table a code, -.boostlook code:has(> a:first-child:last-child), -.boostlook code:has(> a:only-child), -.boostlook p:not(:is(table p)) code:has(> a:first-child:last-child), -.boostlook p:not(:is(table p)) code:has(> a:only-child), -.boostlook li:not(:is(table li)) code:has(> a:first-child:last-child), -.boostlook li:not(:is(table li)) code:has(> a:only-child), -.boostlook .doc p:not(:is(table p)) code:has(> a:first-child:last-child), -.boostlook .doc p:not(:is(table p)) code:has(> a:only-child), -.boostlook .doc .colist > table code:has(> a:first-child:last-child), -.boostlook .doc .colist > table code:has(> a:only-child) { - /* transition: all 0.2s ease; */ - border-radius: unset; - border: none; - background: transparent !important; - color: inherit; -} - -/* Applies to links in code in case where only one link tag inside code */ -/* .boostlook code:not(.tableblock code, .table code):has(> a:first-child:last-child) a, -.boostlook code:not(.tableblock code, .table code):has(> a:only-child) a, -.boostlook p code:not(.tableblock code, .table code):has(> a:first-child:last-child) a, -.boostlook p code:not(.tableblock code, .table code):has(> a:only-child) a, -.boostlook li code:not(.tableblock code, .table code):has(> a:first-child:last-child) a, -.boostlook li code:not(.tableblock code, .table code):has(> a:only-child) a, -.boostlook .doc p code:not(.tableblock code, .table code):has(> a:first-child:last-child) a, -.boostlook .doc p code:not(.tableblock code, .table code):has(> a:only-child) a, -.boostlook .doc .colist > table code:has(> a:first-child:last-child) a, -.boostlook .doc .colist > table code:has(> a:only-child) a { - text-decoration: none; - font: inherit; - color: inherit; -} */ - -/* .boostlook .doc table.tableblock code a, -.boostlook:not(:has(.doc)) table.table code a { */ -/* text-decoration-color: transparent; */ -/* color: var(--text-code-blue, #329cd2); */ -/* line-height: var(--typography-line-height-lg, 1.5rem); */ -/* } */ - -/* Code Link Hover States */ -/* .boostlook p:not(:is(table p)) a:hover code, -.boostlook li a:hover code, -.boostlook .doc p:not(:is(table p)) a:hover code, -.boostlook .doc table a:hover code, -.boostlook .doc .colist > table a:hover code, -.boostlook p:not(:is(table p)) code:has(> a:first-child:last-child):hover, -.boostlook p:not(:is(table p)) code:has(> a:only-child):hover, -.boostlook li code:has(> a:first-child:last-child):hover, -.boostlook li code:has(> a:only-child):hover, -.boostlook .doc p:not(:is(table p)) code:has(> a:first-child:last-child):hover, -.boostlook .doc p:not(:is(table p)) code:has(> a:only-child):hover, -.boostlook .doc .colist > table code:has(> a:first-child:last-child):hover, -.boostlook .doc .colist > table code:has(> a:only-child):hover { - border-color: var(--border-border-blue-hover, #329cd2); - background: var(--surface-background-main-surface-blue-tetriary, #c2e2f4) !important; -} */ - -.boostlook a:hover code { - color: inherit; -} - -.boostlook .doc table.tableblock code:hover a, -.boostlook:not(:has(.doc)) table.table code:hover a, -.boostlook .doc table.tableblock code a:focus-visible, -.boostlook:not(:has(.doc)) table.table code a:focus-visible { - text-decoration-color: var(--border-border-blue, #92cbe9); -} - -/* Syntax Highlighting */ -.boostlook .hljs-keyword, -.boostlook .hljs-selector-tag, -.boostlook .hljs-subst, -.boostlook pre span.k, -.boostlook pre span.kc, -.boostlook pre span.kd, -.boostlook pre span.kn, -.boostlook pre span.kp, -.boostlook pre span.kr, -.boostlook pre span.kt, -.boostlook pre span.keyword, -.boostlook pre span.property { - color: var(--text-code-purple, #9f26e5); -} - -.boostlook pre span.n, -.boostlook pre span.na, -.boostlook pre span.nb, -.boostlook pre span.bp, -.boostlook pre span.nc, -.boostlook pre span.no, -.boostlook pre span.nd, -.boostlook pre span.ni, -.boostlook pre span.ne, -.boostlook pre span.nf, -.boostlook pre span.py, -.boostlook pre span.nl, -.boostlook pre span.nn, -.boostlook pre span.nx, -.boostlook pre span.nt, -.boostlook pre span.nv, -.boostlook pre span.vc, -.boostlook pre span.vg, -.boostlook pre span.vi, -.boostlook pre span.identifier { - color: var(--text-main-text-body-primary, #2a2c30); -} - -.boostlook pre span.c, -.boostlook pre span.ch, -.boostlook pre span.cm, -.boostlook pre span.cp, -.boostlook pre span.cpf, -.boostlook pre span.c1, -.boostlook pre span.cs, -.boostlook pre span.sd, -.boostlook pre span.sh, -.boostlook pre span.comment, -.boostlook .hljs-comment, -.boostlook .hljs-quote, -.boostlook .hljs-addition, -.boostlook .hljs-built_in, -.boostlook .hljs-bullet, -.boostlook .hljs-code { - color: var(--text-code-green, #48ac7b); -} - -.boostlook pre span.s, -.boostlook pre span.sa, -.boostlook pre span.sb, -.boostlook pre span.dl, -.boostlook pre span.s2, -.boostlook pre span.se, -.boostlook pre span.si, -.boostlook pre span.sx, -.boostlook pre span.sr, -.boostlook pre span.s1, -.boostlook pre span.ss, -.boostlook pre span.string, -.boostlook .hljs-doctag, -.boostlook .hljs-string, -.boostlook .hljs-deletion, -.boostlook .hljs-number, -.boostlook .hljs-quote, -.boostlook .hljs-selector-class, -.boostlook .hljs-selector-id, -.boostlook .hljs-template-tag, -.boostlook .hljs-type { - color: var(--text-code-red, #f9677f); -} - -.boostlook .hljs-section, -.boostlook .hljs-selector-id, -.boostlook .hljs-title { - color: var(--text-code-blue, #329cd2); -} - -.boostlook .hljs-attribute, -.boostlook .hljs-name, -.boostlook .hljs-tag { - color: var(--text-main-text-primary, #18191b); -} - -/* Syntax Defaults */ -.boostlook .hljs-attribute, -.boostlook .hljs-doctag, -.boostlook .hljs-keyword, -.boostlook .hljs-meta .hljs-keyword, -.boostlook .hljs-name, -.boostlook .hljs-selector-tag, -.boostlook .hljs-section, -.boostlook .hljs-title { - font-weight: inherit; -} - -.boostlook .hljs-meta { - color: inherit; -} - -/* Table Headings */ -.boostlook h6:has(+ table) { - margin-left: 1em; -} - -/* Quote Blocks */ -.boostlook .quoteblock, -.boostlook .doc .quoteblock, -.boostlook .verseblock, -.boostlook .doc .verseblock, -.boostlook div.blockquote { - padding: var(--padding-padding-md, 1.125rem) var(--padding-padding-lg, 1.5rem); - border-radius: var(--spacing-size-size-0, 0rem) var(--spacing-size-2xs, 0.5rem) var(--spacing-size-2xs, 0.5rem) var(--spacing-size-size-0, 0rem); - border-left: 2px solid var(--border-border-active, #18191b); - background: var(--surface-background-main-surface-primary, #f5f6f8); - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-sm, 1rem); - font-weight: 400; - line-height: var(--typography-line-height-lg, 1.5rem); -} - -.boostlook .quoteblock:not(:first-child), -.boostlook .doc .quoteblock:not(:first-child), -.boostlook .verseblock:not(:first-child), -.boostlook .doc .verseblock:not(:first-child), -.boostlook div.blockquote:not(:first-child) { - margin-top: var(--padding-padding-2xs, 0.5rem); -} - -.boostlook .quoteblock blockquote, -.boostlook .doc .quoteblock blockquote, -.boostlook .verseblock blockquote, -.boostlook .doc .verseblock blockquote, -.boostlook div.blockquote blockquote { - margin: 0; -} - -.boostlook .quoteblock blockquote .paragraph, -.boostlook .doc .quoteblock blockquote .paragraph, -.boostlook .verseblock blockquote .paragraph, -.boostlook .doc .verseblock blockquote .paragraph, -.boostlook div.blockquote blockquote p { - font: inherit; -} - -.boostlook .quoteblock blockquote p, -.boostlook .doc .quoteblock blockquote p, -.boostlook .verseblock blockquote p, -.boostlook .doc .verseblock blockquote p { - margin: 0; - font: inherit; - color: inherit; -} - -/* Pagination */ -.boostlook nav.pagination { - border-top: revert; - line-height: initial; - margin: revert; - display: flex; - padding: var(--spacing-size-2xs, 0.5rem) var(--spacing-size-size-0, 0rem); - align-items: stretch; - gap: var(--spacing-size-2xs, 0.5rem); -} - -.boostlook nav.pagination > span { - display: flex; - flex-direction: column; - flex: 1 0 0; - backdrop-filter: blur(8px); - padding-right: revert; - padding-left: revert; - margin-left: revert; -} -.boostlook nav.pagination > span.next { - text-align: right; -} - -.boostlook nav.pagination span::before { - content: none !important; -} - -.boostlook nav.pagination > span a { - /* Container padding + two paddings of arrow icon container + arrow icon width + gap between arrow and content */ - --_arrow-based-padding: calc(var(--padding-padding-2xs) + (var(--spacing-size-3xs) * 2) + var(--icons-24) + var(--padding-padding-md)); - position: relative; - display: flex; - flex-direction: column; - justify-content: center; - width: 100%; - height: 100%; - border-radius: var(--padding-padding-xs, 0.75rem); - border: 1px solid var(--border-border-primary, #e4e7ea); - padding: var(--padding-padding-xs, 0.75rem); - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-sm, 1rem); - font-weight: 500; - line-height: var(--typography-line-height-lg, 1.5rem); /* 150% */ - letter-spacing: var(--spacing-size-size-0, 0rem); - text-decoration: none; - transition: background-color 0.3s ease; -} - -.boostlook nav.pagination > span:hover a { - background: var(--surface-background-main-surface-primary, #f5f6f8); - color: inherit; -} - -.boostlook nav.pagination > span.prev a { - padding-left: var(--_arrow-based-padding); -} -.boostlook nav.pagination > span.next a { - padding-right: var(--_arrow-based-padding); -} - -@media screen and (min-width: 990px) { - .boostlook nav.pagination > span a { - --_arrow-based-padding: calc(var(--padding-padding-2xs) + (var(--spacing-size-xs) * 2) + var(--icons-24) + var(--padding-padding-md)); - } -} - -.boostlook nav.pagination > span a::before { - width: auto; - position: static; - color: var(--text-main-text-body-quaternary, #949a9e); - font-size: var(--typography-font-size-2xs, 0.75rem); - font-weight: 500; - line-height: var(--typography-line-height-sm, 1rem); /* 133.333% */ - letter-spacing: var(--spacing-size-size-0, 0rem); - transform: revert; -} - -.boostlook nav.pagination > span.prev a::before { - content: "Previous"; -} -.boostlook nav.pagination > span.next a::before { - content: "Next"; -} - -.boostlook nav.pagination > span a::after { - --_arrow-size: calc((var(--spacing-size-3xs, 0.25rem) * 2) + var(--icons-24)); - position: absolute; - top: 50%; - display: flex; - width: var(--_arrow-size); - height: var(--_arrow-size); - align-items: center; - justify-content: center; - border: 1px solid transparent; - border-radius: var(--spacing-size-2xs, 0.5rem); - background: var(--surface-background-main-base-primary, #fff); - transition: all 0.2s ease; - transform: translateY(-50%); -} - -@media screen and (min-width: 990px) { - .boostlook nav.pagination > span a::after { - --_arrow-size: calc((var(--spacing-size-xs, 0.75rem) * 2) + var(--icons-24)); - } -} - -.boostlook nav.pagination > span.prev a::after { - content: var(--icon-arrow-left); - left: var(--padding-padding-2xs, 0.5rem); -} - -.boostlook nav.pagination > span.next a::after { - content: var(--icon-arrow-right); - right: var(--padding-padding-2xs, 0.5rem); -} - -.boostlook nav.pagination > span:hover a::after { - border-color: var(--border-border-blue, #92cbe9); - background: var(--surface-background-main-surface-blue-secondary, #daeef9); -} - -/* Admonitions */ -.boostlook #content .admonitionblock, -.boostlook:not(:has(.doc)) div.note, -.boostlook:not(:has(.doc)) div.tip, -.boostlook:not(:has(.doc)) div.important, -.boostlook:not(:has(.doc)) div.caution, -.boostlook:not(:has(.doc)) div.warning, -.boostlook:not(:has(.doc)) div.blurb, -.boostlook:not(:has(.doc)) p.blurb { - padding: var(--padding-padding-xs, 0.75rem) var(--padding-padding-md, 1.125rem); - border-radius: var(--spacing-size-xs, 0.75rem); - border: 1px solid transparent; - margin: revert; - background: transparent; -} - -/* Readme Template Admonitionblock */ -.boostlook:not(:has(.doc)) .notices { - background-image: none !important; -} - -.boostlook #content .admonitionblock > table, -.boostlook:not(:has(.doc)) div.note > table, -.boostlook:not(:has(.doc)) div.tip > table, -.boostlook:not(:has(.doc)) div.important > table, -.boostlook:not(:has(.doc)) div.caution > table, -.boostlook:not(:has(.doc)) div.warning > table, -.boostlook:not(:has(.doc)) div.blurb > table, -.boostlook:not(:has(.doc)) p.blurb > table { - all: revert; - table-layout: fixed; - position: relative; - width: 100%; -} - -.boostlook #content .admonitionblock > table tr, -.boostlook:not(:has(.doc)) div.note tbody, -.boostlook:not(:has(.doc)) div.tip tbody, -.boostlook:not(:has(.doc)) div.important tbody, -.boostlook:not(:has(.doc)) div.caution tbody, -.boostlook:not(:has(.doc)) div.warning tbody, -.boostlook:not(:has(.doc)) div.blurb tbody, -.boostlook:not(:has(.doc)) p.blurb tbody, -.boostlook:not(:has(.doc)) .notices { - display: flex; - flex-direction: column; - align-items: flex-start; - gap: var(--spacing-size-2xs, 0.5rem); -} - -.boostlook #content .admonitionblock > table tr td { - padding: 0; - border: unset; -} - -.boostlook #content .admonitionblock > table tr td.icon, -.boostlook:not(:has(.doc)) div.note > table tr:first-child th, -.boostlook:not(:has(.doc)) div.tip > table tr:first-child th, -.boostlook:not(:has(.doc)) div.important > table tr:first-child th, -.boostlook:not(:has(.doc)) div.caution > table tr:first-child th, -.boostlook:not(:has(.doc)) div.warning > table tr:first-child th, -.boostlook:not(:has(.doc)) div.blurb > table tr:first-child th, -.boostlook:not(:has(.doc)) p.blurb > table tr:first-child th, -.boostlook:not(:has(.doc)) .notices .heading { - display: flex; - padding: var(--spacing-size-3xs, 0.25rem) var(--spacing-size-2xs, 0.5rem); - align-items: center; - gap: var(--spacing-size-2xs, 0.5rem); - border-radius: 1.25rem; - background-color: var(--colors-neutral-500, #18191b); -} - -.boostlook:not(:has(.doc)) .notices .heading { - margin: 0; -} - -.boostlook:not(:has(.doc)) div.note > table tr:first-child th, -.boostlook:not(:has(.doc)) div.tip > table tr:first-child th, -.boostlook:not(:has(.doc)) div.important > table tr:first-child th, -.boostlook:not(:has(.doc)) div.caution > table tr:first-child th, -.boostlook:not(:has(.doc)) div.warning > table tr:first-child th, -.boostlook:not(:has(.doc)) div.blurb > table tr:first-child th, -.boostlook:not(:has(.doc)) p.blurb > table tr:first-child th, -.boostlook:not(:has(.doc)) div.note > table tr:first-child th > *, -.boostlook:not(:has(.doc)) div.tip > table tr:first-child th > *, -.boostlook:not(:has(.doc)) div.important > table tr:first-child th > *, -.boostlook:not(:has(.doc)) div.caution > table tr:first-child th > *, -.boostlook:not(:has(.doc)) div.warning > table tr:first-child th > *, -.boostlook:not(:has(.doc)) div.blurb > table tr:first-child th > *, -.boostlook:not(:has(.doc)) p.blurb > table tr:first-child th > *, -.boostlook #content .admonitionblock > table tr td.icon > *, -.boostlook:not(:has(.doc)) .notices .heading { - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-2xs, 0.75rem); - font-weight: 500; - line-height: var(--typography-line-height-sm, 1rem); /* 133.333% */ - letter-spacing: var(--spacing-size-size-0, 0rem); - text-transform: uppercase; -} -.boostlook #content .admonitionblock > table tr td.icon > * { - padding: 0; -} - -.boostlook #content .admonitionblock > table tr td.content, -/* Leagcy Doc */ -.boostlook:not(:has(.doc)) div.note > table tr:not(:first-child) td, -.boostlook:not(:has(.doc)) div.note > table tr:not(:first-child) td p, -.boostlook:not(:has(.doc)) div.tip > table tr:not(:first-child) td, -.boostlook:not(:has(.doc)) div.tip > table tr:not(:first-child) td p, -.boostlook:not(:has(.doc)) div.important > table tr:not(:first-child) td, -.boostlook:not(:has(.doc)) div.important > table tr:not(:first-child) td p, -.boostlook:not(:has(.doc)) div.caution > table tr:not(:first-child) td, -.boostlook:not(:has(.doc)) div.caution > table tr:not(:first-child) td p, -.boostlook:not(:has(.doc)) div.warning > table tr:not(:first-child) td, -.boostlook:not(:has(.doc)) div.warning > table tr:not(:first-child) td p, -.boostlook:not(:has(.doc)) div.blurp > table tr:not(:first-child) td, -.boostlook:not(:has(.doc)) div.blurp > table tr:not(:first-child) td p, -.boostlook:not(:has(.doc)) p.blurb > table tr:not(:first-child) td, -.boostlook:not(:has(.doc)) p.blurb > table tr:not(:first-child) td p, -/* Antora Template Correction*/ -.boostlook #content .admonitionblock > table tr td.content p, -.boostlook:not(:has(.doc)) .notices .message p { - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-xs, 0.875rem); - font-weight: 500; - line-height: var(--typography-line-height-lg, 1.5rem); /* 171.429% */ - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -.boostlook:not(:has(.doc)) .notices .message { - margin: 0; -} - -.boostlook #content .admonitionblock > table code, -.boostlook:not(:has(.doc)) div.note > table code, -.boostlook:not(:has(.doc)) div.tip > table code, -.boostlook:not(:has(.doc)) div.important > table code, -.boostlook:not(:has(.doc)) div.caution > table code, -.boostlook:not(:has(.doc)) div.warning > table code, -.boostlook:not(:has(.doc)) div.blurb > table code, -.boostlook:not(:has(.doc)) p.blurb > table code { - margin: revert; - padding: 0; -} - -.boostlook #content .admonitionblock.note, -.boostlook:not(:has(.doc)) div.note, -.boostlook:not(:has(.doc)) .notices.note { - border-color: var(--border-border-blue, #92cbe9); -} -.boostlook #content .admonitionblock.note > table tr td.icon, -.boostlook:not(:has(.doc)) div.note > table tr:first-child th, -.boostlook:not(:has(.doc)) .notices.note .heading { - background: var(--surface-background-states-surface-additional-tetriary, #92cbe9); -} -.boostlook #content .admonitionblock.note > table tr td.icon > *, -.boostlook:not(:has(.doc)) div.note > table tr:first-child th, -.boostlook:not(:has(.doc)) .notices.note .heading { - color: var(--text-states-text-additional-tetriary, #026a9f); -} - -.boostlook #content .admonitionblock.tip, -.boostlook:not(:has(.doc)) div.tip, -.boostlook:not(:has(.doc)) .notices.tip { - border-color: var(--border-border-positive, #bdeed6); -} -.boostlook #content .admonitionblock.tip > table tr td.icon, -.boostlook:not(:has(.doc)) div.tip > table tr:first-child th, -.boostlook:not(:has(.doc)) .notices.tip .heading { - background: var(--border-border-positive, #bdeed6); -} -.boostlook #content .admonitionblock.tip > table tr td.icon > *, -.boostlook:not(:has(.doc)) div.tip > table tr:first-child th, -.boostlook:not(:has(.doc)) .notices.tip .heading { - color: var(--text-states-text-positive-tetriary, #48ac7b); -} - -.boostlook #content .admonitionblock.important, -.boostlook #content .admonitionblock.caution, -.boostlook:not(:has(.doc)) div.important, -.boostlook:not(:has(.doc)) div.caution, -.boostlook:not(:has(.doc)) .notices.important { - border-color: var(--border-border-warning, #ffd4b3); -} -.boostlook #content .admonitionblock.important > table tr td.icon, -.boostlook #content .admonitionblock.caution > table tr td.icon, -.boostlook:not(:has(.doc)) div.important > table tr:first-child th, -.boostlook:not(:has(.doc)) div.caution > table tr:first-child th, -.boostlook:not(:has(.doc)) .notices.important { - background: var(--surface-background-states-surface-warning-tetriary, #ffd4b3); -} -.boostlook #content .admonitionblock.important > table tr td.icon > *, -.boostlook #content .admonitionblock.caution > table tr td.icon > *, -.boostlook:not(:has(.doc)) div.important > table tr:first-child th, -.boostlook:not(:has(.doc)) div.caution > table tr:first-child th, -.boostlook:not(:has(.doc)) .notices.important { - color: var(--text-states-text-warning-tetriary, #c25909); -} - -.boostlook #content .admonitionblock.warning, -.boostlook:not(:has(.doc)) div.warning, -.boostlook:not(:has(.doc)) .notices.warning { - border-color: var(--border-border-negative, #ffcad2); -} -.boostlook #content .admonitionblock.warning > table tr td.icon, -.boostlook:not(:has(.doc)) div.warning > table tr:first-child th, -.boostlook:not(:has(.doc)) .notices.warning .heading { - background: var(--surface-background-states-surface-negative-tetriary, #ffcad2); -} -.boostlook #content .admonitionblock.warning > table tr td.icon > *, -.boostlook:not(:has(.doc)) div.warning > table tr:first-child th, -.boostlook:not(:has(.doc)) .notices.warning .heading { - color: var(--text-states-text-negative-tetriary, #bc233c); -} - -/* Dlist */ -.boostlook #content .dlist:not(:first-child), -.boostlook .dlist dl dt:not(:first-child), -.boostlook:not(:has(.doc)) .variablelist:not(:first-child), -.boostlook:not(:has(.doc)) .variablelist dl dt:not(:first-child) { - margin-top: var(--padding-padding-2xs, 0.5rem); -} - -.boostlook .dlist dl, -.boostlook:not(:has(.doc)) .variablelist dl { - display: flex; - flex-direction: column; -} - -.boostlook .dlist dl dt, -.boostlook:not(:has(.doc)) .variablelist dl dt { - display: block; - width: fit-content; - padding: var(--leftbar-paddings-leftbar-padding-0, 0rem) var(--padding-padding-2xs, 0.5rem); - border-radius: var(--spacing-size-3xs, 0.25rem); - border: 1px solid var(--border-border-secondary, #d5d7d9); - border-bottom-left-radius: unset; - background: var(--surface-background-main-surface-primary, #f5f6f8); - color: var(--text-code-neutral, #0d0e0f); - font-size: var(--typography-font-size-xs, 0.875rem); - font-style: normal; - font-weight: 400; - line-height: var(--typography-line-height-lg, 1.5rem); /* 171.429% */ - letter-spacing: var(--spacing-size-size-0, 0rem); - margin-bottom: 0; -} - -.boostlook .dlist dl dt code, -.boostlook:not(:has(.doc)) .variablelist dl dt code { - border: none; - padding: 0; - background: transparent !important; -} - -.boostlook .dlist dl dt .term, -.boostlook:not(:has(.doc)) .variablelist dl dt .term { - font: inherit; - font-weight: inherit; -} - -.boostlook .dlist dl dd, -.boostlook:not(:has(.doc)) .variablelist dl dd { - margin: unset; - margin-top: -1px; - padding: var(--padding-padding-2xs, 0.5rem) var(--padding-padding-sm, 1rem); - border-radius: var(--padding-padding-2xs, 0.5rem); - border: 1px solid var(--border-border-primary, #e4e7ea); - border-top-left-radius: unset; - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-xs, 0.875rem); - line-height: var(--typography-line-height-lg, 1.5rem); -} - -.boostlook .dlist dl dd p, -.boostlook:not(:has(.doc)) .variablelist dl dd p { - font: inherit; - margin: 0; -} - -/* Edit Page Link */ -.boostlook .edit-this-page { - color: var(--text-main-text-body-quaternary, #949a9e); - text-align: right; - font-size: var(--typography-font-size-2xs, 0.75rem); - font-style: normal; - font-weight: 500; - line-height: var(--typography-line-height-sm, 1rem); /* 133.333% */ - letter-spacing: var(--spacing-size-size-0, 0rem); - padding: 0 var(--padding-padding-2xs, 0.5rem); -} - -.boostlook .edit-this-page a { - all: inherit; -} - -/* Layout Structure */ -.boostlook #header, -.boostlook #content, -.boostlook #footer { - padding-left: var(--main-margin); - padding-right: var(--main-margin); -} - -.boostlook #header { - padding-top: 1.25rem; -} - -.boostlook #footer { - padding-top: var(--padding-padding-sm); - padding-bottom: var(--padding-padding-sm); - color: var(--text-main-text-body-quaternary, #949a9e); - font-size: var(--typography-font-size-xs); - font-weight: 500; - line-height: var(--typography-line-height-sm, 1rem); /* 133.333% */ - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -/* Unordered Lists */ -/* Reset Legacy and Common */ -.boostlook .doc .dlist .dlist, -.boostlook .doc .dlist .olist, -.boostlook .doc .dlist .ulist, -.boostlook .doc .olist .dlist, -.boostlook .doc .olist .olist, -.boostlook .doc .olist .ulist, -.boostlook .doc .olist li + li, -.boostlook .doc .ulist .dlist, -.boostlook .doc .ulist .olist, -.boostlook .doc .ulist .ulist, -.boostlook .doc .ulist:not(.tablist) li + li, -.boostlook:not(:has(.doc)) div.orderedlist li + li { - margin-top: var(--padding-padding-3xs, 0.25rem); -} - -.boostlook:not(:has(.doc)) div.orderedlist div.orderedlist { - margin-top: var(--padding-padding-2xs, 0.5rem); -} - -.boostlook .doc .dlist .dlist, -.boostlook .doc .dlist .olist, -.boostlook .doc .dlist .ulist, -.boostlook .doc .olist .dlist, -.boostlook .doc .olist .olist, -.boostlook .doc .olist .ulist, -.boostlook .doc .ulist .dlist, -.boostlook .doc .ulist .olist, -.boostlook .doc .ulist .ulist, -.boostlook:not(:has(.doc)) div.orderedlist div.orderedlist { - margin-bottom: var(--padding-padding-2xs, 0.5rem); -} - -/* Default List */ -.boostlook ul.itemizedlist, -.boostlook .ulist:not(:first-child):not(.tablist), -.boostlook .ulist:not(:first-child).disc, -.boostlook#libraryReadMe ul:not(:first-child), -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content > ul:not([class]), -.boostlook:not(:has(.doc))#antora-template-wrapper > #content > ul:not([class]), -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content > ul:not([class]) { - margin-top: var(--padding-padding-xs, 0.75rem); -} - -.boostlook ul.itemizedlist, -.boostlook .ulist:not(.tablist) > ul, -.boostlook .ulist.disc > ul, -.boostlook#libraryReadMe ul, -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content > ul:not([class]), -.boostlook:not(:has(.doc))#antora-template-wrapper > #content > ul:not([class]), -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content > ul:not([class]) { - list-style: none; - padding: 0; -} - -.boostlook ul.itemizedlist { - list-style: none !important; -} - -.boostlook ul.itemizedlist > li, -.boostlook .ulist:not(.tablist) > ul > li, -.boostlook .ulist.disc > ul > li, -.boostlook#libraryReadMe ul > li, -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content > ul:not([class]) > li, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content > ul:not([class])> li, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content > ul:not([class])> li { - position: relative; - padding-left: 2rem; -} - -.boostlook ul.itemizedlist > li, -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content ul:not([class]) li, -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content ol:not([class]) li, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content ul:not([class]) li, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content ol:not([class]) li, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content ul:not([class]) li, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content ol:not([class]) li { - font: inherit; -} - -.boostlook ul.itemizedlist > li + li, -.boostlook .ulist:not(.tablist) > ul > li + li, -.boostlook .ulist.disc > ul > li + li, -.boostlook#libraryReadMe ul > li + li, -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content > ul:not([class]) > li + li, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content > ul:not([class]) > li + li, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content > ul:not([class]) > li + li { - margin-top: var(--padding-padding-3xs, 0.25rem); -} - -.boostlook ul.itemizedlist > li::before, -.boostlook .ulist:not(.tablist) > ul > li::before, -.boostlook .ulist.disc > ul > li::before, -.boostlook#libraryReadMe ul > li::before, -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content > ul:not([class]) > li::before, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content > ul:not([class]) > li::before, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content > ul:not([class]) > li::before { - content: "\2022"; - position: absolute; - left: 0; - top: 0; - width: 24px; - height: 24px; - display: flex; - align-items: center; - justify-content: center; - color: var(--text-main-text-primary, #18191b); -} - -/* Ordered Lists */ -.boostlook .olist.arabic > ol, -.boostlook .olist.loweralpha > ol, -.boostlook:not(:has(.doc)) .orderedlist > ol { - list-style: none; - counter-reset: list-counter; - padding-left: 0; -} - -/* Arabic Ordered List */ -.boostlook .olist.arabic > ol > li, -.boostlook:not(:has(.doc)) .orderedlist > ol > li { - position: relative; - padding-left: 3rem; - counter-increment: list-counter; -} - -.boostlook .olist.arabic > ol > li::before, -.boostlook:not(:has(.doc)) .orderedlist > ol > li::before { - content: counter(list-counter, decimal-leading-zero); - position: absolute; - left: 0; - top: -4px; - width: 32px; - height: 32px; - display: flex; - align-items: center; - justify-content: center; - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-2xs, 0.75rem); - font-weight: 400; - line-height: var(--typography-line-height-sm, 1rem); /* 133.333% */ -} - -.boostlook .olist.arabic > ol > li::after, -.boostlook:not(:has(.doc)) .orderedlist > ol > li::after { - content: ""; - position: absolute; - left: 1px; - top: 0px; - width: 30px; - height: 24px; - border: 1px solid var(--border-border-tetriary); - /* Mask to make square brackets for marker to make it look like [ 01 ] */ - clip-path: polygon(0 0, 3px 0, 3px 3px, 27px 3px, 27px 0, 30px 0, 30px 24px, 27px 24px, 27px 21px, 3px 21px, 3px 24px, 0 24px); -} - -/* LowerAlfa Ordered List */ -.boostlook .olist.loweralpha > ol > li { - position: relative; - padding-left: 2rem; - counter-increment: list-counter; -} - -.boostlook .olist.loweralpha > ol > li::before { - content: counter(list-counter, lower-alpha) ". "; - position: absolute; - left: 0; - top: 0; - width: 24px; - height: 24px; - display: flex; - align-items: center; - justify-content: center; - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-xs, 0.875rem); - font-weight: 500; - line-height: var(--Typography-line-height-lg, 1.5rem); /* 171.429% */ - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -/* Conum */ -.boostlook .doc .conum[data-value] { - position: relative; - border: none; - border-radius: 100%; - display: inline-flex; - align-items: center; - justify-content: center; - font-family: "Noto Sans Display"; - font-style: normal; - font-weight: 500; - line-height: var(--typography-line-height-sm, 1rem); - font-size: var(--typography-font-size-2xs, 0.75rem); - text-align: center; - width: 24px; - height: 24px; - letter-spacing: var(--spacing-size-size-0, 0rem); - text-indent: unset; - color: var(--text-main-text-primary, #18191b); - text-align: center; - background: var(--surface-background-main-surface-secondary, #e4e7ea); -} - -.boostlook .doc .conum[data-value]::after { - content: attr(data-value); - font: inherit; -} -.boostlook .doc .conum[data-value] + b { - display: none; -} - -/* Collist */ -.boostlook .colist.arabic { - margin: revert; -} -.boostlook .colist.arabic > table { - width: 100%; - border-collapse: collapse; - color: var(--text-main-text-body-primary); -} - -.boostlook .colist.arabic > table > tbody > tr td, -.boostlook .colist.arabic > table > tr td { - /* Reset Legacy */ - padding: revert; - padding-top: var(--padding-padding-3xs, 0.25rem); - padding-bottom: 0; - font-size: var(--typography-font-size-sm, 1rem); -} - -.boostlook .colist.arabic > table > tbody > tr > :first-child, -.boostlook .colist.arabic > table > tr > :first-child { - padding-left: 0; - padding-right: var(--padding-padding-sm, 1rem); - vertical-align: top; - /* to make first column fit its content */ - width: 1%; - white-space: nowrap; -} - -/* Tables */ -/* Reset Antora Table Styles */ -.boostlook #content table.tableblock tr, -.boostlook #content table.tableblock td, -.boostlook #content table.tableblock th, -.boostlook #content table.tableblock thead, -.boostlook #content table.tableblock tbody, -.boostlook #content table.tableblock tfoot, -.boostlook #content table.tableblock caption, -.boostlook #content table.tableblock colgroup, -.boostlook #content table.tableblock col, -.boostlook #content table.tableblock, -.boostlook:not(:has(.doc)) table.table tr, -.boostlook:not(:has(.doc)) table.table td, -.boostlook:not(:has(.doc)) table.table th, -.boostlook:not(:has(.doc)) table.table thead, -.boostlook:not(:has(.doc)) table.table tbody, -.boostlook:not(:has(.doc)) table.table tfoot, -.boostlook:not(:has(.doc)) table.table caption, -.boostlook:not(:has(.doc)) table.table colgroup, -.boostlook:not(:has(.doc)) table.table col, -.boostlook:not(:has(.doc)) table.table, -.boostlook#libraryReadMe > table, -.boostlook#libraryReadMe > table tr, -.boostlook#libraryReadMe > table td, -.boostlook#libraryReadMe > table th, -.boostlook#libraryReadMe > table thead, -.boostlook#libraryReadMe > table tbody, -.boostlook#libraryReadMe > table tfoot, -.boostlook#libraryReadMe > table caption, -.boostlook#libraryReadMe > table colgroup, -.boostlook#libraryReadMe > table col { - all: unset; - display: revert; -} - -.boostlook #content table.tableblock:not(:first-child), -.boostlook:not(:has(.doc)) .table:not(:first-child), -.boostlook#libraryReadMe > table:not(:first-child) { - margin-top: var(--padding-padding-xs, 0.75rem); -} - -.boostlook #content table.tableblock.stretch, -.boostlook:not(:has(.doc)) table.table, -.boostlook#libraryReadMe > table.stretch { - min-width: 100%; -} - -.boostlook #content table.tableblock caption, -.boostlook:not(:has(.doc)) div.table .title { - color: var(--text-main-text-body-primary, #2a2c30); - font-size: var(--typography-font-size-xs, 0.875rem); - font-style: normal; - font-weight: 600; - line-height: var(--typography-line-height-md, 1.25rem); /* 142.857% */ - padding: 0; - padding-bottom: var(--padding-padding-2xs, 0.5rem); -} - -.boostlook #content table.tableblock caption > *, -.boostlook:not(:has(.doc)) div.table .title > * { - font: inherit; - font-variation-settings: "wght" 500; - text-decoration: none; -} - -.boostlook:not(:has(.doc)) div.table .title { - padding-bottom: var(--padding-padding-2xs, 0.5rem) !important; -} - -.boostlook #content table.tableblock th, -.boostlook #content table.tableblock td, -.boostlook:not(:has(.doc)) table.table th, -.boostlook:not(:has(.doc)) table.table td, -.boostlook#libraryReadMe > table th, -.boostlook#libraryReadMe > table td { - padding: var(--padding-padding-3xs, 0.25rem) var(--padding-padding-2xs, 0.5rem); - text-align: left; - border-top: 1px solid var(--border-border-primary, #e4e7ea); - border-left: 1px solid var(--border-border-primary, #e4e7ea); -} - -.boostlook #content table.tableblock th:last-child, -.boostlook #content table.tableblock td:last-child, -.boostlook:not(:has(.doc)) table.table th:last-child, -.boostlook:not(:has(.doc)) table.table td:last-child, -.boostlook#libraryReadMe > table th:last-child, -.boostlook#libraryReadMe > table td:last-child { - border-right: 1px solid var(--border-border-primary, #e4e7ea); -} - -.boostlook #content table.tableblock tr:last-child td, -.boostlook:not(:has(.doc)) table.table tr:last-child td, -.boostlook#libraryReadMe > table tr:last-child td { - border-bottom: 1px solid var(--border-border-primary, #e4e7ea); -} - -.boostlook #content table.tableblock:has(thead) th:first-child, -.boostlook #content table.tableblock:not(:has(thead)) tr:first-child td:first-child, -.boostlook:not(:has(.doc)) table.table:has(thead) th:first-child, -.boostlook:not(:has(.doc)) table.table:not(:has(thead)) tr:first-child td:first-child, -.boostlook#libraryReadMe > table:has(thead) th:first-child, -.boostlook#libraryReadMe > table:not(:has(thead)) tr:first-child td:first-child { - border-top-left-radius: var(--spacing-size-2xs, 0.5rem); -} - -.boostlook #content table.tableblock:has(thead) th:last-child, -.boostlook #content table.tableblock:not(:has(thead)) tr:first-child td:last-child, -.boostlook:not(:has(.doc)) table.table:has(thead) th:last-child, -.boostlook:not(:has(.doc)) table.table:not(:has(thead)) tr:first-child td:last-child, -.boostlook#libraryReadMe > table:has(thead) th:last-child, -.boostlook#libraryReadMe > table:not(:has(thead)) tr:first-child td:last-child { - border-top-right-radius: var(--spacing-size-2xs, 0.5rem); -} - -.boostlook #content table.tableblock tr:last-child td:first-child, -.boostlook:not(:has(.doc)) table.table tr:last-child td:first-child, -.boostlook#libraryReadMe > table tr:last-child td:first-child { - border-bottom-left-radius: var(--spacing-size-2xs, 0.5rem); -} - -.boostlook #content table.tableblock tr:last-child td:last-child, -.boostlook:not(:has(.doc)) table.table tr:last-child td:last-child, -.boostlook#libraryReadMe > table tr:last-child td:last-child { - border-bottom-right-radius: var(--spacing-size-2xs, 0.5rem); -} - -.boostlook #content table.tableblock th, -.boostlook #content table.tableblock th strong, -.boostlook:not(:has(.doc)) table.table th, -.boostlook:not(:has(.doc)) table.table th strong, -.boostlook#libraryReadMe > table th, -.boostlook#libraryReadMe > table th strong { - background: var(--surface-background-main-surface-primary, #f5f6f8); - color: var(--text-main-text-body-tetriary, #62676b); - font-size: var(--typography-font-size-xs, 0.875rem); - font-weight: 500; - font-variation-settings: "wght" 500; - line-height: var(--typography-line-height-lg, 1.5rem); /* 171.429% */ -} - -.boostlook #content table.tableblock td, -.boostlook:not(:has(.doc)) table.table td, -.boostlook#libraryReadMe > table td { - color: var(--text-main-text-body-primary, #2a2c30); - font-size: var(--typography-font-size-xs, 0.875rem); - font-style: normal; - font-weight: 500; - line-height: var(--typography-line-height-lg, 1.5rem); /* 171.429% */ - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -.boostlook#libraryReadMe > table td { - vertical-align: middle; -} - -.boostlook #content table.tableblock td.valign-top, -.boostlook:not(:has(.doc)) table.table td.valign-top, -.boostlook#libraryReadMe > table td.valign-top { - vertical-align: top; -} - -.boostlook #content table.tableblock td.valign-bottom, -.boostlook:not(:has(.doc)) table.table td.valign-bottom, -.boostlook#libraryReadMe > table td.valign-bottom { - vertical-align: bottom; -} - -.boostlook #content table.tableblock td.valign-center, -.boostlook:not(:has(.doc)) table.table td.valign-center, -.boostlook#libraryReadMe > table td.valign-center { - vertical-align: middle; -} - -.boostlook #content table.tableblock td.halign-left, -.boostlook:not(:has(.doc)) table.table td.halign-left, -.boostlook#libraryReadMe > table td.halign-left { - text-align: left; -} - -.boostlook #content table.tableblock td.halign-center, -.boostlook:not(:has(.doc)) table.table td.halign-center, -.boostlook#libraryReadMe > table td.halign-center { - text-align: center; -} - -.boostlook #content table.tableblock th p, -.boostlook #content table.tableblock td p, -.boostlook:not(:has(.doc)) table.table th p, -.boostlook:not(:has(.doc)) table.table td p, -.boostlook#libraryReadMe > table th p, -.boostlook#libraryReadMe > table td p { - font: inherit; - color: inherit; -} - -.boostlook #content table.tableblock td strong, -.boostlook:not(:has(.doc)) table.table td strong, -.boostlook#libraryReadMe > table td strong { - font-weight: 600; - font-variation-settings: "wght" 600; -} - -.boostlook #content table.tableblock td code, -.boostlook:not(:has(.doc)) table.table td code, -.boostlook#libraryReadMe > table td code { - background: transparent !important; - padding: 0; - border: none; -} - -.boostlook #content table.tableblock .footnotes tr td, -.boostlook:not(:has(.doc)) table.table .footnotes tr td { - border: none; - border-radius: 0; - padding: var(--padding-padding-xs) 0; -} - -/* Image Styles */ -.boostlook .doc .imageblock, -.boostlook .doc .videoblock { - display: flex; - flex-direction: column; - align-items: center; -} - -.boostlook:not(#libraryReadMe) .image:has(> img), -.boostlook .content:has(> img), -.boostlook .mediaobject:has(> embed) { - display: flex; - padding: var(--padding-padding-md, 1.125rem); - flex-direction: column; - justify-content: center; - align-items: center; - border-radius: var(--spacing-size-xs, 0.75rem); - background: var(--surface-background-main-surface-primary, #f5f6f8); - width: 100%; - margin-top: var(--padding-padding-xs, 0.75rem); -} - -.boostlook:not(:has(.doc)) .inlinemediaobject:has(> img, > object) { - display: inline-block; - vertical-align: text-bottom; - line-height: 0; -} - -/*----------------- Global Styles for .boostlook end -----------------*/ - -/* ----------- Scrollbars Styles Start ------------- */ - -/** - * - * Scrollbar Styling - * - * This stylesheet provides comprehensive scrollbar customization for different contexts. - * - * Features: - * 1. Global Scrollbar Styles: - * - Applies thin scrollbar width and custom colors to the HTML element. - * - Customizes scrollbar appearance for elements within the `.boostlook` class. - * - * 2. Media Query Adjustments: - * - For screens with a minimum width of 768px, further customizes scrollbar colors for specific elements. - * - Changes scrollbar thumb color on hover for better visibility. - * - * 3. Webkit Scrollbar Customization: - * - Sets the width and height of the scrollbar. - * - Customizes the scrollbar track and thumb with specific colors and border-radius. - * - Adjusts scrollbar appearance for elements within the `.boostlook` class and its descendants. - * - * 4. Hover Effects: - * - Changes the scrollbar thumb color on hover for better user interaction. - * - */ - -@supports (scrollbar-width: thin) { - /* HTML Matches its scroll background to content background */ - html { - scrollbar-width: thin; - scrollbar-color: var(--border-border-tetriary, #afb3b6) var(--surface-background-main-base-primary, #fff); - } - - .boostlook, - .boostlook *, - .boostlook pre, - .boostlook code, - .boostlook:has(:not(.doc)) div.table .table-contents { - scrollbar-width: thin; - scrollbar-color: var(--border-border-tetriary, #afb3b6) transparent; - } - - @media screen and (min-width: 768px) { - .boostlook pre, - .boostlook code, - .boostlook:has(:not(.doc)) div.table .table-contents { - scrollbar-width: thin; - scrollbar-color: transparent transparent; - } - - .boostlook pre:hover, - .boostlook code:hover, - .boostlook:has(:not(.doc)) div.table .table-contents:hover { - scrollbar-color: var(--border-border-tetriary, #afb3b6) transparent; - } - } -} - -html::-webkit-scrollbar, -.boostlook::-webkit-scrollbar, -.boostlook *::-webkit-scrollbar { - width: 8px !important; - height: 8px !important; -} - -html::-webkit-scrollbar-track { - background: var(--surface-background-main-base-primary, #fff); - border-radius: var(--spacing-size-2xs, 0.5rem); -} - -.boostlook::-webkit-scrollbar-track, -.boostlook *::-webkit-scrollbar-track, -.boostlook pre::-webkit-scrollbar-track, -.boostlook code::-webkit-scrollbar-track, -.boostlook:has(:not(.doc)) div.table .table-contents::-webkit-scrollbar-track { - width: 6px; - background: transparent; - border-radius: var(--spacing-size-2xs, 0.5rem); -} - -html::-webkit-scrollbar-thumb, -.boostlook::-webkit-scrollbar-thumb, -.boostlook *::-webkit-scrollbar-thumb, -.boostlook pre::-webkit-scrollbar-thumb, -.boostlook code::-webkit-scrollbar-thumb, -.boostlook:has(:not(.doc)) div.table .table-contents::-webkit-scrollbar-thumb { - width: 6px; - background: var(--border-border-tetriary, #afb3b6); -} - -@media screen and (min-width: 768px) { - .boostlook pre::-webkit-scrollbar-thumb, - .boostlook code::-webkit-scrollbar-thumb, - .boostlook:has(:not(.doc)) div.table .table-contents::-webkit-scrollbar-thumb { - background: transparent; - } - - .boostlook pre:hover::-webkit-scrollbar-thumb, - .boostlook code:hover::-webkit-scrollbar-thumb, - .boostlook:has(:not(.doc)) div.table .table-contents:hover:-webkit-scrollbar-thumb { - background-color: var(--border-border-tetriary, #afb3b6); - } -} - -.boostlook .doc pre, -.boostlook p code, -.boostlook table code, -.boostlook p tt, -.boostlook p kbd, -.boostlook p samp, -.boostlook p pre, -.boostlook:not(:has(.doc)) pre, -.boostlook code, -.boostlook pre code, -.boostlook .doc .content pre code, -.boostlook#libraryReadMe pre code { - overflow-x: auto; -} - -/* ----------- Scrollbars Styles End ------------- */ - -/* Template-specific Adjustments */ - -/* Hide root scrollbars for Antora template */ -html:has(.article > .boostlook) { - height: 100vh; - overflow: hidden; -} - -/* Iframe container scrollbar handling */ -html:has(#docsiframe) { - overflow-y: hidden; -} - -/* Chrome/Edge scrollbar for iframe container */ -html:has(#docsiframe)::-webkit-scrollbar { - width: 0; - height: 0; -} - -/* Antora template - Scrollable content area */ -.boostlook #content:has(> .doc) { - overflow-y: auto; - height: 100vh; -} - -/* Asciidoc template - Content overflow handling */ -.boostlook:has(#content > .sect1) { - overflow-y: auto; - height: 100vh; -} - -/* Table Container */ -.boostlook .content div:has(> table), -.boostlook .doc table.tableblock, -.boostlook #content .sect3:has(.tableblock) { - overflow-x: auto !important; -} - -/* Article Layout */ -.article.toc2.toc-left { - min-height: 100vh; - /* with padding compensation */ - max-width: calc(var(--main-container) + 2rem); - margin-left: auto; - margin-right: auto; - background: var(--surface-background-main-base-primary, #fff); - position: relative; -} - -/* TOC Common start */ -/* Background Colors */ -.boostlook #toc.toc2, -.boostlook #header:not(:has(.nav-container)), -.boostlook #content, -.boostlook #footer { - background: var(--surface-background-main-base-primary, #fff); -} -/* TOC Scrolling */ -.boostlook #toc.toc2 { - overflow-y: auto; -} -/* TOC Positioning */ -.boostlook #toc.toc2, -#boost-legacy-docs-wrapper:not(:has(article.doc)) #toc.toc2.is-active, -#antora-template-wrapper:not(:has(article.doc)) #toc.toc2.is-active, -div.source-docs-antora.boostlook:not(:has(article.doc)):not(:has(> .boostlook)) #toc.toc2.is-active { - position: static; -} - -/* TOC Toggle Button */ -.boostlook #toggle-toc { - visibility: hidden; - height: 0; - width: 0; -} - -/* TOC Navigation Menu */ -.boostlook #toc ul, -.boostlook:not(:has(.doc)) div.toc dd { - margin: 0; - padding: 0 0 0 var(--leftbar-paddings-leftbar-padding-2xs, 0.5rem); - color: var(--text-main-text-body-secondary, #494d50); - font-size: var(--typography-font-size-xs, 0.875rem); - font-style: normal; - font-weight: 400; - line-height: var(--typography-line-height-md, 1.25rem); - list-style: none; - box-sizing: border-box; - position: relative; - z-index: 0; -} - -.boostlook #toc .nav-menu > .nav-list, -.boostlook #toc .nav-menu > .nav-list > .nav-list, -.boostlook #toc > ul.sectlevel1 { - padding-left: 0; -} - -.boostlook .nav-menu .nav-list li, -.boostlook #toc > ul.sectlevel1 li:not(:has(> ul)), -.boostlook #toc > ul.sectlevel1 li:has(> ul) a, -.boostlook:not(:has(.doc)) div.toc dt { - position: relative; - padding: var(--leftbar-paddings-leftbar-padding-4xs, 0.125rem) var(--leftbar-paddings-leftbar-padding-3xs, 0.25rem); -} - -.boostlook .nav-menu .nav-list li:has(.nav-text), -.boostlook #toc > ul.sectlevel1 li:has(> ul):not(:first-of-type) { - margin-top: var(--leftbar-paddings-leftbar-padding-4xs, 0.125rem); -} - -.boostlook .nav-text, -.boostlook #toc > ul.sectlevel1 li:has(> ul) > a { - color: var(--text-main-text-body-quaternary, #949a9e); - font-size: var(--typography-font-size-2xs, 0.75rem); - font-weight: 500; - line-height: var(--typography-line-height-sm, 1rem); - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -/* Table of Contents Links */ -.boostlook #toc a, -.boostlook:not(:has(.doc)) div.toc a { - color: var(--text-main-text-body-secondary, #494d50); - font-size: var(--typography-font-size-xs, 0.875rem); - font-style: normal; - font-weight: 400; - line-height: var(--typography-line-height-md, 1.25rem); /* 142.857% */ - text-decoration: none; -} - -.boostlook #toc a:hover, -.boostlook #toc a:focus, -.boostlook #toc > ul.sectlevel1 li:has(> ul) > a:hover, -.boostlook #toc > ul.sectlevel1 li:has(> ul) > a:focus, -.boostlook:not(:has(.doc)) div.toc a:hover, -.boostlook:not(:has(.doc)) div.toc a:focus { - color: var(--text-main-text-link-blue-secondary, #0284c7); - text-decoration: none; -} - -.boostlook #toc .nav-link:visited:not(:hover), -.boostlook #toc .sectlevel1 li:not(:has(> ul)) a:visited:not(:hover), -.boostlook:not(:has(.doc)) div.toc a:visited:not(:hover) { - color: var(--text-main-text-link-viewed, #62b3dd); -} - -.boostlook .nav-list li[data-depth]:not([data-depth="1"]), -.boostlook #toc > ul.sectlevel1 ul[class*="sectlevel"] > li, -.boostlook:not(:has(.doc)) div.toc dd dt { - margin-left: calc(var(--leftbar-paddings-leftbar-padding-2xs) * -1); - padding-left: calc(var(--padding-padding-sm, 1rem) + var(--leftbar-paddings-leftbar-padding-2xs)); -} - -.boostlook .nav-list li[data-depth]:not([data-depth="1"])::before, -.boostlook #toc > ul.sectlevel1 ul[class*="sectlevel"] > li::before, -.boostlook:not(:has(.doc)) div.toc dd dt:before { - content: ""; - position: absolute; - left: var(--leftbar-paddings-leftbar-padding-2xs); - top: 0; - width: 1px; - height: 100%; - background: var(--border-border-secondary, #d5d7d9); -} - -.boostlook .nav-list li[data-depth]:not([data-depth="1"]):hover::before, -.boostlook #toc > ul.sectlevel1 li:not(:has(> ul)):hover::before, -.boostlook:not(:has(.doc)) div.toc dd dt:hover:before { - background-color: var(--border-border-blue-hover, #329cd2); - isolation: isolate; - z-index: 1; -} - -/* Navigation Menu Title */ -.boostlook #toc #toctitle, -.boostlook .nav-menu h3.title { - padding: var(--leftbar-paddings-leftbar-padding-3xs, 0.25rem); - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-2xs, 0.75rem); - line-height: var(--typography-line-height-sm, 1rem); - letter-spacing: var(--spacing-size-size-0, 0rem); - font-weight: 600; -} - -/* TOC code in links */ -.boostlook #toc a code, -.boostlook:not(:has(.doc)) div.toc a code { - /* slightly reduce code elements font size in side menu */ - font-size: 0.96em; - display: inline; - background: none !important; - padding: 0; - border: none; - color: inherit; - transition: none; -} - -/* Content */ -.boostlook #content .doc, -.boostlook #content > .sect1, -.boostlook #header > *, -.boostlook #footer > * { - max-width: var(--main-content-width); - margin: 0 auto; -} - -.boostlook #preamble + .sect1, -.boostlook .doc .sect1 + .sect1 { - margin-top: revert; -} - -html:not(.is-clipped--nav):has(.boostlook) div#content { - display: block; - visibility: visible; -} - -html.is-clipped--nav:has(.boostlook) div#content { - display: none; - visibility: hidden; -} - -/* Responsive Design */ -@media screen and (min-width: 768px) { - .article.toc2.toc-left { - padding: 0 1rem 0 1rem; - } - - .boostlook #toggle-toc { - visibility: visible; - height: auto; - width: auto; - } - - .boostlook #toc.toc2 { - position: fixed; - width: var(--main-max-width-leftbar); - left: max(1rem, 50% - 45rem); - top: 0; - z-index: 1000; - height: 100vh; - padding: 0; - overflow-x: hidden; - overflow-y: auto; - border-right: 1px solid var(--border-border-primary, #e4e7ea); - visibility: visible; - } - - .boostlook #toc.toc2:not(.nav-container) { - padding: 1rem 1.5rem; - } - - .boostlook #toc.toc2:not(.nav-container):has(#toggle-toc) { - /* Extra left padding if toc toggle exists */ - padding: 1rem 1.5rem 1rem 2.2rem; - } - - .toc2 .boostlook { - margin-left: var(--main-max-width-leftbar); - } - - /* TOC Toggle Button */ - .boostlook #toggle-toc { - position: fixed; - top: 2rem; - left: max(1rem, 50% - 39rem - 1rem); - background-color: var(--surface-background-main-base-primary); - box-shadow: 0 0px 3px var(--surface-background-main-surface-transparent-inverse); - border: 0; - padding: 0; - cursor: pointer; - background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2224px%22%20viewBox%3D%220%20-960%20960%20960%22%20width%3D%2224px%22%20fill%3D%22%235f6368%22%3E%3Cpath%20d%3D%22M400-240l240-240-240-240-56%2056%20184%20184-184%20184%2056%2056Z%22%2F%3E%3C%2Fsvg%3E"); - background-repeat: no-repeat; - background-position: center; - border-radius: 1rem; - height: 2rem; - width: 2rem; - text-indent: -9999px; - z-index: 1001; - } - - /* Hidden TOC */ - html.toc-hidden .boostlook { - margin-left: 0; - } - - html.toc-hidden .boostlook #toggle-toc { - left: max(2px, 50% - 45rem - 1rem); - } - - /* Visible TOC */ - html.toc-visible .boostlook #toggle-toc { - left: max(2px, 50% - 45rem - 1rem); - background-color: var(--surface-background-main-base-primary); - } - - html.toc-visible .boostlook { - margin-left: 0; - } - - html.toc-hidden .boostlook #toc.toc2 { - visibility: hidden; - } - - html.toc-visible #toc.toc2 { - opacity: 1; - visibility: visible; - /* width: 250px; - padding-left: 1.5rem; */ - } - - /* TOC Shadow States */ - html.toc-visible:not(.toc-pinned) #toc.toc2 { - box-shadow: 4px 0 12px 0px rgba(0, 0, 0, 0.1); - } - - /* TOC Pin States */ - html.toc-visible.toc-pinned #toggle-toc { - background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2224px%22%20viewBox%3D%220%20-960%20960%20960%22%20width%3D%2224px%22%20fill%3D%22%235f6368%22%3E%3Cpath%20d%3D%22M560-240%20320-480l240-240%2056%2056-184%20184%20184%20184-56%2056Z%22%2F%3E%3C%2Fsvg%3E"); - } - - html.toc-visible.toc-pinned .boostlook { - margin-left: var(--main-max-width-leftbar); - } -} -/* TOC Common End */ - -/*----------------- Styles specific to AsciiDoctor content start -----------------*/ - -/** - * AsciiDoctor-Specific Styles - * Styles that apply specifically to content generated by AsciiDoctor. - * These styles handle: - * 1. Article layout and structure - * 2. Table of contents (TOC) styling - * 3. Content formatting - * 4. Responsive design adjustments - */ - -/* Header Adjustments */ -.boostlook #header > h1 { - margin-top: 0; -} - -.boostlook #header .author { - display: inline-block; - margin-top: var(--padding-padding-md, 1.125rem); - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-lg, 1.25rem); - font-style: normal; - font-weight: 500; - line-height: var(--typography-line-height-xl, 1.75rem); - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -/* Rouge Syntax Highlighting */ -.boostlook pre.rouge .o { - font-weight: 400; -} - -.boostlook pre.rouge code span { - font-style: normal; -} - -/*----------------- Styles specific to AsciiDoctor content end -----------------*/ - -/*----------------- Styles specific to Antora Templates start -----------------*/ - -/** - * Antora Template Styles - * Specific styles for Antora-generated documentation. - * These styles handle: - * 1. Header and navigation layout - * 2. Typography customization - * 3. Navigation menu structure - * 4. Content layout and formatting - * 5. Responsive design adaptations - */ - -/* Table of Contents */ -.boostlook .nav { - height: 100%; - padding: var(--spacing-size-sm, 1rem) var(--spacing-size-lg, 1.5rem); - position: static; - background-color: unset; - box-shadow: none; - height: auto; - overflow-y: auto; -} - -/* Toc Navigation */ -.boostlook #toc .nav-menu h3.title a { - color: inherit; - font: inherit; -} - -.boostlook #toc .nav-menu h3.title a:focus, -.boostlook #toc .nav-menu h3.title a:hover { - color: var(--text-main-text-link-blue-secondary, #0284c7); -} - -/* Navigation Menu */ -.boostlook .nav-panel-menu { - overflow: visible; -} - -.boostlook .nav-close { - display: none; -} - -.boostlook .nav-menu > .nav-list > .nav-list { - margin-left: 0; -} - -.boostlook .nav-list li[data-depth="1"].is-current-page.is-active { - padding-left: 1.375rem; -} - -.boostlook .nav-list li[data-depth="1"].is-current-page.is-active::before { - content: ""; - position: absolute; - width: 0.125rem; - height: 0.125rem; - border-radius: 2rem; - left: 0.625rem; - top: 50%; - transform: translateY(-50%); - background-color: var(--surface-icons-icon-blue, #026a9f); -} - -.boostlook .nav-list li[data-depth]:not([data-depth="1"]).is-current-page.is-active::before { - background-color: var(--text-main-text-primary, #18191b); -} - -/* Active Page Indicator */ -.boostlook .nav-list .is-current-page.is-active { - position: relative; - border-radius: var(--padding-padding-3xs, 0.25rem); - background: var(--surface-background-main-surface-blue-secondary, #daeef9); -} - -.boostlook #toc .nav-list .is-current-page.is-active > .nav-link { - font-weight: 400; - color: var(--text-main-text-primary, #18191b); -} - -/* Header Layout */ -.boostlook #header:has(.nav-container) { - padding: 0; -} - -/* Typography */ -.boostlook .doc, -.boostlook .doc i { - font: inherit; -} -.boostlook .doc i { - color: inherit; -} - -/* TOC Container */ -.boostlook #toc.toc2.nav-container { - position: fixed; -} - -.boostlook #toc.toc2.nav-container.is-active { - position: static; - height: 100vh; - padding: 0; - overflow-y: auto; -} - -/* Nav Toggle */ -.boostlook #content .nav-toggle { - display: flex; - padding: var(--spacing-size-3xs, 0.25rem); - align-items: center; - border: none; - border-radius: var(--spacing-size-2xs, 0.5rem); - outline: none; - line-height: inherit; - height: unset; - width: unset; - margin-right: var(--padding-padding-xs, 0.5rem); - - background: var(--surface-background-main-base-primary, #fff); - background-size: auto; - background-position-x: auto; -} - -.boostlook #content .nav-toggle:before { - content: var(--icon-menu); - line-height: 0; -} - -@media screen and (min-width: 768px) { - .boostlook #content .nav-toggle { - display: none; - visibility: hidden; - } -} - -/* Layout */ -.boostlook .article .content { - gap: 1rem; -} - -.boostlook #content:has(.toc.sidebar) { - display: flex; -} - -.boostlook #footer:has(> script):not(:has(> div)) { - padding-top: 0; -} - -/* Toolbar */ -.boostlook .toolbar { - position: static; - height: auto; - width: 100%; - display: flex; - align-items: center; - justify-content: space-between; - padding: var(--padding-padding-md, 1.125rem) 0; - color: var(--text-main-text-body-tetriary, #62676b); - background-color: transparent; - box-shadow: unset; -} - -.boostlook .toolbar + h1 { - margin-top: 0; -} - -/* Breadcrumbs */ -.boostlook .breadcrumbs { - display: block; - flex: 1 1; - padding: 0; - font-size: inherit; - line-height: revert; - overflow: auto; - scrollbar-width: none; - margin-right: var(--spacing-size-3xs); -} - -.boostlook .breadcrumbs::-webkit-scrollbar { - display: none; -} - -.boostlook .breadcrumbs ul { - display: flex; - flex-wrap: nowrap; - align-items: center; - margin: 0; - padding: 0; - list-style: none; - color: var(--text-main-text-body-tetriary, #62676b); - font-size: var(--typography-font-size-xs, 0.875rem); - font-weight: 500; - line-height: var(--typography-line-height-lg, 1.5rem); /* 171.429% */ - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -.boostlook .breadcrumbs ul li { - font: inherit; - display: flex; - align-items: center; - white-space: nowrap; -} - -@media screen and (max-width: 767px) { - .boostlook .breadcrumbs ul li:not(:first-child):not(:last-child) { - display: none; - } -} - -.boostlook .breadcrumbs ul li a { - font: inherit; - color: var(--text-main-text-link-blue-secondary, #0284c7); - text-decoration: none; - position: relative; -} - -.boostlook .breadcrumbs ul li a:hover { - text-decoration: underline; -} - -.boostlook .breadcrumbs ul li:first-of-type { - display: flex; - align-items: center; - padding: var(--spacing-size-3xs, 0.25rem); - margin-right: var(--padding-padding-xs, 0.75rem); - gap: var(--spacing-size-2xs, 0.5rem); - border-radius: var(--spacing-size-2xs, 0.5rem); - border: 1px solid var(--border-border-primary, #e4e7ea); - background: var(--surface-background-main-surface-primary, #f5f6f8); -} - -.boostlook .breadcrumbs ul li:first-of-type::after { - content: none; -} - -.boostlook .breadcrumbs ul li:first-of-type a { - display: flex; - align-items: center; - gap: var(--spacing-size-3xs, 0.25rem); - line-height: 0; - color: var(--text-main-text-primary, #18191b); - text-decoration: none; -} - -.boostlook .breadcrumbs ul li::after { - content: ""; - display: inline-block; - flex-shrink: 0; - flex-grow: 0; - width: 2px; - height: 2px; - border-radius: 50%; - background: var(--surface-icons-icon-tetriary, #949a9e); - padding: 0; - margin: 0 var(--spacing-size-2xs, 0.5rem); -} - -.boostlook .breadcrumbs ul li:first-of-type::after, -.boostlook .breadcrumbs ul li:last-of-type::after { - content: none; -} - -.boostlook .breadcrumbs ul li:first-of-type a svg { - display: none; -} - -.boostlook .breadcrumbs ul li:first-of-type a::before { - content: var(--icon-home); -} - -/* Spirit Navigation */ -.boostlook .toolbar .spirit-nav, -.boostlook:not(:has(.doc)) .spirit-nav { - display: flex; - align-items: center; - gap: 0.125rem; -} - -.boostlook:not(:has(.doc)) .spirit-nav { - padding-top: var(--padding-padding-md, 1.125rem); - justify-content: flex-end; -} - -.boostlook .toolbar .spirit-nav a, -.boostlook:not(:has(.doc)) .spirit-nav a { - display: flex; - align-items: center; - justify-content: center; - gap: var(--spacing-size-2xs, 0.5rem); - border-radius: var(--spacing-size-2xs, 0.5rem); - /* border: 1px solid var(--border-border-primary, #e4e7ea); */ - /* background: var(--surface-background-main-base-primary, #fff); */ - width: 32px; - height: 32px; - text-decoration: none; - padding: 0; - position: relative; - transition: all 0.2s ease; -} - -.boostlook .toolbar .spirit-nav a:hover, -.boostlook:not(:has(.doc)) .spirit-nav a:hover { - border: 1px solid var(--border-border-blue, #92cbe9); - background: var(--surface-background-main-surface-blue-secondary, #daeef9); -} - -.boostlook .toolbar .spirit-nav a span { - overflow: hidden; - position: relative; -} - -.boostlook:not(:has(.doc)) .spirit-nav a img { - display: none; - border-width: 0px; -} - -/* hide default icons if elemnts exists */ -.boostlook .toolbar .spirit-nav a span[title*="Previous"], -.boostlook .toolbar .spirit-nav a span[title*="Next"], -.boostlook .toolbar .spirit-nav a span[title*="Up"] { - color: transparent; - display: block; - width: 100%; - height: 100%; -} - -.boostlook .toolbar .spirit-nav a span[title*="Previous"]::after, -.boostlook .toolbar .spirit-nav a span[title*="Next"]::after, -.boostlook .toolbar .spirit-nav a span[title*="Up"]::after, -.boostlook:not(:has(.doc)) .spirit-nav a[accesskey]::after { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - line-height: 0; -} - -.boostlook .toolbar .spirit-nav a span[title*="Previous"]::after, -.boostlook:not(:has(.doc)) .spirit-nav a[accesskey="p"]::after { - content: var(--icon-arrow-left); -} -.boostlook .toolbar .spirit-nav a span[title*="Next"]::after, -.boostlook:not(:has(.doc)) .spirit-nav a[accesskey="n"]::after { - content: var(--icon-arrow-right); -} -.boostlook .toolbar .spirit-nav a span[title*="Up"]::after, -.boostlook:not(:has(.doc)) .spirit-nav a[accesskey="u"]::after { - content: var(--icon-arrow-up); -} -.boostlook .toolbar .spirit-nav a span[title*="Up"]::after, -.boostlook:not(:has(.doc)) .spirit-nav a[accesskey="u"]::after { - content: var(--icon-arrow-up); -} - -.boostlook:not(:has(.doc)) .spirit-nav a[accesskey="h"]::after { - content: var(--icon-home); -} - -/* Tabs Elements */ -.boostlook .tabs .tabpanel { - border: revert; - padding: var(--padding-padding-xs, 0.75rem) 0; - background: transparent; -} - -.boostlook .tablist, -.boostlook .tabs .tabpanel { - border-bottom: 1px solid var(--border-border-primary, #e4e7ea); -} - -.boostlook .tablist > ul .tab { - position: relative; - display: flex; - padding: var(--padding-padding-2xs, 0.5rem) var(--padding-padding-md, 1.125rem); - justify-content: center; - align-items: center; - color: var(--text-main-text-body-tetriary, #62676b); - font-size: var(--typography-font-size-xs, 0.875rem); - font-weight: 400; - line-height: var(--typography-line-height-md, 1.25rem); /* 142.857% */ - cursor: pointer; - border: none; - background: transparent; -} - -.boostlook .tabs.is-loading .tablist li:first-child::after, -.boostlook .tabs:not(.is-loading) .tablist li.is-selected::after { - content: ""; - display: block; - height: 1px; - position: absolute; - bottom: -1px; - left: 0; - right: 0; - border-bottom: 1px solid var(--text-main-text-primary, #18191b); -} - -.boostlook .tablist > ul .tab * { - color: inherit; -} - -.boostlook .tablist > ul .tab.is-selected, -.boostlook .tablist > ul .tab:hover { - color: var(--text-main-text-primary, #18191b); -} - -.boostlook .tablist.ulist > ul li + li { - margin-left: unset; -} - -.boostlook .tabs:not(.is-loading) .tablist .tab:not(.is-selected) { - background-color: transparent; -} - -/*----------------- Styles specific to Antora Templates end -----------------*/ - -/*---------- Quickbook docs styling fixes -----------*/ - -/** - * Quickbook Documentation Styles - * Comprehensive styling for Quickbook-generated documentation, including: - * 1. Typography and heading hierarchy - * 2. Content blocks and spacing - * 3. Navigation and spirit-nav elements - * 4. Special elements (notes, tips, etc.) - * 5. Code and syntax highlighting - */ - -#boost-legacy-docs-wrapper:has(> .boostlook), -#antora-template-wrapper:has(> .boostlook), -div.source-docs-antora.boostlook:has(> .boostlook) { - /* CharConv template fix */ - margin: auto; -} - -/* Legacy boostlook container */ -.boostlook#boost-legacy-docs-wrapper, -.boostlook#antora-template-wrapper, -div.source-docs-antora.boostlook { - margin-top: 0; - max-width: unset; - overflow: hidden; - position: relative; - min-height: 100vh; -} - -.boostlook#boost-legacy-docs-wrapper > #header, -.boostlook#boost-legacy-docs-wrapper > #content, -.boostlook#boost-legacy-docs-wrapper > #footer, -.boostlook#boost-legacy-docs-wrapper > #footnotes, -.boostlook#antora-template-wrapper > #header, -.boostlook#antora-template-wrapper > #content, -.boostlook#antora-template-wrapper > #footer, -.boostlook#antora-template-wrapper > #footnotes, -div.source-docs-antora.boostlook > #header, -div.source-docs-antora.boostlook > #content, -div.source-docs-antora.boostlook > #footer, -div.source-docs-antora.boostlook > #footnotes { - /* width: auto; - max-width: unset; - margin-left: auto; */ - padding-left: unset; - padding-right: unset; -} - -/* Add Side margin for legacy boostlook container */ -#boost-legacy-docs-wrapper:not(:has(.doc)):not(:has(> .boostlook)), -#antora-template-wrapper:not(:has(.doc)):not(:has(> .boostlook)), -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) { - padding: 0 var(--main-margin, 3rem); -} - -/* Title Block Common */ -.boostlook:not(:has(.doc)) > .section > .titlepage:first-of-type, -.boostlook:not(:has(.doc)) > .document > .titlepage:first-of-type, -.boostlook:not(:has(.doc)) > .refentry > .titlepage:first-of-type, -.boostlook:not(:has(.doc)) > .chapter > .titlepage:first-of-type, -.boostlook:not(:has(.doc)) > .book > .titlepage:first-of-type, -.boostlook:not(:has(.doc)) > .article > .titlepage:first-of-type { - margin-bottom: var(--padding-padding-md, 1.125rem); -} - -/* Title Styles */ -.boostlook:not(:has(.doc)) > .section > .titlepage:first-of-type .title, -.boostlook:not(:has(.doc)) > .document > .titlepage:first-of-type .title, -.boostlook:not(:has(.doc)) > .refentry > .titlepage:first-of-type .title, -.boostlook:not(:has(.doc)) > .chapter > .titlepage:first-of-type .title, -.boostlook:not(:has(.doc)) > .book > .titlepage:first-of-type .title, -.boostlook:not(:has(.doc)) > .article > .titlepage:first-of-type .title { - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-2xl, 1.75rem); - font-style: normal; - font-weight: 500; - line-height: var(--typography-line-height-3xl, 2.5rem); - letter-spacing: var(--spacing-size-size-0, 0rem); - margin: 0; -} - -/* Title Author */ -.boostlook:not(:has(.doc)) > .section > .titlepage:first-of-type .author, -.boostlook:not(:has(.doc)) > .document > .titlepage:first-of-type .author, -.boostlook:not(:has(.doc)) > .refentry > .titlepage:first-of-type .author, -.boostlook:not(:has(.doc)) > .chapter > .titlepage:first-of-type .author, -.boostlook:not(:has(.doc)) > .book > .titlepage:first-of-type .author, -.boostlook:not(:has(.doc)) > .article > .titlepage:first-of-type .author, -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content .author, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content .author, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content .author { - margin: 0; - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-lg, 1.25rem); - font-style: normal; - font-weight: 500; - line-height: var(--typography-line-height-xl, 1.75rem); - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -/* Top margin for first Author in title */ -.boostlook:not(:has(.doc)) > .section > .titlepage:first-of-type div.author, -.boostlook:not(:has(.doc)) > .document > .titlepage:first-of-type div.author, -.boostlook:not(:has(.doc)) > .refentry > .titlepage:first-of-type div.author, -.boostlook:not(:has(.doc)) > .chapter > .titlepage:first-of-type div.author, -.boostlook:not(:has(.doc)) > .book > .titlepage:first-of-type div.author, -.boostlook:not(:has(.doc)) > .article > .titlepage:first-of-type div.author, -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content div.author, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content div.author, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content div.author { - margin-top: var(--padding-padding-md, 1.125rem); -} - -/* Reduce top margin for next authors in authors group */ -.boostlook:not(:has(.doc)) > .section > .titlepage:first-of-type .authorgroup div.author:not(:first-child), -.boostlook:not(:has(.doc)) > .document > .titlepage:first-of-type .authorgroup div.author:not(:first-child), -.boostlook:not(:has(.doc)) > .refentry > .titlepage:first-of-type .authorgroup div.author:not(:first-child), -.boostlook:not(:has(.doc)) > .chapter > .titlepage:first-of-type .authorgroup div.author:not(:first-child), -.boostlook:not(:has(.doc)) > .book > .titlepage:first-of-type .authorgroup div.author:not(:first-child), -.boostlook:not(:has(.doc)) > .article > .titlepage:first-of-type .authorgroup div.author:not(:first-child) { - margin-top: var(--padding-padding-2xs); -} - -/* Remove Top Margin for next .copyright */ -.boostlook:not(:has(.doc)) > .section > .titlepage:first-of-type div:has(div.author) + div:has(div.author) .author, -.boostlook:not(:has(.doc)) > .document > .titlepage:first-of-type div:has(div.author) + div:has(div.author) .author, -.boostlook:not(:has(.doc)) > .refentry > .titlepage:first-of-type div:has(div.author) + div:has(div.author) .author, -.boostlook:not(:has(.doc)) > .chapter > .titlepage:first-of-type div:has(div.author) + div:has(div.author) .author, -.boostlook:not(:has(.doc)) > .book > .titlepage:first-of-type div:has(div.author) + div:has(div.author) .author, -.boostlook:not(:has(.doc)) > .article > .titlepage:first-of-type div:has(div.author) + div:has(div.author) .author { - margin-top: var(--padding-padding-3xs); -} - -/* Title Copyright */ -.boostlook:not(:has(.doc)) > .section > .titlepage:first-of-type .copyright, -.boostlook:not(:has(.doc)) > .document > .titlepage:first-of-type .copyright, -.boostlook:not(:has(.doc)) > .refentry > .titlepage:first-of-type .copyright, -.boostlook:not(:has(.doc)) > .chapter > .titlepage:first-of-type .copyright, -.boostlook:not(:has(.doc)) > .book > .titlepage:first-of-type .copyright, -.boostlook:not(:has(.doc)) > .article > .titlepage:first-of-type .copyright, -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content .copyright, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content .copyright, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content .copyright { - color: var(--text-main-text-body-secondary, #494d50); - font-size: var(--typography-font-size-xs, 0.875rem); - font-style: normal; - font-weight: 400; - line-height: var(--typography-line-height-lg, 1.5rem); - margin-top: var(--padding-padding-2xs, 0.5rem); -} - -/* Remove Top Margin for next .copyright */ -.boostlook:not(:has(.doc)) > .section > .titlepage:first-of-type div:has(.copyright) + div:has(.copyright) .copyright, -.boostlook:not(:has(.doc)) > .document > .titlepage:first-of-type div:has(.copyright) + div:has(.copyright) .copyright, -.boostlook:not(:has(.doc)) > .refentry > .titlepage:first-of-type div:has(.copyright) + div:has(.copyright) .copyright, -.boostlook:not(:has(.doc)) > .chapter > .titlepage:first-of-type div:has(.copyright) + div:has(.copyright) .copyright, -.boostlook:not(:has(.doc)) > .book > .titlepage:first-of-type div:has(.copyright) + div:has(.copyright) .copyright, -.boostlook:not(:has(.doc)) > .article > .titlepage:first-of-type div:has(.copyright) + div:has(.copyright) .copyright { - margin-top: 0; -} - -/* Title Legalnotice */ -.boostlook:not(:has(.doc)) > .section > .titlepage:first-of-type .legalnotice, -.boostlook:not(:has(.doc)) > .document > .titlepage:first-of-type .legalnotice, -.boostlook:not(:has(.doc)) > .refentry > .titlepage:first-of-type .legalnotice, -.boostlook:not(:has(.doc)) > .chapter > .titlepage:first-of-type .legalnotice, -.boostlook:not(:has(.doc)) > .book > .titlepage:first-of-type .legalnotice, -.boostlook:not(:has(.doc)) > .article > .titlepage:first-of-type .legalnotice, -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content .legalnotice, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content .legalnotice, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #content .legalnotice { - color: var(--text-main-text-body-primary, #2a2c30); - font-size: var(--typography-font-size-sm, 1rem); - font-style: normal; - font-weight: 400; - line-height: var(--typography-line-height-lg, 1.5rem); - margin-top: var(--padding-padding-2xs, 0.5rem); -} - -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content .legalnotice, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content .legalnotice, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > #content .legalnotice { - margin-bottom: var(--padding-padding-md, 1.125rem); -} - -/* Remove
s */ -.boostlook:not(:has(.doc)) .titlepage hr { - display: none; -} - -/* Table of Contents */ -.boostlook:not(:has(.doc)) div.toc { - color: var(--text-main-text-body-secondary, #494d50); - font-family: var(--font-family-body, "Noto Sans"); - font-size: var(--typography-font-size-xs, 0.875rem); - font-style: normal; - font-weight: 400; - line-height: var(--typography-line-height-md, 1.25rem); - margin: 0; - margin-bottom: var(--padding-padding-md, 1.125rem); - padding: 0; - border: none; -} - -.boostlook:not(:has(.doc)) div.toc > p { - display: flex; - padding: var(--spacing-size-3xs, 0.25rem); - color: var(--text-main-text-primary, #18191b); - font-size: var(--typography-font-size-2xs, 0.75rem); - font-weight: 600; - line-height: var(--typography-line-height-sm, 1rem); /* 133.333% */ - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -.boostlook:not(:has(.doc)) div.toc > p > * { - font: inherit; - color: inherit; -} - -.boostlook:not(:has(.doc)) div.toc .toc dt { - color: var(--text-main-text-body-secondary, #494d50); - font-size: var(--typography-font-size-xs, 0.875rem); - font-style: normal; - font-weight: 400; - line-height: var(--typography-line-height-md, 1.25rem); -} - -.boostlook:not(:has(.doc)) div.toc dd dd { - padding-left: var(--leftbar-paddings-leftbar-padding-sm); -} - -/* Section Layout */ -.boostlook#boost-legacy-docs-wrapper:not(:has(.doc)):not(:has(> .boostlook)) > *, -.boostlook#antora-template-wrapper:not(:has(.doc)):not(:has(> .boostlook)) > *, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > * { - max-width: var(--main-content-width); - /* margin-left: inherit; - margin-right: inherit; */ - margin: 0 auto; -} - -/* hide footer spirit nav since it wasn't visible before */ -.boostlook:not(:has(.doc)) div:nth-of-type(4).spirit-nav, -.boostlook#boost-legacy-docs-wrapper div.spirit-nav:last-child, -.boostlook#antora-template-wrapper div.spirit-nav:last-child, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) div.spirit-nav:last-child { - display: none !important; -} - -/* hidden elems */ -.boostlook:not(:has(.doc)) > hr, -.boostlook:not(:has(.doc)) .table-break { - display: none; -} - -/* Content Blocks */ -.boostlook:not(:has(.doc)) .inlinemediaobject:has(> img):first-child:last-child { - margin: var(--padding-padding-xs, 0.75rem) 0; -} - -.boostlook:not(:has(.doc)) a:is(h1 a, h2 a, h3 a, h4 a, h5 a) code { - background: transparent !important; - border: none; - font-size: inherit; - color: inherit; - padding: 0; - display: initial; - transition: none; -} - -/* Special Blocks */ -/* hide legacy icon */ -.boostlook:not(:has(.doc)) div:not(.admonitionblock).note > table tr:first-child td, -.boostlook:not(:has(.doc)) div:not(.admonitionblock).tip > table tr:first-child td, -.boostlook:not(:has(.doc)) div:not(.admonitionblock).important > table tr:first-child td, -.boostlook:not(:has(.doc)) div:not(.admonitionblock).caution > table tr:first-child td, -.boostlook:not(:has(.doc)) div:not(.admonitionblock).warning > table tr:first-child td, -.boostlook:not(:has(.doc)) div:not(.admonitionblock).blurb > table tr:first-child td, -.boostlook:not(:has(.doc)) p.blurb > table tr:first-child td { - display: none; -} - -/* Special Blocks Margins */ -.boostlook:not(:has(.doc)) div.note, -.boostlook:not(:has(.doc)) div.tip, -.boostlook:not(:has(.doc)) div.important, -.boostlook:not(:has(.doc)) div.caution, -.boostlook:not(:has(.doc)) div.warning, -.boostlook:not(:has(.doc)) div.blurb, -.boostlook:not(:has(.doc)) p.blurb { - margin-top: var(--padding-padding-xs, 0.75rem); - margin-bottom: var(--padding-padding-2xs); -} - -.boostlook:not(:has(.doc)) .titlepage + div.note, -.boostlook:not(:has(.doc)) .titlepage + div.tip, -.boostlook:not(:has(.doc)) .titlepage + div.important, -.boostlook:not(:has(.doc)) .titlepage + div.caution, -.boostlook:not(:has(.doc)) .titlepage + div.warning, -.boostlook:not(:has(.doc)) .titlepage + div.blurb, -.boostlook:not(:has(.doc)) .titlepage + p.blurb { - margin-top: var(--padding-padding-2xs); -} - -/* Tables */ -/* Make div with Table display block */ -.boostlook:has(:not(.doc)) div.table { - display: block; -} - -/* Enable Horizontal Scroll */ -.boostlook:has(:not(.doc)) div.table .table-contents, -.boostlook:has(:not(.doc)) .informaltable:has(> .table) { - overflow: auto; -} - -/* References Table */ -/* This is specific selector for refences tables which containes many tables and only tables as direct children */ -.boostlook:has(:not(.doc)) .informaltable:has(> table:nth-of-type(2)):not(:has(> *:not(table))) { - display: flex; - flex-direction: column; - gap: var(--padding-padding-md, 1.125rem); - /* border: 2px solid red; */ -} - -/* Disable margins for all Headings inside table */ -.boostlook:has(:not(.doc)) .informaltable:has(> .table) :is(h1, h2, h3, h4, h5, h6) { - margin: 0; -} - -/* Table has inner table th */ -.boostlook:has(:not(.doc)) .informaltable:has(> table:nth-of-type(2)):not(:has(> *:not(table))) .table:has(.simplelist) th { - border: none; - padding: 0 0 var(--padding-padding-xs, 0.75rem) 0; - background: none; - color: var(--text-main-text-primary, #18191b); - font-size: var(--Typography-font-size-md, 1.125rem); - font-style: normal; - font-weight: 500; - line-height: var(--typography-line-height-xl, 1.75rem); /* 155.556% */ - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -/* Disable global cell paddings */ -.boostlook:has(:not(.doc)) .informaltable:has(> table:nth-of-type(2)):not(:has(> *:not(table))) .table:has(.simplelist) > tbody > tr > td { - padding: 0; -} - -/* Add border radius to tbody first row */ -.boostlook:has(:not(.doc)) .informaltable:has(> table:nth-of-type(2)):not(:has(> *:not(table))) .table:has(.simplelist) tr:last-child td:first-child { - border-top-left-radius: var(--spacing-size-2xs, 0.5rem); - overflow: hidden; -} - -/* Add border radius to tbody first row */ -.boostlook:has(:not(.doc)) .informaltable:has(> table:nth-of-type(2)):not(:has(> *:not(table))) .table:has(.simplelist) tr:last-child td:last-child { - border-top-right-radius: var(--spacing-size-2xs, 0.5rem); - overflow: hidden; -} - -/* Select Inner Headings and make it look as table head */ -.boostlook:has(:not(.doc)) .informaltable:has(> table:nth-of-type(2)):not(:has(> *:not(table))) .table:has(.simplelist) tbody :is(h1, h2, h3, h4, h5, h6) { - padding: var(--padding-padding-3xs, 0.25rem) var(--padding-padding-2xs, 0.5rem); - gap: var(--spacing-size-xs, 0.75rem); - background: var(--surface-background-main-surface-primary, #f5f6f8); - color: var(--text-main-text-body-tetriary, #62676b); - font-size: var(--typography-font-size-xs, 0.875rem); - font-style: normal; - font-weight: 500; - line-height: var(--typography-line-height-lg, 1.5rem); /* 171.429% */ - letter-spacing: var(--spacing-size-size-0, 0rem); -} - -/* Inner table styles */ -.boostlook:has(:not(.doc)) .informaltable:has(> table:nth-of-type(2)):not(:has(> *:not(table))) table.simplelist { - width: 100%; -} - -.boostlook:has(:not(.doc)) .informaltable:has(> table:nth-of-type(2)):not(:has(> *:not(table))) table.simplelist td { - border: none; - padding: var(--padding-padding-3xs, 0.25rem) var(--padding-padding-2xs, 0.5rem); -} - -/* Footnotes */ -.boostlook:has(:not(.doc)) .footnotes { - margin-top: var(--padding-padding-lg); - border-top: 1px solid var(--border-border-primary); -} - -.boostlook:has(:not(.doc)) .footnotes hr { - display: none; -} - -/* Copyright Footer */ -/* If Footer has no content than use it as bottom spacer */ -.boostlook .copyright-footer:empty { - padding-top: var(--main-margin); -} - -/* If Footer has content */ -.boostlook .copyright-footer:not(:empty) { - padding: var(--padding-padding-lg) 0; -} - -/* Footer Content */ -.boostlook:not(:has(.doc)) .copyright-footer { - color: var(--text-main-text-body-quaternary, #949a9e); - font-size: var(--typography-font-size-xs); - font-weight: 500; - line-height: var(--typography-line-height-sm, 1rem); - letter-spacing: var(--spacing-size-size-0, 0rem); - text-align: left; -} - -/* Footer Content */ -.boostlook:not(:has(.doc)) .copyright-footer p { - text-align: inherit; - font-size: var(--typography-font-size-2xs); - color: var(--text-main-text-body-primary, #2a2c30); -} - -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content hr, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content hr, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > #content hr { - display: none; -} - -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content div.code-snippet, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content div.code-snippet, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > #content div.code-snippet { - position: relative; -} - -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content div.highlight:has(> pre), -.boostlook:not(:has(.doc))#antora-template-wrapper > #content div.highlight:has(> pre), -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > #content div.highlight:has(> pre) { - margin: 0; - border: none; - padding: 0; -} - -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content div.highlight:has(> pre) pre, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content div.highlight:has(> pre) pre, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > #content div.highlight:has(> pre) pre { - padding: var(--spacing-size-xs, 0.75rem) var(--spacing-size-sm, 1rem); - margin-top: var(--padding-padding-3xs, 0.25rem); -} - -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content > pre:not([class]), -.boostlook:not(:has(.doc))#antora-template-wrapper > #content > pre:not([class]), -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > #content > pre:not([class]) { - margin-left: 0; - margin-right: 0; -} - -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content div.code-snippet:has(pre):not(:last-child) pre:not([class]), -.boostlook:not(:has(.doc))#antora-template-wrapper > #content div.code-snippet:has(pre):not(:last-child) pre:not([class]), -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > #content div.code-snippet:has(pre):not(:last-child) pre:not([class]), -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content > pre:not([class]):not(:last-child), -.boostlook:not(:has(.doc))#antora-template-wrapper > #content > pre:not([class]):not(:last-child), -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > #content > pre:not([class]):not(:last-child), -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content div.code-snippet:not(:last-child) pre, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content div.code-snippet:not(:last-child) pre, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > #content div.code-snippet:not(:last-child) pre { - margin-bottom: var(--padding-padding-xs, 0.75rem); -} - -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content + p:has(> small), -.boostlook:not(:has(.doc))#antora-template-wrapper > #content + p:has(> small), -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > #content + p:has(> small) { - padding: var(--padding-padding-lg) 0 !important; -} - -/* Outcome 2.2 Weird Template fix */ -.boostlook:not(:has(.doc))#boost-legacy-docs-wrapper > #content .footnotes, -.boostlook:not(:has(.doc))#antora-template-wrapper > #content .footnotes, -div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(> .boostlook)) > #content .footnotes { - padding-top: var(--padding-padding-xs, 0.75rem); -} - -@media screen and (min-width: 768px) { - body.article:has(.boostlook#boost-legacy-docs-wrapper), - body.article:has(.boostlook#antora-template-wrapper), - body.article:has(div.source-docs-antora.boostlook) { - /* !important ovverides website own styles !important - * Adjust this to "padding: 0 1rem 0 1rem" - * when website container width will be used as in new look design - */ - padding: 0 !important; - } - - #boost-legacy-docs-wrapper .boostlook #toc.toc2, - #antora-template-wrapper .boostlook #toc.toc2, - div.source-docs-antora.boostlook:has(> .boostlook) .boostlook #toc.toc2 { - /* Adjust this to "max(1rem, 50% - 45rem)" - * when website container width will be used as in new look design - */ - left: max(0rem, 50% - 45rem); - } -} - -/*----------------- Quickbook Documentation Styles end -----------------*/ - -/*----------------- Library README Styles start -----------------*/ - -.boostlook#libraryReadMe { - margin-left: 0; -} - -.boostlook#libraryReadMe > * { - max-width: unset; - margin-left: inherit; - margin-right: inherit; -} - -.boostlook#libraryReadMe > h1:first-child { - margin-top: 0; -} - -.boostlook#libraryReadMe div.highlight:has(> pre) { - background: transparent !important; -} - -/*----------------- Library README Styles end -----------------*/