diff --git a/tests/per_usage/divs_html_elements/index.html b/tests/per_usage/divs_html_elements/index.html index 1acbb9e8..49a3cb77 100644 --- a/tests/per_usage/divs_html_elements/index.html +++ b/tests/per_usage/divs_html_elements/index.html @@ -1,88 +1,36 @@ - - - - + + + + + + Awesome Doc + + + - + - + @@ -91,69 +39,34 @@ adcs.initialize(); adcs.ThemeSelector.initialize(); --> - - - - - - - -
- -
- - Code section: CE Execution (explicit), show block, show line, header replacement -
-

+    
+    
+
+    
+    
+  
+
+  
+    
+

Awesome Docs - Div Elements

+
    +
  • + +
  • +
  • + +
  • +
+
+ +
+
+

+ Code section: CE Execution (explicit), show block, show line, header replacement +

+
+

 // some comment here
 // ...
 
@@ -179,13 +92,16 @@
 // @awesome-doc-code-sections::show::block::end
 }
         
-
- -
- - Code section: CE Execution (explicit), show block, show line, header replacement, long-line -
-

+        
+
+ +
+

+ Code section: CE Execution (explicit), show block, show line, header replacement, + long-line +

+
+

 // some comment here
 // ...
 
@@ -212,13 +128,16 @@
 // @awesome-doc-code-sections::show::block::end
 }
         
-
- -
- - Code section: CE Execution (explicit), show block, show (possibly empty) line, header replacement, stdout/stderr outputs -
-

+        
+
+ +
+

+ Code section: CE Execution (explicit), show block, show (possibly empty) line, header + replacement, stdout/stderr outputs +

+
+

 // some comment here
 // ...
 
@@ -249,13 +168,13 @@
 // @awesome-doc-code-sections::show::block::end
 }
         
-
- -
+
+ - Code section: CE Execution (default), skip line, skip block -
-

+      
+

Code section: CE Execution (default), skip line, skip block

+
+

 // some comment here
 // ...
 
@@ -276,13 +195,13 @@
 // and me too !
 // @awesome-doc-code-sections::skip::block::end
         
-
+
+ -
- - Basic code section (no parsing, no execution) -
-

+      
+

Basic code section (no parsing, no execution)

+
+

 // some comment here
 // ...
 
@@ -304,8 +223,8 @@
 // @awesome-doc-code-sections::show::block::end
 }
         
