mirror of
https://github.com/boostorg/boostlook.git
synced 2026-01-19 04:02:14 +00:00
4323 lines
161 KiB
CSS
4323 lines
161 KiB
CSS
/**
|
|
* 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
|
|
* <div class="boostlook">
|
|
* <div class="header">
|
|
* <h1>Title</h1>
|
|
* <div id="toc" class="toc2">
|
|
* <button id="toggle-toc">Show Table of Contents</button>
|
|
* <ul class="sectlevel1">TOC Links</ul>
|
|
* </div>
|
|
* </div>
|
|
* <div id="content">
|
|
* <div class="sect1">Content Sections</div>
|
|
* </div>
|
|
* <div id="footer">Footer Content</div>
|
|
* </div>
|
|
*
|
|
* 2. Antora Template:
|
|
* example: https://www.boost.io/doc/libs/1_87_0/doc/antora/url/index.html
|
|
* <div class="boostlook">
|
|
* <div id="header">
|
|
* <div id="toc" class="nav-container toc2">Navigation</div>
|
|
* </div>
|
|
* <div id="content">
|
|
* <article class="doc max-width-reset">
|
|
* <div class="toolbar">Breadcrumbs and Spirit Nav</div>
|
|
* <h1>Title</h1>
|
|
* <div class="sect1">Content Sections</div>
|
|
* </article>
|
|
* </div>
|
|
* <div id="footer">Footer Content</div>
|
|
* </div>
|
|
*
|
|
* 3. Quickbook Template:
|
|
* example: https://www.boost.io/doc/libs/1_87_0/doc/html/accumulators.html
|
|
* <div class="boostlook">
|
|
* <div class="spirit-nav">Navigation</div>
|
|
* <div class="chapter"> <!-- might also be .section, .refentry, .document, or .book -->
|
|
* <div class="titlepage">Title and information</div>
|
|
* <div class="toc">Table of Contents</div>
|
|
* <div class="section>Content</div>
|
|
* <div class="copyright-footer">Footer</div>
|
|
* </div>
|
|
* </div>
|
|
*
|
|
* 4. README Template:
|
|
* example: https://www.boost.io/library/1.87.0/beast/
|
|
* <section id="libraryReadMe" class="boostlook">ReadMe Content</section>
|
|
*/
|
|
|
|
/**
|
|
* 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-50: #fdf1f3ff;
|
|
--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-50: #f0fef7ff;
|
|
--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-50: #fff8f3ff;
|
|
--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-25: #ebf4f9;
|
|
--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;
|
|
|
|
/* Atom One Dark Theme Colors */
|
|
--atom-one-dark-bg: #282c34;
|
|
--atom-one-dark-text: #abb2bf;
|
|
--atom-one-dark-comment: #5c6370;
|
|
--atom-one-dark-keyword: #c678dd;
|
|
--atom-one-dark-operator: #e06c75;
|
|
--atom-one-dark-function: #61aeee;
|
|
--atom-one-dark-string: #98c379;
|
|
--atom-one-dark-variable: #d19a66;
|
|
--atom-one-dark-constant: #56b6c2;
|
|
--atom-one-dark-class: #e6c07b;
|
|
|
|
/* Atom One Light Theme Colors */
|
|
--atom-one-light-bg: #fafafa;
|
|
--atom-one-light-text: #383a42;
|
|
--atom-one-light-comment: #a0a1a7;
|
|
--atom-one-light-keyword: #a626a4;
|
|
--atom-one-light-operator: #e45649;
|
|
--atom-one-light-function: #4078f2;
|
|
--atom-one-light-string: #50a14f;
|
|
--atom-one-light-variable: #986801;
|
|
--atom-one-light-constant: #0184bb;
|
|
--atom-one-light-class: #c18401;
|
|
|
|
/* Colors Other */
|
|
--colors-neutral-150: #d5d7d9;
|
|
--colors-neutral-850: #2a2c30;
|
|
--colors-overlay-overlay-white-40: rgba(255 255 255 / 0.4);
|
|
--colors-overlay-overlay-black-40: rgba(13 14 15 / 0.4);
|
|
--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-body: "Noto Sans";
|
|
--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(--atom-one-light-operator);
|
|
--text-code-green: var(--atom-one-light-string);
|
|
--text-code-blue: var(--atom-one-light-function);
|
|
--text-code-yellow: var(--atom-one-light-variable);
|
|
--text-code-purple: var(--atom-one-light-keyword);
|
|
--text-code-turquoise: var(--atom-one-light-constant);
|
|
--text-code-neutral: var(--atom-one-light-text);
|
|
--text-code-navy: var(--atom-one-light-class);
|
|
|
|
--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-primary: var(--colors-blue-25);
|
|
--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-primary: var(--colors-warning-50);
|
|
--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-primary: var(--colors-positive-50);
|
|
--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-primary: var(--colors-negative-50);
|
|
--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-primary: var(--colors-blue-100);
|
|
--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(--atom-one-dark-operator);
|
|
--text-code-green: var(--atom-one-dark-string);
|
|
--text-code-blue: var(--atom-one-dark-function);
|
|
--text-code-yellow: var(--atom-one-dark-variable);
|
|
--text-code-purple: var(--atom-one-dark-keyword);
|
|
--text-code-turquoise: var(--atom-one-dark-constant);
|
|
--text-code-neutral: var(--atom-one-dark-text);
|
|
--text-code-navy: var(--atom-one-dark-class);
|
|
|
|
--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-primary: var(--colors-blue-900);
|
|
--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-primary: var(--colors-warning-950);
|
|
--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-primary: var(--colors-positive-950);
|
|
--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-primary: var(--colors-negative-950);
|
|
--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-primary: var(--colors-blue-850);
|
|
--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";
|
|
font-style: normal;
|
|
font-weight: 100 900;
|
|
font-stretch: 62.5% 100%;
|
|
/* Variable font weight range */
|
|
font-variation-settings: "wght" 400, "wdth" 62.5;
|
|
font-display: block;
|
|
/* Prevents FOIT */
|
|
src: url("/static/font/notosans.woff2") format("woff2"),
|
|
url("../../../../tools/boostlook/notosans.woff2") format("woff2"),
|
|
url("https://cppalliance.org/fonts/NotoSansDisplay.ttf") format("truetype");
|
|
}
|
|
|
|
/* Noto Sans Display - Italic */
|
|
@font-face {
|
|
font-family: "Noto Sans";
|
|
font-style: italic;
|
|
font-weight: 100 900;
|
|
font-stretch: 62.5% 100%;
|
|
/* Variable font weight range */
|
|
font-variation-settings: "wght" 400, "wdth" 62.5;
|
|
font-display: block;
|
|
/* Prevents FOIT */
|
|
src: url("/static/font/notosans_mono_ext.woff") format("woff"),
|
|
url("../../../../tools/boostlook/notosans_mono_ext.woff") format("woff"),
|
|
url("https://cppalliance.org/fonts/NotoSansMono.ttf") format("truetype");
|
|
}
|
|
|
|
/* Noto Sans Mono - Variable Weight */
|
|
@font-face {
|
|
font-family: "Noto Sans Mono";
|
|
font-style: normal;
|
|
font-weight: 100 900;
|
|
font-stretch: 62.5% 100%;
|
|
/* Variable font weight range */
|
|
font-variation-settings: "wght" 400, "wdth" 62.5;
|
|
font-display: block;
|
|
/* Prevents FOIT */
|
|
src: url("/static/font/notosans_mono.woff") format("woff"),
|
|
url("../../../../tools/boostlook/notosans_mono.woff") format("woff"),
|
|
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: 62.5% 100%;
|
|
font-display: block;
|
|
/* Prevents FOIT */
|
|
src: url("/static/font/notosans_mono.woff") format("woff"),
|
|
url("../../../../tools/boostlook/notosans_mono.woff") format("woff"),
|
|
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: var(--font-family-body, "Noto Sans") !important;
|
|
font-variation-settings: "wght" 400, "wdth" 80;
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
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);
|
|
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 Mono";
|
|
font-size: inherit;
|
|
}
|
|
|
|
/* Text Emphasis */
|
|
.boostlook b,
|
|
.boostlook strong {
|
|
font-variation-settings: "wght" 600, "wdth" 80;
|
|
}
|
|
|
|
/* 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);
|
|
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);
|
|
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(--atom-one-light-bg, #fafafa);
|
|
border-radius: 0;
|
|
border: unset;
|
|
}
|
|
|
|
/* Dark theme code block background */
|
|
html.dark .boostlook pre,
|
|
html.dark .boostlook pre.rouge,
|
|
html.dark .boostlook .doc .content pre,
|
|
html.dark .boostlook .doc pre.highlight,
|
|
html.dark .boostlook .doc .listingblock pre:not(.highlight),
|
|
html.dark .boostlook .doc .literalblock pre {
|
|
background: var(--atom-one-dark-bg, #282c34);
|
|
}
|
|
|
|
.boostlook .doc pre {
|
|
padding: initial;
|
|
}
|
|
|
|
.boostlook .content:has(> pre),
|
|
.boostlook .content:has(> pre.highlight) {
|
|
border-radius: 0;
|
|
border: 1px solid var(--border-border-secondary, #d5d7d9);
|
|
background: var(--surface-background-main-surface-secondary, #e4e7ea);
|
|
}
|
|
|
|
.boostlook pre.programlisting,
|
|
.boostlook pre.synopsis,
|
|
.boostlook pre.literallayout,
|
|
.boostlook#libraryReadMe > pre {
|
|
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-variation-settings: "wght" 600, "wdth" 80;
|
|
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";
|
|
font-size: var(--typography-font-size-2xs, 0.75rem);
|
|
font-style: normal;
|
|
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:not(:has(.doc)) pre.synopsis,
|
|
.boostlook#libraryReadMe > pre,
|
|
.boostlook#libraryReadMe .literalblock:has(pre),
|
|
.boostlook#libraryReadMe div.highlight:has(> pre) {
|
|
margin: 0;
|
|
border: none;
|
|
background-color: transparent;
|
|
padding:0;
|
|
}
|
|
|
|
/* Apply left margin only if code block not in definition block or in table */
|
|
.boostlook .listingblock:has(> .content > pre):not(:is(dd pre, td pre)),
|
|
.boostlook .listingblock:has(> .content > pre.highlight):not(:is(dd pre, td pre)),
|
|
.boostlook:not(:has(.doc)) pre.programlisting:not(:is(dd pre, td pre)),
|
|
.boostlook:not(:has(.doc)) pre.synopsis:not(:is(dd pre, td pre)),
|
|
.boostlook#libraryReadMe > pre:not(:is(dd pre, td pre)),
|
|
.boostlook#libraryReadMe .literalblock:has(pre):not(:is(dd pre, td pre)),
|
|
.boostlook#libraryReadMe div.highlight:has(> pre):not(:is(dd pre, td pre)) {
|
|
margin-left: var(--spacing-size-xl);
|
|
border: 1px solid var(--border-border-secondary, #d5d7d9);
|
|
background: var(--atom-one-light-bg, #fafafa);
|
|
margin-top: var(--padding-padding-xs, 0.75rem);
|
|
}
|
|
|
|
.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:not(:has(.doc)) pre.synopsis: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";
|
|
font-size: var(--typography-font-size-2xs, 0.75rem);
|
|
font-style: normal;
|
|
font-variation-settings: "wght" 500, "wdth" 80;
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
line-height: var(--typography-line-height-md);
|
|
letter-spacing: var(--spacing-size-size-0, 0rem);
|
|
}
|
|
|
|
.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(--atom-one-light-comment, #a0a1a7);
|
|
font-style: italic;
|
|
}
|
|
|
|
/* Dark theme comment color */
|
|
html.dark .boostlook pre span.c,
|
|
html.dark .boostlook pre span.ch,
|
|
html.dark .boostlook pre span.cm,
|
|
html.dark .boostlook pre span.cp,
|
|
html.dark .boostlook pre span.cpf,
|
|
html.dark .boostlook pre span.c1,
|
|
html.dark .boostlook pre span.cs,
|
|
html.dark .boostlook pre span.sd,
|
|
html.dark .boostlook pre span.sh,
|
|
html.dark .boostlook pre span.comment,
|
|
html.dark .boostlook .hljs-comment,
|
|
html.dark .boostlook .hljs-quote,
|
|
html.dark .boostlook .hljs-addition,
|
|
html.dark .boostlook .hljs-built_in,
|
|
html.dark .boostlook .hljs-bullet,
|
|
html.dark .boostlook .hljs-code {
|
|
color: var(--atom-one-dark-comment, #5c6370);
|
|
}
|
|
|
|
.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);
|
|
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);
|
|
line-height: var(--typography-line-height-lg, 1.5rem);
|
|
}
|
|
|
|
/* Add intendation */
|
|
.boostlook .sectionbody .quoteblock,
|
|
.boostlook .sectionbody .doc .quoteblock,
|
|
.boostlook .sectionbody .verseblock,
|
|
.boostlook .sectionbody .doc .verseblock,
|
|
.boostlook .sectionbody div.blockquote,
|
|
.boostlook .section .quoteblock,
|
|
.boostlook .section .doc .quoteblock,
|
|
.boostlook .section .verseblock,
|
|
.boostlook .section .doc .verseblock,
|
|
.boostlook .section div.blockquote {
|
|
margin-left: var(--spacing-size-xl, 2rem);
|
|
}
|
|
|
|
.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-variation-settings: "wght" 500, "wdth" 80;
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
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-size-0, 0rem);
|
|
border: 1px solid transparent;
|
|
margin: revert;
|
|
margin-left: var(--spacing-size-xl);
|
|
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;
|
|
align-items: center;
|
|
gap: var(--spacing-size-2xs, 0.5rem);
|
|
/* Removes legacy icon */
|
|
background: transparent;
|
|
}
|
|
|
|
.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-sm, 1rem);
|
|
font-variation-settings: "wght" 600, "wdth" 62.5;
|
|
line-height: var(--typography-line-height-lg, 1.5rem);
|
|
letter-spacing: var(--spacing-size-size-0, 0rem);
|
|
/* text-transform: uppercase; */
|
|
}
|
|
.boostlook #content .admonitionblock > table tr td.icon > * {
|
|
padding: 0;
|
|
font-family: var(--font-family-body, "Noto Sans");
|
|
}
|
|
|
|
.boostlook #content .admonitionblock > table tr td.icon i.fa::after {
|
|
content: attr(title);
|
|
}
|
|
|
|
.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-variation-settings: "wght" 400, "wdth" 80;
|
|
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;
|
|
}
|
|
|
|
/* Note */
|
|
.boostlook #content .admonitionblock.note,
|
|
.boostlook:not(:has(.doc)) div.note,
|
|
.boostlook:not(:has(.doc)) .notices.note {
|
|
border-color: var(--border-border-blue-primary, #c2e2f4);
|
|
background-color: var(--surface-background-main-surface-blue-primary, #ebf4f9);
|
|
}
|
|
/* .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-main-text-primary, #18191b);
|
|
}
|
|
|
|
/* Tip */
|
|
.boostlook #content .admonitionblock.tip,
|
|
.boostlook:not(:has(.doc)) div.tip,
|
|
.boostlook:not(:has(.doc)) .notices.tip {
|
|
border-color: var(--border-border-positive, #bdeed6);
|
|
background-color: var(--surface-background-states-surface-positive-primary, #f0fef7);
|
|
}
|
|
/* .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-main-text-primary, #18191b);
|
|
}
|
|
|
|
/* Important */
|
|
.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-brand-orange, #ffd897);
|
|
background-color: var(--surface-background-states-surface-warning-primary, #fff8f3);
|
|
}
|
|
/* .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-main-text-primary, #18191b);
|
|
}
|
|
|
|
/* Warning */
|
|
.boostlook #content .admonitionblock.warning,
|
|
.boostlook:not(:has(.doc)) div.warning,
|
|
.boostlook:not(:has(.doc)) .notices.warning {
|
|
border-color: var(--border-border-negative, #ffcad2);
|
|
background-color: var(--surface-background-states-surface-negative-primary, #fdf1f3);
|
|
}
|
|
/* .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-main-text-primary, #18191b);
|
|
}
|
|
|
|
/* Dlist */
|
|
/* Apply top margin only for root list */
|
|
.boostlook #content .dlist:not(:first-child):not(.dlist .dlist),
|
|
.boostlook .dlist dl dt:not(:first-child):not(.dlist .dlist),
|
|
.boostlook:not(:has(.doc)) .variablelist:not(:first-child):not(.variablelist .variablelist),
|
|
.boostlook:not(:has(.doc)) .variablelist dl dt:not(:first-child):not(.variablelist .variablelist) {
|
|
margin-top: var(--padding-padding-2xs, 0.5rem);
|
|
}
|
|
|
|
.boostlook .dlist dl,
|
|
.boostlook:not(:has(.doc)) .variablelist dl {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--spacing-size-2xs, 0.5rem);
|
|
}
|
|
|
|
/* Where is this used */
|
|
.boostlook .dlist dl dt,
|
|
.boostlook:not(:has(.doc)) .variablelist dl dt {
|
|
display: block;
|
|
width: fit-content;
|
|
padding: initial;
|
|
border-radius: initial;
|
|
border: initial;
|
|
/* border-bottom-left-radius: unset; */
|
|
background: initial;
|
|
color: var(--text-code-neutral, #0d0e0f);
|
|
font-size: var(--typography-font-size-xs, 0.875rem);
|
|
font-style: normal;
|
|
font-variation-settings: "wght" 500, "wdth" 80;
|
|
line-height: var(--typography-line-height-lg, 1.5rem); /* 171.429% */
|
|
letter-spacing: var(--spacing-size-size-0, 0rem);
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
/* styles for nested list */
|
|
.boostlook .dlist:is(.dlist .dlist) dl dt,
|
|
.boostlook:not(:has(.doc)) .variablelist:is(.variablelist .variablelist) dl dt {
|
|
font-size: var(--typography-font-size-sm, 1rem);
|
|
}
|
|
|
|
.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 dt code,
|
|
.boostlook:not(:has(.doc)) .variablelist dl dt code {
|
|
font-variation-settings: "wght" 600, "wdth" 80;
|
|
font-family: var(--font-family-code, 'Noto Sans Mono');
|
|
}
|
|
|
|
.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(--spacing-size-size-0, 0rem);
|
|
border: 1px solid var(--border-border-primary, #e4e7ea);
|
|
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);
|
|
}
|
|
|
|
/* styles for nested list */
|
|
.boostlook .dlist:is(.dlist .dlist) dl dd,
|
|
.boostlook:not(:has(.doc)) .variablelist:is(.variablelist .variablelist) dl dd {
|
|
border: none;
|
|
padding: initial;
|
|
}
|
|
|
|
/* styles for block if it has nested list */
|
|
.boostlook .dlist dl dd:has(>.dlist),
|
|
.boostlook:not(:has(.doc)) .variablelist dl dd:has(>.variablelist) {
|
|
padding: var(--padding-padding-sm, 1rem);
|
|
}
|
|
|
|
/* apply margin only for top level list */
|
|
.boostlook .dlist dl > dd:not(:is(dl dl dd)),
|
|
.boostlook:not(:has(.doc)) .variablelist dl > dd:not(:is(dl dl dd)) {
|
|
margin-left: var(--spacing-size-xl);
|
|
}
|
|
|
|
.boostlook .dlist dl dd p,
|
|
.boostlook:not(:has(.doc)) .variablelist dl dd p {
|
|
font: inherit;
|
|
margin: 0;
|
|
}
|
|
|
|
.boostlook .dlist dl dd em,
|
|
.boostlook:not(:has(.doc)) .variablelist dl dd em {
|
|
font: inherit;
|
|
font-variation-settings: "wght" 500, "wdth" 80;
|
|
}
|
|
|
|
/* 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-variation-settings: "wght" 500, "wdth" 80;
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
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 div.itemizedlist:has(> ul.itemizedlist):not(:first-child),
|
|
.boostlook :not(div.itemizedlist) > 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;
|
|
padding-bottom: 1rem;
|
|
}
|
|
|
|
/* 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);
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
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";
|
|
font-style: normal;
|
|
font-variation-settings: "wght" 500, "wdth" 80;
|
|
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;
|
|
}
|
|
|
|
/* Add intendation */
|
|
.boostlook #content .sectionbody > table.tableblock,
|
|
.boostlook #content .section > table.tableblock,
|
|
.boostlook .sectionbody > div.informaltable:not(:is(.informaltable:has(> table:nth-of-type(2)):not(:has(> *:not(table))))),
|
|
.boostlook .section > div.informaltable:not(:is(.informaltable:has(> table:nth-of-type(2)):not(:has(> *:not(table))))),
|
|
.boostlook:not(:has(.doc)) .sectionbody > div.table .table-contents,
|
|
.boostlook:not(:has(.doc)) .section > div.table .table-contents,
|
|
.boostlook#libraryReadMe > table {
|
|
margin-left: var(--spacing-size-xl, 2rem);
|
|
}
|
|
|
|
.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-variation-settings: "wght" 600, "wdth" 80;
|
|
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, "wdth" 80;
|
|
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-primary, #000000);
|
|
font-size: var(--typography-font-size-xs, 0.875rem);
|
|
font-variation-settings: "wght" 500, "wdth" 80;
|
|
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;
|
|
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-variation-settings: "wght" 600, "wdth" 80;
|
|
}
|
|
|
|
.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;
|
|
}
|
|
|
|
/* 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;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
/* 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;
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
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;
|
|
line-height: var(--typography-line-height-sm, 1rem); /* 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-variation-settings: "wght" 600, "wdth" 80;
|
|
}
|
|
|
|
/* 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-variation-settings: "wght" 500, "wdth" 80;
|
|
line-height: var(--typography-line-height-xl, 1.75rem);
|
|
letter-spacing: var(--spacing-size-size-0, 0rem);
|
|
}
|
|
|
|
/* Rouge Syntax Highlighting */
|
|
/* Light theme Rouge syntax highlighting */
|
|
.boostlook pre.rouge .k { /* Keywords like const, auto */
|
|
color: var(--atom-one-light-keyword, #a626a4);
|
|
}
|
|
.boostlook pre.rouge .kt { /* Types like char, int */
|
|
color: var(--atom-one-light-keyword, #a626a4);
|
|
}
|
|
.boostlook pre.rouge .n,
|
|
.boostlook pre.rouge .nf { /* Names, identifiers, functions */
|
|
color: var(--atom-one-light-text, #383a42);
|
|
}
|
|
.boostlook pre.rouge .o { /* Operators */
|
|
color: var(--atom-one-light-operator, #e45649);
|
|
}
|
|
.boostlook pre.rouge .s,
|
|
.boostlook pre.rouge .s1,
|
|
.boostlook pre.rouge .s2 { /* Strings */
|
|
color: var(--atom-one-light-string, #50a14f);
|
|
}
|
|
.boostlook pre.rouge .mi,
|
|
.boostlook pre.rouge .mf { /* Numbers */
|
|
color: var(--atom-one-light-variable, #986801);
|
|
}
|
|
.boostlook pre.rouge .p { /* Punctuation */
|
|
color: var(--atom-one-light-text, #383a42);
|
|
}
|
|
.boostlook pre.rouge .c,
|
|
.boostlook pre.rouge .c1,
|
|
.boostlook pre.rouge .cm { /* Comments */
|
|
color: var(--atom-one-light-comment, #a0a1a7);
|
|
font-style: italic;
|
|
}
|
|
|
|
/* Dark theme Rouge syntax highlighting */
|
|
html.dark .boostlook pre.rouge .k,
|
|
html.dark .boostlook pre.rouge .kt {
|
|
color: var(--atom-one-dark-keyword, #c678dd);
|
|
}
|
|
html.dark .boostlook pre.rouge .n,
|
|
html.dark .boostlook pre.rouge .nf {
|
|
color: var(--atom-one-dark-text, #abb2bf);
|
|
}
|
|
html.dark .boostlook pre.rouge .o {
|
|
color: var(--atom-one-dark-operator, #e06c75);
|
|
}
|
|
html.dark .boostlook pre.rouge .s,
|
|
html.dark .boostlook pre.rouge .s1,
|
|
html.dark .boostlook pre.rouge .s2 {
|
|
color: var(--atom-one-dark-string, #98c379);
|
|
}
|
|
html.dark .boostlook pre.rouge .mi,
|
|
html.dark .boostlook pre.rouge .mf {
|
|
color: var(--atom-one-dark-variable, #d19a66);
|
|
}
|
|
html.dark .boostlook pre.rouge .p {
|
|
color: var(--atom-one-dark-text, #abb2bf);
|
|
}
|
|
html.dark .boostlook pre.rouge .c,
|
|
html.dark .boostlook pre.rouge .c1,
|
|
html.dark .boostlook pre.rouge .cm {
|
|
color: var(--atom-one-dark-comment, #5c6370);
|
|
font-style: italic;
|
|
}
|
|
|
|
.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]: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 {
|
|
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;
|
|
padding-bottom: 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-variation-settings: "wght" 500, "wdth" 80;
|
|
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);
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
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;
|
|
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;
|
|
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 <hr/>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;
|
|
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-variation-settings: "wght" 600, "wdth" 80;
|
|
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;
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
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-variation-settings: "wght" 500, "wdth" 80;
|
|
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;
|
|
}
|
|
|
|
.boostlook#libraryReadMe p:has(> a img ) {
|
|
display:flex;
|
|
flex-wrap:wrap;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
}
|
|
|
|
.boostlook#libraryReadMe p a:has(> img ) {
|
|
margin-left:.5rem;
|
|
}
|
|
|
|
/*----------------- Library README Styles end -----------------*/
|