-
- -
- +
+ + + diff --git a/tests/per_usage/divs_html_elements/scripts/awesome-doc-configuration.js b/tests/per_usage/divs_html_elements/scripts/awesome-doc-configuration.js new file mode 100644 index 00000000..fedcf216 --- /dev/null +++ b/tests/per_usage/divs_html_elements/scripts/awesome-doc-configuration.js @@ -0,0 +1,21 @@ +hljs.configure({ + ignoreUnescapedHTML: true, + throwUnescapedHTML: false, + languages: ["cpp", "c", "bash", "cmake", "markdown", "json", "plaintext"], +}); + +awesome_doc_code_sections.options.configure({ + doxygen_awesome_css_compatibility: true, +}); +awesome_doc_code_sections.configuration.CE = new Map([ + // fallback configurations + [ + "cpp", + { + language: "c++", + compiler_id: "clang1500", + default_options: "-O2 -std=c++20", + }, + ], +]); +awesome_doc_code_sections.initialize(); // initialize all features diff --git a/tests/per_usage/divs_html_elements/scripts/awesome-doc-styling.js b/tests/per_usage/divs_html_elements/scripts/awesome-doc-styling.js new file mode 100644 index 00000000..8cba6c8e --- /dev/null +++ b/tests/per_usage/divs_html_elements/scripts/awesome-doc-styling.js @@ -0,0 +1,26 @@ +let is_stylished = false; +function toggle_style() { + const stylished_classname = "stylished"; + + let apply_toggle_style = is_stylished + ? function (elements) { + elements.removeClass(`${stylished_classname}`); + } + : function (elements) { + elements.addClass(`${stylished_classname}`); + }; + is_stylished = !is_stylished; + + let elements = $("body").find("code, div.fragment, pre.fragment, main.contents"); + apply_toggle_style(elements); +} + +let is_small = false; +function toggle_small() { + let r = document.querySelector(":root"); + let rs = getComputedStyle(r); + let content_max_width = rs.getPropertyValue("--content-maxwidth"); + + r.style.setProperty("--content-maxwidth", (is_small ? 1050 : 500) + "px"); + is_small = !is_small; +} diff --git a/tests/per_usage/divs_html_elements/styles/styles.css b/tests/per_usage/divs_html_elements/styles/styles.css new file mode 100644 index 00000000..1bb30adb --- /dev/null +++ b/tests/per_usage/divs_html_elements/styles/styles.css @@ -0,0 +1,114 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: sans-serif; +} + +header { + width: 100%; + margin: 2rem auto; + text-align: center; +} + +header h1 { + margin-bottom: 1rem; +} + +#toggle-style-container { + display: flex; + justify-content: center; + align-items: center; + gap: 1rem; + list-style: none; +} + +#toggle-style-container button { + padding: 0.5rem; + font-size: 1rem; +} + +main { + margin: auto; + max-width: 130rem; +} + +section { + margin: 2rem 0; +} + +section h2 { + font-size: 1.2rem; + font-weight: bold; + margin-bottom: 0.5rem; +} + +html.dark-mode { + color-scheme: dark; + --primary-color: #1982d2; + --primary-dark-color: #86a9c4; + --primary-light-color: #4779ac; + --box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.3); + --odd-color: rgba(100, 100, 100, 0.06); + --menu-selected-background: rgba(0, 0, 0, 0.4); + --page-background-color: #1c1d1f; + --page-foreground-color: #d2dbde; + --page-secondary-foreground-color: #859399; + --separator-color: #38393b; + --side-nav-background: #252628; + --code-background: #2a2c2f; + --tablehead-background: #2a2c2f; + --blockquote-background: #222325; + --blockquote-foreground: #7e8c92; + --warning-color: #2e1917; + --warning-color-dark: #ad2617; + --warning-color-darker: #f5b1aa; + --note-color: #3b2e04; + --note-color-dark: #f1b602; + --note-color-darker: #ceb670; + --todo-color: #163750; + --todo-color-dark: #1982d2; + --todo-color-darker: #dcf0fa; + --deprecated-color: #2e323b; + --deprecated-color-dark: #738396; + --deprecated-color-darker: #abb0bd; + --bug-color: #2a2536; + --bug-color-dark: #7661b3; + --bug-color-darker: #ae9ed6; + --invariant-color: #303a35; + --invariant-color-dark: #76ce96; + --invariant-color-darker: #cceed5; + --fragment-background: #282c34; + --fragment-foreground: #dbe4eb; + --fragment-keyword: #cc99cd; + --fragment-keywordtype: #ab99cd; + --fragment-keywordflow: #e08000; + --fragment-token: #7ec699; + --fragment-comment: #999999; + --fragment-link: #98c0e3; + --fragment-preprocessor: #65cabe; + --fragment-linenumber-color: #cccccc; + --fragment-linenumber-background: #35393c; + --fragment-linenumber-border: #1f1f1f; +} +:root { + --border-radius-small: 4px; + --border-radius-medium: 6px; + --border-radius-large: 8px; + --spacing-small: 5px; + --spacing-medium: 10px; + --spacing-large: 16px; + --content-maxwidth: 1050px; +} +code.stylished { + border-radius: var(--border-radius-small); + border: 1px solid var(--separator-color); + overflow: hidden; +} +main.contents.stylished { + max-width: var(--content-maxwidth); + margin: calc(var(--spacing-medium) + 0.2em) auto var(--spacing-medium) auto; +}