/* Last edited by Mike Levey 2025-11-09 19:35 */ /* TABLE OF CONTENTS */ /* 1) Variable definitions */ /* 2) Portal (main page) settings */ /* 3) Body page general settings */ /* 4) Admonition settings */ /* 5) List and Procedure settings */ /* 6) Table Settings */ /* 7) TOC settings */ /* 8) Responsive web settings */ /* Link to Google Material Icons for the panel icons (SVG used instead) @import url('https://fonts.googleapis.com/icon?family=Material+Icons'); @import url('https://cdn.jsdelivr.net/npm/boxicons@latest/css/boxicons.min.css'); */ /* 1) Variable definitions */ :root { font-size: 16px !important; /* overwrite theme2 setting */ --body-font-family: 'Amazon Ember', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif; --body-font-size: 1rem; --admonition_fontsize: 1rem; /* sets the font to 100% of the topic body font size */ --h2_fontsize: 1.8rem; --h3_fontsize: 1.6rem; --h3admonition_fontsize: 1.2rem; --h4_fontsize: 1.3rem; --h5_fontsize: 1.1rem; --h6_fontsize: var(--body-font-size); --bullet_disc: '\2022'; /* also try '\25CF' */ --bullet_square: '\25AA'; /* also try '\00B7' */ --bullet_circle: '\2092'; /* also try '\25E6' */ --bullet_whitesquare: '\25AB'; --bullet_level1: '\2022'; /* closed bullet symbol */ --bullet_level2: '\26AC'; /* medium small white circle : use code \2219 for a square bullet */ --commandline_font: Consolas; --external-link-icon: '\f08e'; --itemizedlist_fontsize: var(--body-font-size); --orderedlist_fontsize: var(--body-font-size); --body-font-color: rgb(0 0 0); --heading_color: rgb(29 53 103); --h3_label_color: var(--heading_color); --hljs-var-color: inherit; --hljs-built_in-color: inherit; --link-color: #3366cc; /* darker blue, better for contrast and accessibility */ --portal-bkg-color: #FAFAFA; /* sets the background color of the portal */ --portal-icon-color: #696969; --portal-text-color: #282828; --portal-search-field-color: #EEEEEE; /* sets the background color of the search field on the main page */ --site-content-bkg-color: #FFFFFF; /* sets the background color of the site content */ --site-sidebar-bkg-color: #FBFBFB; --site-sidebar-text-color: #282828; --border-radius: 8px; --box-shadow-small--inset: inset 0px 1px 6px hsl(226deg 16% 61% / 8%); --box-shadow-large--inset: inset 0px 3px 12px hsl(226deg 16% 61% / 8%); --admonition-box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.1); --admonition-box-shadow-hover: 0px 4px 12px rgba(0, 0, 0, 0.15); --admonition-transition: box-shadow 0.3s ease; --imp-consideration-box-shadow: rgba(0, 0, 0, 0.15); --margin: 1rem; --padding: 1rem; --sidebar-top-padding: -80px; /* adjusts the position of the first link item */ --titlepage-top-padding: 20px; --breadcrumb-padding: 1px; /* Admonition colors */ --admin_bkgcolor: #FFF9E6; --admin_sidecolor: #E8B200; --admin_textcolor: #876500; --admin_titlecolor: #876500; --admonition_border_color: #F3F3F6; --admonition_color_std: #F5F5F5; --admonition_icon: ''; --admonition_iconcolor: white; --bestpractices_bkgcolor: #E8F5E9; --bestpractices_iconcolor: #0FA807; --bestpractices_sidecolor: #0FA807; --bestpractices_txtcolor: #1D3567; --bestpractices_titlecolor: #1D3567; --caution_bkgcolor: #FFF4E5; /* was #E7D3CD */ --caution_sidecolor: #F16521; /* was #E7D3CD */ --caution_iconcolor: #F16521; /* was #b57965 */ --danger_bkgcolor: #FFF0F0; /* was #ffd5d2 */ --danger_sidecolor: #D32F2F; /* was #ffd5d2 */ --danger_iconcolor: #D32F2F; --important_bkgcolor: #FEF3CE; /* was #FFECB3 */ --important_sidecolor: #FAC000; /* was #FFECB3 */ --important_iconcolor: #E8B200; /* was #ce9a00 */ --note_bkgcolor: #EFF6FF; /* was #c1d6ec */ --note_sidecolor: #2857B5; /* was #c1d6ec */ --note_iconcolor: #2857B5; /* was #c1d6ec */ --notice_bkgcolor: var(--bestpractices_bkgcolor); --notice_iconcolor: var(--bestpractices_iconcolor); --notice_sidecolor: var(--bestpractices_sidecolor); --notice_txtcolor: var(--bestpractices_txtcolor); --notice_titlecolor: var(--bestpractices_titlecolor); --tip_bkgcolor: #EDFFFF; /* was #e4d2e4 */ --tip_sidecolor: #0EC2BF; /* was #e4d2e4 */ --tip_iconcolor: #00A19E; /* was #aa72aa */ --warning_bkgcolor: #FFF8E1; /* was #FFD69C */ --warning_sidecolor: #FFA000; /* was #FFB74D */ --warning_iconcolor: #FFA000; /* Admonition icons */ --caution_icon: '\f071'; /* was '\f12a' */ --danger_icon: '\f071'; --important_icon: '\f06a'; /* was '\f12a' */ --note_icon: '\f040'; /* was '\f129' */ --notice_icon: '\f0eb'; --tip_icon: '\f0d0'; /* was '\f0eb' */ --warning_icon: '\f071'; /* Sidebar color and search (for TOC) */ --sidebar_color: var(--site-sidebar-bkg-color); --placeholder_searchword_color: transparent; --active_item_color: rgba(0 0 0 / 80%); /* Portal greeting */ --portal_greeting: 'Hi, how can we help?'; /* Search bar settings */ --placeholder_searchword_color: gray; /* List alignment and spacing settings */ --numbered_list1_indent: -1.4em; --numbered_list2_indent: -1.8em; --procedure_list1_indent: -1em; --procedure_list2_indent: 1em; --bullet_list1_indent: -1.9em; --bullet_list2_indent: -1.9em; --bullet_follows_numlist_indent: -0.6em; --bullet_follows_procedure_indent: -0.5em; --bullet_follows_procfancy_indent: 1em; --pre_margin_bottom: 1em; /* set space after codetext when not in a table */ --pre_margin_bottom_table: 0em; /* set space after codetext when inside a table */ /* --max_admonition_width: 40vw; */ --max_admonition_width: clamp(300px, 80%, 750px); /* Table settings */ --table-list-spacer: 0em; } /* End of variable definitions */ /* 2) Portal (main page) settings */ /* Primary color for links, buttons, portal header, titles */ body { font-family: var(--body-font-family); font-size: 16px !important; color: var(--body-font-color); } a, .text-primary, .btn-primary .badge, .btn-link, .pagination > li > a, .pagination > li > span, .nav-site-sidebar .active > a, .publication-contents a:hover, .publication-contents h4 a, .titlepage h1.title, .titlepage h2.title, .titlepage h3.title { color: var(--heading_color) !important; } .bg-primary, .btn-primary, .publications-condensed .portal-single-publication a, .toolbar, .tool-search-form .search-field, .colored-top .site-sidebar-header { background-color: rgb(44, 43, 68); } /* Lighter background for pager hover */ .pager li > a:hover, .pager li > span:hover { background-color: rgba(44, 43, 68, 0.15) !important; } .btn-primary, .nav .open > a, .nav .open > a:hover, .nav .open > a:focus, .colored-top .site-sidebar-header { border-color: #2c2b44; } /* Hover primary color */ a:hover, a:focus, a.text-primary:hover, a.text-primary:focus, .btn-link:hover, .btn-link:focus, .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus { color: #293278; } a.bg-primary:hover, a.bg-primary:focus, .btn-primary:hover, .portal-header .portal-search button:hover { background-color: #293278; } .btn-primary:hover, .btn-primary:active:hover, .btn-primary.active:hover, .open >.dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open > .dropdown-toggle.btn-primary:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open > .dropdown-toggle.btn-primary.focus { background-color: #293278; border-color: #305886; } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { font-family: 'Amazon Ember', sans-serif; font-weight: 500; line-height: 1.1; color: inherit; } .portal-single-publication > a > h3 { color: var(--portal-text-color); } .nav-site-sidebar li a:focus { background-color: transparent; } /* Remove the blue line that appears when clicking on TOC menu items */ .toc.nav.nav-site-sidebar a:active, .nav-site-sidebar a:active, .topic-link:active { border-top: none !important; border-bottom: none !important; border: none !important; outline: none !important; box-shadow: none !important; background-color: transparent !important; } /* Remove the brief blue line that appears when mouse button is released */ .toc.nav.nav-site-sidebar a:focus, .nav-site-sidebar a:focus, .topic-link:focus { border-top: none !important; border-bottom: none !important; border: none !important; outline: none !important; box-shadow: none !important; background-color: transparent !important; } /* Secondary color - For portal search button, publication count */ .portal-header .portal-search button { background-color: #3C3C3C; } .publication-contents h4 span { background-color: #3C3C3C; } .publication-contents h4 span { background-color: var(--heading_color); } h5.featured-content-label { color: var(--h5_portal-color); } .publication-icon { background-color: var(--publication_icon_color) !important; } a { color: #3361bb; /* .underline-on-hover: hover text-decoration: underline; */ } /* Other colors */ .portal-footer { background: #3C3C3C; color: #3C3C3C; } /* Custom icon assignments for portal panels */ .cat-panel-1::before, .cat-panel-2::before, .cat-panel-3::before, .cat-panel-4::before { content: ""; } .portal-single-publication a[href*="reviews"] .publication-icon i.fa.cat-panel::before { display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'contract edit' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M360-600v-80h360v80H360Zm0 120v-80h360v80H360Zm120 320H200h280Zm0 80H240q-50 0-85-35t-35-85v-120h120v-560h600v361q-20-2-40.5 1.5T760-505v-295H320v480h240l-80 80H200v40q0 17 11.5 28.5T240-160h240v80Zm80 0v-123l221-220q9-9 20-13t22-4q12 0 23 4.5t20 13.5l37 37q8 9 12.5 20t4.5 22q0 11-4 22.5T903-300L683-80H560Zm300-263-37-37 37 37ZM620-140h38l121-122-18-19-19-18-122 121v38Zm141-141-19-18 37 37-18-19Z"/%3E%3C/svg%3E'); content: ""; font-family: initial !important; /* prevents Material Icons font from interfering */ } .portal-single-publication a[href*="collaborating"] .publication-icon i.fa.cat-panel::before { display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'partner exchange' */ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23696969'%3E%3Cpath d='M480-600 340-740l140-140 140 140-140 140ZM40-160v-160q0-34 23.5-57t56.5-23h131q20 0 38 10t29 27q29 39 71.5 61t90.5 22q49 0 91.5-22t70.5-61q13-17 30.5-27t36.5-10h131q34 0 57 23t23 57v160H640v-91q-35 25-75.5 38T480-200q-43 0-84-13.5T320-252v92H40Zm120-280q-50 0-85-35t-35-85q0-51 35-85.5t85-34.5q51 0 85.5 34.5T280-560q0 50-34.5 85T160-440Zm640 0q-50 0-85-35t-35-85q0-51 35-85.5t85-34.5q51 0 85.5 34.5T920-560q0 50-34.5 85T800-440Z'/%3E%3C/svg%3E"); content: ""; font-family: initial !important; /* prevents Material Icons font from interfering */ } .portal-single-publication a[href*="content"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'folder managed' */ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23696969'%3E%3Cpath d='m680-80-12-60q-12-5-22.5-10.5T624-164l-58 18-40-68 46-40q-2-12-2-26t2-26l-46-40 40-68 58 18q11-8 21.5-13.5T668-420l12-60h80l12 60q12 5 22.5 10.5T816-396l58-18 40 68-46 40q2 12 2 26t-2 26l46 40-40 68-58-18q-11 8-21.5 13.5T772-140l-12 60h-80Zm40-120q33 0 56.5-23.5T800-280q0-33-23.5-56.5T720-360q-33 0-56.5 23.5T640-280q0 33 23.5 56.5T720-200Zm-560-40v-480 172-12 320Zm0 80q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h240l80 80h320q33 0 56.5 23.5T880-640v131q-18-13-38-22.5T800-548v-92H447l-80-80H160v480h283q3 21 9.5 41t15.5 39H160Z'/%3E%3C/svg%3E"); font-family: initial !important; /* prevents Material Icons font from interfering */ } .portal-single-publication a[href*="test"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'checklist' */ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23696969'%3E%3Cpath d='M222-200 80-342l56-56 85 85 170-170 56 57-225 226Zm0-320L80-662l56-56 85 85 170-170 56 57-225 226Zm298 240v-80h360v80H520Zm0-320v-80h360v80H520Z'/%3E%3C/svg%3E"); font-family: initial !important; /* prevents Material Icons font from interfering */ } .portal-single-publication a[href*="analysis"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'monitoring' */ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23696969'%3E%3Cpath d='M120-120v-80l80-80v160h-80Zm160 0v-240l80-80v320h-80Zm160 0v-320l80 81v239h-80Zm160 0v-239l80-80v319h-80Zm160 0v-400l80-80v480h-80ZM120-327v-113l280-280 160 160 280-280v113L560-447 400-607 120-327Z'/%3E%3C/svg%3E"); font-family: initial !important; /* prevents Material Icons font from interfering */ } .portal-single-publication a[href*="reference"] .publication-icon i::before { content: '' !important; display: inline-block; width: 1em; height: 1em; /* icon: 'menu_book' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M560-564v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-600q-38 0-73 9.5T560-564Zm0 220v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-380q-38 0-73 9t-67 27Zm0-110v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-490q-38 0-73 9.5T560-454ZM260-320q47 0 91.5 10.5T440-278v-394q-41-24-87-36t-93-12q-36 0-71.5 7T120-692v396q35-12 69.5-18t70.5-6Zm260 42q44-21 88.5-31.5T700-320q36 0 70.5 6t69.5 18v-396q-33-14-68.5-21t-71.5-7q-47 0-93 12t-87 36v394Zm-40 118q-48-38-104-59t-116-21q-42 0-82.5 11T100-198q-21 11-40.5-1T40-234v-482q0-11 5.5-21T62-752q46-24 96-36t102-12q58 0 113.5 15T480-740q51-30 106.5-45T700-800q52 0 102 12t96 36q11 5 16.5 15t5.5 21v482q0 23-19.5 35t-40.5 1q-37-20-77.5-31T700-240q-60 0-116 21t-104 59ZM280-494Z"/%3E%3C/svg%3E'); background-size: contain; background-repeat: no-repeat; vertical-align: middle; } .portal-single-publication a[href*="features"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'rocket launch' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="m226-559 78 33q14-28 29-54t33-52l-56-11-84 84Zm142 83 114 113q42-16 90-49t90-75q70-70 109.5-155.5T806-800q-72-5-158 34.5T492-656q-42 42-75 90t-49 90Zm178-65q-23-23-23-56.5t23-56.5q23-23 57-23t57 23q23 23 23 56.5T660-541q-23 23-57 23t-57-23Zm19 321 84-84-11-56q-26 18-52 32.5T532-299l33 79Zm313-653q19 121-23.5 235.5T708-419l20 99q4 20-2 39t-20 33L538-80l-84-197-171-171-197-84 167-168q14-14 33.5-20t39.5-2l99 20q104-104 218-147t235-24ZM157-321q35-35 85.5-35.5T328-322q35 35 34.5 85.5T327-151q-25 25-83.5 43T82-76q14-103 32-161.5t43-83.5Zm57 56q-10 10-20 36.5T180-175q27-4 53.5-13.5T270-208q12-12 13-29t-11-29q-12-12-29-11.5T214-265Z"/%3E%3C/svg%3E'); font-family: initial !important; } .portal-single-publication a[href*="get-started"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'handshake' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M475-160q4 0 8-2t6-4l328-328q12-12 17.5-27t5.5-30q0-16-5.5-30.5T817-607L647-777q-11-12-25.5-17.5T591-800q-15 0-30 5.5T534-777l-11 11 74 75q15 14 22 32t7 38q0 42-28.5 70.5T527-522q-20 0-38.5-7T456-550l-75-74-175 175q-3 3-4.5 6.5T200-435q0 8 6 14.5t14 6.5q4 0 8-2t6-4l136-136 56 56-135 136q-3 3-4.5 6.5T285-350q0 8 6 14t14 6q4 0 8-2t6-4l136-135 56 56-135 136q-3 2-4.5 6t-1.5 8q0 8 6 14t14 6q4 0 7.5-1.5t6.5-4.5l136-135 56 56-136 136q-3 3-4.5 6.5T454-180q0 8 6.5 14t14.5 6Zm-1 80q-37 0-65.5-24.5T375-166q-34-5-57-28t-28-57q-34-5-56.5-28.5T206-336q-38-5-62-33t-24-66q0-20 7.5-38.5T149-506l232-231 131 131q2 3 6 4.5t8 1.5q9 0 15-5.5t6-14.5q0-4-1.5-8t-4.5-6L398-777q-11-12-25.5-17.5T342-800q-15 0-30 5.5T285-777L144-635q-9 9-15 21t-8 24q-2 12 0 24.5t8 23.5l-58 58q-17-23-25-50.5T40-590q2-28 14-54.5T87-692l141-141q24-23 53.5-35t60.5-12q31 0 60.5 12t52.5 35l11 11 11-11q24-23 53.5-35t60.5-12q31 0 60.5 12t52.5 35l169 169q23 23 35 53t12 61q0 31-12 60.5T873-437L545-110q-14 14-32.5 22T474-80Zm-99-560Z"/%3E%3C/svg%3E'); font-family: initial !important; } .portal-single-publication a[href*="categories"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'sell' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M856-390 570-104q-12 12-27 18t-30 6q-15 0-30-6t-27-18L103-457q-11-11-17-25.5T80-513v-287q0-33 23.5-56.5T160-880h287q16 0 31 6.5t26 17.5l352 353q12 12 17.5 27t5.5 30q0 15-5.5 29.5T856-390ZM513-160l286-286-353-354H160v286l353 354ZM260-640q25 0 42.5-17.5T320-700q0-25-17.5-42.5T260-760q-25 0-42.5 17.5T200-700q0 25 17.5 42.5T260-640Zm220 160Z"/%3E%3C/svg%3E'); font-family: initial !important; } .portal-single-publication a[href*="searching-for-content"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'tab_search' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v160H520v-160H160v480h240v80H160Zm0-80v-360 40-160 480ZM864-80 756-188q-22 13-46 20.5t-50 7.5q-75 0-127.5-52.5T480-340q0-75 52.5-127.5T660-520q75 0 127.5 52.5T840-340q0 26-7.5 50T812-244l108 108-56 56ZM660-240q42 0 71-29t29-71q0-42-29-71t-71-29q-42 0-71 29t-29 71q0 42 29 71t71 29Z"/%3E%3C/svg%3E'); font-family: initial !important; } .portal-single-publication a[href*="create-content"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'add_notes' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v268q-19-9-39-15.5t-41-9.5v-243H200v560h242q3 22 9.5 42t15.5 38H200Zm0-120v40-560 243-3 280Zm80-40h163q3-21 9.5-41t14.5-39H280v80Zm0-160h244q32-30 71.5-50t84.5-27v-3H280v80Zm0-160h400v-80H280v80ZM720-40q-83 0-141.5-58.5T520-240q0-83 58.5-141.5T720-440q83 0 141.5 58.5T920-240q0 83-58.5 141.5T720-40Zm-20-80h40v-100h100v-40H740v-100h-40v100H600v40h100v100Z"/%3E%3C/svg%3E'); font-family: initial !important; } .portal-single-publication a[href*="advisor"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'verified' */ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23696969'%3E%3Cpath d='m344-60-76-128-144-32 14-148-98-112 98-112-14-148 144-32 76-128 136 58 136-58 76 128 144 32-14 148 98 112-98 112 14 148-144 32-76 128-136-58-136 58Zm34-102 102-44 104 44 56-96 110-26-10-112 74-84-74-86 10-112-110-24-58-96-102 44-104-44-56 96-110 24 10 112-74 86 74 84-10 114 110 24 58 96Zm102-318Zm-42 142 226-226-56-58-170 170-86-84-56 56 142 142Z'/%3E%3C/svg%3E"); font-family: initial !important; } .portal-single-publication a[href*="over"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'article' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M280-280h280v-80H280v80Zm0-160h400v-80H280v80Zm0-160h400v-80H280v80Zm-80 480q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm0-560v560-560Z"/%3E%3C/svg%3E'); font-family: initial !important; } .portal-single-publication a[href*="supported-versions"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'home_storage' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="m200-120-80-480h720l-80 480H200Zm67-80h426l51-320H216l51 320Zm133-160h160q17 0 28.5-11.5T600-400q0-17-11.5-28.5T560-440H400q-17 0-28.5 11.5T360-400q0 17 11.5 28.5T400-360ZM240-640q-17 0-28.5-11.5T200-680q0-17 11.5-28.5T240-720h480q17 0 28.5 11.5T760-680q0 17-11.5 28.5T720-640H240Zm80-120q-17 0-28.5-11.5T280-800q0-17 11.5-28.5T320-840h320q17 0 28.5 11.5T680-800q0 17-11.5 28.5T640-760H320Zm-53 560h426-426Z"/%3E%3C/svg%3E'); font-family: initial !important; } .portal-single-publication a[href*="configuring-integrations"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'build_circles' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M760-600q-57 0-99-34t-56-86H354q-11 42-41.5 72.5T240-606v251q52 14 86 56t34 99q0 66-47 113T200-40q-66 0-113-47T40-200q0-57 34-99t86-56v-251q-52-14-86-56t-34-98q0-66 47-113t113-47q56 0 98 34t56 86h251q14-52 56-86t99-34q66 0 113 47t47 113q0 66-47 113t-113 47ZM200-120q33 0 56.5-24t23.5-56q0-33-23.5-56.5T200-280q-32 0-56 23.5T120-200q0 32 24 56t56 24Zm0-560q33 0 56.5-23.5T280-760q0-33-23.5-56.5T200-840q-32 0-56 23.5T120-760q0 33 24 56.5t56 23.5ZM760-40q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 66-47 113T760-40Zm0-80q33 0 56.5-24t23.5-56q0-33-23.5-56.5T760-280q-33 0-56.5 23.5T680-200q0 32 23.5 56t56.5 24Zm0-560q33 0 56.5-23.5T840-760q0-33-23.5-56.5T760-840q-33 0-56.5 23.5T680-760q0 33 23.5 56.5T760-680ZM200-200Zm0-560Zm560 560Zm0-560Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="configuring-conversations"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'build_circles' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M760-600q-57 0-99-34t-56-86H354q-11 42-41.5 72.5T240-606v251q52 14 86 56t34 99q0 66-47 113T200-40q-66 0-113-47T40-200q0-57 34-99t86-56v-251q-52-14-86-56t-34-98q0-66 47-113t113-47q56 0 98 34t56 86h251q14-52 56-86t99-34q66 0 113 47t47 113q0 66-47 113t-113 47ZM200-120q33 0 56.5-24t23.5-56q0-33-23.5-56.5T200-280q-32 0-56 23.5T120-200q0 32 24 56t56 24Zm0-560q33 0 56.5-23.5T280-760q0-33-23.5-56.5T200-840q-32 0-56 23.5T120-760q0 33 24 56.5t56 23.5ZM760-40q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 66-47 113T760-40Zm0-80q33 0 56.5-24t23.5-56q0-33-23.5-56.5T760-280q-33 0-56.5 23.5T680-200q0 32 23.5 56t56.5 24Zm0-560q33 0 56.5-23.5T840-760q0-33-23.5-56.5T760-840q-33 0-56.5 23.5T680-760q0 33 23.5 56.5T760-680ZM200-200Zm0-560Zm560 560Zm0-560Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="integrating-jama-connect-with-jira"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'sync_alt' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M280-120 80-320l200-200 57 56-104 104h607v80H233l104 104-57 56Zm400-320-57-56 104-104H120v-80h607L623-784l57-56 200 200-200 200Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="integrating-jama-connect-with-excel-functions"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'sync_alt' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M280-120 80-320l200-200 57 56-104 104h607v80H233l104 104-57 56Zm400-320-57-56 104-104H120v-80h607L623-784l57-56 200 200-200 200Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="common-tasks"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'checklists' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M222-200 80-342l56-56 85 85 170-170 56 57-225 226Zm0-320L80-662l56-56 85 85 170-170 56 57-225 226Zm298 240v-80h360v80H520Zm0-320v-80h360v80H520Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="configuring-reqif_exchanges"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'build_circles' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M760-600q-57 0-99-34t-56-86H354q-11 42-41.5 72.5T240-606v251q52 14 86 56t34 99q0 66-47 113T200-40q-66 0-113-47T40-200q0-57 34-99t86-56v-251q-52-14-86-56t-34-98q0-66 47-113t113-47q56 0 98 34t56 86h251q14-52 56-86t99-34q66 0 113 47t47 113q0 66-47 113t-113 47ZM200-120q33 0 56.5-24t23.5-56q0-33-23.5-56.5T200-280q-32 0-56 23.5T120-200q0 32 24 56t56 24Zm0-560q33 0 56.5-23.5T280-760q0-33-23.5-56.5T200-840q-32 0-56 23.5T120-760q0 33 24 56.5t56 23.5ZM760-40q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 66-47 113T760-40Zm0-80q33 0 56.5-24t23.5-56q0-33-23.5-56.5T760-280q-33 0-56.5 23.5T680-200q0 32 23.5 56t56.5 24Zm0-560q33 0 56.5-23.5T840-760q0-33-23.5-56.5T760-840q-33 0-56.5 23.5T680-760q0 33 23.5 56.5T760-680ZM200-200Zm0-560Zm560 560Zm0-560Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="managing-users-and-passwords"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'manage_accounts' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M400-480q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 66-47 113t-113 47ZM80-160v-112q0-33 17-62t47-44q51-26 115-44t141-18h14q6 0 12 2-8 18-13.5 37.5T404-360h-4q-71 0-127.5 18T180-306q-9 5-14.5 14t-5.5 20v32h252q6 21 16 41.5t22 38.5H80Zm560 40-12-60q-12-5-22.5-10.5T584-204l-58 18-40-68 46-40q-2-14-2-26t2-26l-46-40 40-68 58 18q11-8 21.5-13.5T628-460l12-60h80l12 60q12 5 22.5 11t21.5 15l58-20 40 70-46 40q2 12 2 25t-2 25l46 40-40 68-58-18q-11 8-21.5 13.5T732-180l-12 60h-80Zm40-120q33 0 56.5-23.5T760-320q0-33-23.5-56.5T680-400q-33 0-56.5 23.5T600-320q0 33 23.5 56.5T680-240ZM400-560q33 0 56.5-23.5T480-640q0-33-23.5-56.5T400-720q-33 0-56.5 23.5T320-640q0 33 23.5 56.5T400-560Zm0-80Zm12 400Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="user-task"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'person_edit' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M480-240Zm-320 80v-112q0-34 17.5-62.5T224-378q62-31 126-46.5T480-440q37 0 73 4.5t72 14.5l-67 68q-20-3-39-5t-39-2q-56 0-111 13.5T260-306q-9 5-14.5 14t-5.5 20v32h240v80H160Zm400 40v-123l221-220q9-9 20-13t22-4q12 0 23 4.5t20 13.5l37 37q8 9 12.5 20t4.5 22q0 11-4 22.5T903-340L683-120H560Zm300-263-37-37 37 37ZM620-180h38l121-122-18-19-19-18-122 121v38Zm141-141-19-18 37 37-18-19ZM480-480q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 66-47 113t-113 47Zm0-80q33 0 56.5-23.5T560-640q0-33-23.5-56.5T480-720q-33 0-56.5 23.5T400-640q0 33 23.5 56.5T480-560Zm0-80Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="license"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'contract' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M240-80q-50 0-85-35t-35-85v-120h120v-560h600v680q0 50-35 85t-85 35H240Zm480-80q17 0 28.5-11.5T760-200v-600H320v480h360v120q0 17 11.5 28.5T720-160ZM360-600v-80h360v80H360Zm0 120v-80h360v80H360ZM240-160h360v-80H200v40q0 17 11.5 28.5T240-160Zm0 0h-40 400-360Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="installing"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'install_desktop' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M320-120v-80H160q-33 0-56.5-23.5T80-280v-480q0-33 23.5-56.5T160-840h320v80H160v480h640v-120h80v120q0 33-23.5 56.5T800-200H640v80H320Zm360-280L480-600l56-56 104 103v-287h80v287l104-103 56 56-200 200Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="upgrade"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'arrow_outward' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="m256-240-56-56 384-384H240v-80h480v480h-80v-344L256-240Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="trouble"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'help' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M478-240q21 0 35.5-14.5T528-290q0-21-14.5-35.5T478-340q-21 0-35.5 14.5T428-290q0 21 14.5 35.5T478-240Zm-36-154h74q0-33 7.5-52t42.5-52q26-26 41-49.5t15-56.5q0-56-41-86t-97-30q-57 0-92.5 30T342-618l66 26q5-18 22.5-39t53.5-21q32 0 48 17.5t16 38.5q0 20-12 37.5T506-526q-44 39-54 59t-10 73Zm38 314q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z"/%3E%3C/svg%3E'); } .portal-single-publication a[href*="appendix"] .publication-icon i.fa::before { content: '' !important; display: inline-block; width: 1em; height: 1em; background-repeat: no-repeat; background-size: contain; background-position: center; /* icon: 'menu_book' */ background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23696969"%3E%3Cpath d="M560-564v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-600q-38 0-73 9.5T560-564Zm0 220v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-380q-38 0-73 9t-67 27Zm0-110v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-490q-38 0-73 9.5T560-454ZM260-320q47 0 91.5 10.5T440-278v-394q-41-24-87-36t-93-12q-36 0-71.5 7T120-692v396q35-12 69.5-18t70.5-6Zm260 42q44-21 88.5-31.5T700-320q36 0 70.5 6t69.5 18v-396q-33-14-68.5-21t-71.5-7q-47 0-93 12t-87 36v394Zm-40 118q-48-38-104-59t-116-21q-42 0-82.5 11T100-198q-21 11-40.5-1T40-234v-482q0-11 5.5-21T62-752q46-24 96-36t102-12q58 0 113.5 15T480-740q51-30 106.5-45T700-800q52 0 102 12t96 36q11 5 16.5 15t5.5 21v482q0 23-19.5 35t-40.5 1q-37-20-77.5-31T700-240q-60 0-116 21t-104 59ZM280-494Z"/%3E%3C/svg%3E'); } /* Remove any cat-panel classes that might be interfering */ .portal-single-publication .publication-icon i.cat-panel { /* Override any existing styles */ background-image: none !important; } /* set the default color for all panel icons, if not using custom icons */ .cat-panel::before { color: var(--portal-icon-color); } /* Change the "How can we help you today?" greeting */ .portal-content .inner h1 { color: transparent; margin-bottom: -0.75rem; } .portal-content .inner h1::before { content: var(--portal_greeting); font-size: 42px; color: var(--site-content-bkg-color); display: flex; /* Use flexbox */ justify-content: center; /* Center horizontally */ align-items: center; /* Center vertically */ width: 100%; /* Take full width */ } /* Change portal header and navbar */ /* Make the header strip transparent, set the links to bkg color */ .portal-header .navbar-fixed-top, .portal-header-navbar { background-color: transparent !important; color: var(--portal-bkg-color); } /* For the container inside the navbar */ .portal-header .container-fluid { background-color: transparent !important; } /* Remove the box shadow */ .portal-header .navbar-fixed-top { box-shadow: none !important; } nav.portal-header-navbar a.external-top-nav-link[href^="http"]::after, nav.portal-header-navbar a.external-top-nav-link[href^="https://"]::after { color: rgb(250, 250, 250, .75) !important; } /* end of Portal page settings */ /* 3) Body page general settings */ /* increase font size of active TOC link */ li.active.opened { font-size: 1.2em; } /* define attributes for heading elements */ .h2, h2 { font-size: var(--h2_fontsize); } .h3, h3 { font-size: var(--h3_fontsize); } .h4, h4 { font-size: var(--h4_fontsize); } .h5, h5 { font-size: var(--h5_fontsize); } .h6, h6 { font-size: var(--h6_fontsize); } h6.bridgehead { color: var(--label_color); font-style: normal; font-weight: bold; font-size: var(--h5_fontsize); margin-bottom: 1em; /* sets the spacing after the bridgehead heading */ } #topic-content > section > .titlepage .title { margin-top: 1em; margin-bottom: 0.5em; } p + pre { margin-top: -2em; /* reduce space between para and code */ margin-bottom: -0.5em; } /* set the color of the program code variables */ .hljs-template-variable, .hljs-variable { color: var(--hljs-var-color) !important; } .hljs-built_in { color: var(--hljs-built_in-color) !important; } ul.pager { /* position the Prev and Next buttons at the lower right of screen */ width: 150px; margin-left: 75%; display: flex; /* Use flexbox for alignment */ align-items: center; /* Center items vertically */ padding: 0; /* Remove default padding */ } ul.pager li { display: inline-block; /* Ensure list items are inline */ margin: 0; /* Remove any margins */ } ul.pager li.previous, ul.pager li.next { line-height: 1; /* Standardize line height */ } ul.pager a.prev, ul.pager a.next { display: inline-block; /* Ensure consistent display */ padding: 8px 12px; /* Add consistent padding */ vertical-align: middle; /* Align text vertically */ } .copyright { float: right; /* default is left */ } .tool-search { margin-top: 20px; } .search-field { background-color: rgb(250 250 250) !important; color: var(--body-font-color); height: 30px !important; overflow: scroll; margin-top: 20px; border: 2px solid darkgray!important; } .search { color: black; } .search, .tool-search-form .search-field { background-color: rgb(250 250 250) !important; color: var(--body-font-color); height: 30px; overflow: scroll; margin-top: 20px; width: 65vw; } .tool-search-form .search-field::placeholder { color: var(--placeholder_searchword_color); } .titlepage { padding-top: var(--titlepage-top-padding); } /* Link styling */ a { color: var(--link-color); /* Darker blue with better contrast against white backgrounds */ /* text-decoration: underline; */ /* Always show underlines for better accessibility */ text-underline-offset: 0.15em; /* Slightly offset the underline for better readability */ transition: color 0.3s ease; /* Smooth transition for hover state */ font-size: 1rem; } a:focus { outline: 2px solid #2857B5; outline-offset: 2px; text-decoration: underline; } a:hover, a:focus { text-decoration: underline; text-decoration-skip-ink: none; /* Ensures the underline is continuous */ text-underline-offset: 0.15em; /* Controls the distance of the underline from the text */ } a[href^="http"]::after, a[href^="https://"]::after { /* adds the little icon after the link to indicate it is an external link */ font-size: 0.65em; content: var(--external-link-icon); font-family: FontAwesome; display: inline-block; /* Change from inline-block to inline */ opacity: 0.8; padding-left: 3px; color: #3361bb !important; text-decoration: none;; transform: translateY(-5px); /* Add white-space to prevent wrapping between text and icon */ white-space: nowrap; } /* When hovering, make sure the decoration applies consistently */ a[href^="http"]:hover, a[href^="https://"]:hover { text-decoration: underline; text-decoration-skip-ink: none; text-underline-offset: 0.15em; /* Use text-shadow to create a bold effect without changing width */ text-shadow: 0.01em 0 0 currentColor, -0.01em 0 0 currentColor; font-weight: normal; /* Keep the same weight */ color: #00458F; } a.linktype-component:hover, a.topic-link:hover { text-decoration: underline; /* Use text-shadow to create a bold effect without changing width */ text-shadow: 0.01em 0 0 currentColor, -0.01em 0 0 currentColor; font-weight: normal; /* Keep the same weight */ color: #00458F; } .pager a[href^="http"]::after, .pager a[href^="https://"]::after { display: none; } .toc.nav.nav-site-sidebar { /* move TOC down to accommodate wider banner */ margin-top: var(--sidebar-top-padding); } .site-body .h1, .site-body .h2, .site-body .h3, .site-body .h4, .site-body .h5, .site-body .h6, .site-body h1, .site-body h2, .site-body h3, .site-body h4, .site-body h5, .site-body h6 { font-family: var(--body-font-family); color: var(--heading_color); } /* 4) Admonition settings */ /* Hide the icons from content-theme2.css */ .caution > h3::before, .danger > h3::before, .important h3::before, .note > h3::before, .notice > h3::before, .tip > h3::before, .warning > h3::before { display: none !important; } .caution, .danger, .important, .note, .notice, .tip, .warning { background-color:transparent; border:1px solid var(--admonition_border_color) !important; border-radius:var(--border-radius); width: fit-content; max-width: var(--max_admonition_width) !important; } .caution > *, .danger > *, .important > *, .note > *, .notice > *, .tip > *, .warning > * { margin-left: 0px; -webkit-margin-before: 0; padding-left: 0; padding-bottom: 0; padding-right: 40px; } .caution > p, .danger > p, .important > p, .note > p, .notice > p, .tip > p, .warning > p { margin-left: 0; margin-bottom: 0.6em; line-height: 1.3em !important; } .caution { border-left: 3px solid var(--caution_sidecolor) !important; background-color: var(--caution_bkgcolor); --admonition_iconcolor: var(--caution_iconcolor); --admonition_icon: var(--caution_icon); } .danger { border-left: 3px solid var(--danger_sidecolor) !important; background-color: var(--danger_bkgcolor); --admonition_iconcolor: var(--danger_iconcolor); --admonition_icon: var(--danger_icon); } .important { border-left: 3px solid var(--important_sidecolor) !important; background-color: var(--important_bkgcolor); --admonition_iconcolor: var(--important_iconcolor); --admonition_icon: var(--important_icon); } .note { border-left: 3px solid var(--note_sidecolor) !important; background-color: var(--note_bkgcolor); --admonition_iconcolor: var(--note_iconcolor); --admonition_icon: var(--note_icon); } .notice { border-left: 3px solid var(--notice_sidecolor) !important; background-color: var(--notice_bkgcolor); --admonition_iconcolor: var(--notice_iconcolor); --admonition_icon: var(--notice_icon); } .tip { border-left: 3px solid var(--tip_sidecolor) !important; background-color: var(--tip_bkgcolor); --admonition_iconcolor: var(--tip_iconcolor); --admonition_icon: var(--tip_icon); } .warning { border-left: 3px solid var(--warning_sidecolor) !important; background-color: var(--warning_bkgcolor); --admonition_iconcolor: var(--warning_iconcolor); --admonition_icon: var(--warning_icon); } .caution h3, .danger h3, .important h3, .note h3, .notice h3, .tip h3, .warning h3 { display: inherit; margin-top: 0; margin-left: 0; margin-right: 0; padding: 10px 30px 0px 0px; background-color: transparent; color: var(--h3_label_color); font-size: var(--h3admonition_fontsize); font-weight: 700; } .notice h3 { margin-left: -8px; } .caution h3::before, .danger h3::before, .important h3::before, .note h3::before, .notice h3::before, .tip h3::before, .warning h3::before { display: inline-block; content: var(--admonition_icon); font-family: FontAwesome; color: var(--admonition_iconcolor); font-size: 20px; font-weight: 300; vertical-align: middle; margin-left: 1rem; } /* Default behavior: hide original notice title and show "Best Practice" */ .notice h3 { visibility: hidden; position: relative; } .notice h3::before { visibility: visible; margin-top: -8px; } .notice h3::after { display: inline-block; visibility: visible; content: 'Best Practice'; font-family: var(--body-font-family); font-size: var(--h3admonition_fontsize); color: var(--bestpractices_titlecolor); margin-left: 8px; position: absolute; left: 0; top: 11px; } .notice h3 + p { margin-top: -8px; } /* If you want to preserve a custom title, add a class like "custom-title" to the h3 */ .notice h3.custom-title { visibility: visible; } .notice h3.custom-title::after { display: none; } /* Style for best-practice paragraph to match notice admonition */ p.best-practice { background-color: var(--bestpractices_bkgcolor); border: 1px solid var(--admonition_border_color) !important; border-left: 3px solid var(--bestpractices_sidecolor) !important; border-radius: var(--border-radius); width: fit-content; max-width: var(--max_admonition_width) !important; padding: 8px 40px 15px 50px; position: relative; margin-bottom: 1em; color: var(--bestpractices_txtcolor); } /* Style the "Best Practice:" text */ p.best-practice strong { color: var(--bestpractices_titlecolor); font-size: var(--h3admonition_fontsize); display: block; margin: -1.6em 0 0.5em -0.1em; } /* Style for plain best-practice paragraph to match notice admonition */ p.best-practice { background-color: var(--bestpractices_bkgcolor); border: 1px solid var(--admonition_border_color) !important; border-left: 3px solid var(--bestpractices_sidecolor) !important; border-radius: var(--border-radius); width: fit-content; max-width: var(--max_admonition_width) !important; padding: 50px 50px 15px 64px; /* Increased top padding to make room for title */ position: relative; margin-bottom: 1em; color: var(--bestpractices_txtcolor); } p.best-practice:not(:has(strong)):not(:has(.formalpara-title)) { padding-top: 3em; } /* Add the icon before the paragraph */ p.best-practice::before { content: var(--notice_icon); font-family: FontAwesome; color: var(--notice_iconcolor) !important; font-size: 20px; font-weight: 300; position: absolute; left: 1rem; top: 18px !important; vertical-align: middle; } /* Add the "Best Practice" title automatically for plain paragraphs */ p.best-practice:not(:has(strong)):not(:has(.formalpara-title))::after { content: "Best Practice"; color: var(--bestpractices_titlecolor); font-size: var(--h3admonition_fontsize); font-weight: 700; display: block; position: absolute; top: 18px; left: 63px; } /* Add hover effect to match other admonitions */ p.best-practice:hover { box-shadow: var(--admonition-box-shadow-hover); transition: var(--admonition-transition); } /* Style for formal paragraphs with formalpara-title inside best-practice */ p.best-practice > span.formalpara-title { color: var(--bestpractices_titlecolor); font-size: var(--h3admonition_fontsize); font-weight: 700; display: block; position: relative; margin: -1.6em 0 0.5em -0.1em; } /* Create a mask for the period to hide it */ p.best-practice > span.formalpara-title { /* Use this technique to make the text itself a block but behave like inline for width */ width: fit-content; /* This makes it only as wide as its content */ padding-right: 0.3em; /* Add padding to ensure we have room for the mask */ } p.best-practice > span.formalpara-title::after { content: ""; position: absolute; right: 0.3em; top: 0; width: 0.5em; /* Width to hide just the period */ height: 100%; background-color: var(--bestpractices_bkgcolor); /* Match the background color */ } /* Remove the strong styling when formalpara-title is present */ p.best-practice:has(.formalpara-title) strong { display: inline; color: inherit; font-size: inherit; margin-left: 0; } /* Adjust spacing when formalpara-title is present */ p.best-practice .formalpara-title + * { margin-top: 0.5em; } /* Ensure the icon position is correct with formalpara-title */ p.best-practice:has(.formalpara-title)::before { top: 10px; } /* Optional: Add a hover effect for better interactivity */ .note:hover, .notice:hover, .danger:hover, .tip:hover, .warning:hover, .caution:hover, .important:hover { box-shadow:var(--admonition-box-shadow-hover); transition: var(--admonition-transition); } /* Add hover effect to match other admonitions */ p.best-practice:hover { box-shadow: var(--admonition-box-shadow-hover); transition: var(--admonition-transition); } /* 5) List and Procedure settings */ /* style Lists */ ol.orderedlist { margin-left: var(--numbered_list1_indent); /* move list over to the left, allowing space for double digits to be aligned with margin */ } ol ol.orderedlist { /* align level 2 lists with text of level 1 list */ margin-left: var(--numbered_list2_indent); } .itemizedlist{ padding-left: 20pt; } #topic-content ul.itemizedlist li.listitem { list-style-type: disc !important; } ul.itemizedlist li li.listitem { list-style-type: square !important; } ul.itemizedlist li li li.listitem { list-style-type: circle !important; } ul.itemizedlist li.listitem::marker { color: rgba(51 51 51 / 80%); } /* Reduce spacing for list items and paragraphs within them */ ul.itemizedlist li.listitem, ol.orderedlist li.listitem { margin-bottom: 0.5em; } /* Control paragraph spacing within list items */ ul.itemizedlist li.listitem p, ol.orderedlist li.listitem p { margin-bottom: 0.3em; margin-top: 0.1em; } /* Tighter spacing for multiple paragraphs within the same list item */ ul.itemizedlist li.listitem p + p, ol.orderedlist li.listitem p + p { margin-top: 0.2em; } /* Last paragraph in a list item should have minimal bottom margin */ ul.itemizedlist li.listitem p:last-child, ol.orderedlist li.listitem p:last-child { margin-bottom: 0.1em; } #topic-content ul.itemizedlist { margin-left: var(--bullet_list1_indent) !important; /* align bullet with margin */ } #topic-content ul ul.itemizedlist { margin-left: var(--bullet_list2_indent) !important; } #topic-content div.orderedlist + div > ul.itemizedlist { margin-left: var(--bullet_follows_numlist_indent) !important; } #topic-content ul.itemizedlist ul.itemizedlist { margin-left: -2em; } ul li:not(:last-child) div.itemizedlist:has(ul) { /* insert space after sublist and last list item, unless sublist is last child */ margin-bottom: 0.5em; } /* Style for h6.bridgehead with itemizedlist - combined container effect */ h6.bridgehead { border: 1px solid var(--heading_color); border-bottom: none; /* Remove bottom border as it will connect with the list */ border-radius: var(--border-radius) var(--border-radius) 0 0; padding: 0.5em 0.5em 1em; margin-bottom: 0; /* Remove space between heading and list */ background-color: #f8f8f8; /* Optional: slightly different background for the header */ width: clamp(300px, 80%, 600px); /* Match admonition responsive width */ position: relative; /* For shadow positioning */ z-index: 1; /* Ensure heading appears above the list */ transition: var(--admonition-transition); /* Match admonition transition */ } h6.bridgehead + div.itemizedlist, h6.bridgehead + div.orderedlist { border: 1px solid var(--heading_color); border-top: none; border-radius: 0 0 var(--border-radius) var(--border-radius); padding: 0 1em 1em 2.5em; /* Add padding but keep left padding for bullets */ margin-top: -0.1em; /* Remove space between heading and list */ margin-bottom: 1em; width: clamp(300px, 80%, 600px); /* Match admonition responsive width */ position: relative; /* For shadow positioning */ z-index: 0; /* Ensure list appears below the heading */ transition: var(--admonition-transition); /* Match admonition transition */ } /* Adjust the list styling to fit within the container */ h6.bridgehead + div.itemizedlist ul.itemizedlist { margin: 0; padding-left: 1em; } h6.bridgehead + :is(div.orderedlist, div.itemizedlist) li { margin-bottom: -0.25em; } h6.bridgehead + div.orderedlist li { margin-left: -1.5em; } h6.bridgehead + div.itemizedlist div.itemizedlist { margin-block-start: 0.25em; } /* For mobile responsiveness */ @media (width < 768px) { h6.bridgehead, h6.bridgehead + div.itemizedlist { width: 95%; /* Take up more width on smaller screens */ max-width: 600px; /* But still have a maximum */ } } /* style Procedures: Regular has no colored numbering */ .procedure > li { margin-left: var(--procedure_list1_indent); } .procedure > li::before { display: none; } div.procedure.fancy { margin-left: 0px; } ol.procedure { margin-left: -0.4em; } /* Targeting ul as well, because for one-step procedures, it becomes a ul */ ol.procedure.fancy, ul.procedure.fancy { margin: 0; padding: 0; list-style-type: none; margin-left: 56px; } .procedure.fancy > li:first-child { counter-reset: step-counter; } .procedure.fancy > li { counter-increment: step-counter; margin-bottom: 10px; min-height: 1em; } .procedure.fancy > li::before { float: left; margin-left: -40px; width: 24px; padding-left: 0px; height: 24px; line-height: 24px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border-radius: 13px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; color: #FFFFFF; background-color: #D5502A !important; display: block; font-weight: 700; content: counter(step-counter); font-size: 14px; text-align: center; } ol.procedure.fancy ol { margin-left: -0.4em; } li ol.procedure { /* set second level procedure indent */ margin-left: -0.8em; } ol.procedure.fancy ol.procedure { margin-left: -0.8em; } #topic-content .procedure + div > ul.itemizedlist { margin-left: var(--bullet_follows_procedure_indent) !important; } #topic-content .procedure.fancy + div > ul.itemizedlist { margin-left: var(--bullet_follows_procfancy_indent) !important; } ol.procedure ol.orderedlist { list-style-type: lower-alpha; /* set the numbering style for second level lists in a procedure */ } /* reduce space between para and list */ p + div.itemizedlist, p + div.orderedlist { margin-top: -1em; } /* increase space between second-level list items and programlisting code */ ol ul li p + pre.programlisting, ul ul li p + pre.programlisting { margin: -0.5em 0; } /* 6) Table Settings */ table.informaltable { box-shadow: 5px 5px 10px #ddd; margin-bottom: 10px; max-width: 99%; /* setting this < 100% enables the shadow to display on the right side */ } table tr { color: var(--body-font-color); } tbody { color: var(--body-font-color); background-color: var(--tablebodybkg_color); } thead { background-color: var(--tableheadbkg_color); color: var(--tablehead_color); } td { vertical-align: top; /* align all elements of a table at the top vertically */ } td ol, td ul { margin-bottom: -0.5em; } td ul ul, td ol ul { margin-top: 0; /* set the space between first and second level lists in a table, was -1.2em */ } .informaltable td p, .informaltable th p, .table td p, .table th p { margin: 0; /* reduce margin space between table para's */ } td .orderedlist + p { margin-top: 0.5em; /* set the space between an ordered list followed by a para inside a table */ } /* reduce space between preceding para and the table */ p + div.informaltable.table-responsive { margin-top: -1em; } /* adjust spacing between preceding para and list inside a table */ table p + div.itemizedlist, table p + div.orderedlist { margin-top: 0; } /* End of table settings */ /* Portal Main Page settings */ .portal-header .portal-search .search-field { height: 50px !important; /* sets the height of the main page search field */ background-color: var(--portal-search-field-color) !important; margin-top: 0; } /* Updates to existing stylesheet */ /* Remove 'featured content' on portal */ .featured-content-label { display: none; } .featured-content { display: none; } .container-fluid, .portal-body, .portal-footer { background-color: var(--portal-bkg-color); } .theme2 .portal-footer { background-color: var(--portal-bkg-color); } body { background-color: var(--portal-bkg-color); } aside.site-sidebar { background-color: var(--site-sidebar-bkg-color); } .site-content { background-color: var(--site-content-bkg-color); } .portal-footer .inner { border-top: none; } /* set links to underline during hover */ a.link:hover { text-decoration: underline; } /* change banner color */ .site-sidebar-header, .toolbar { background-color: #2c2b44 !important; } /* fix breadcrumbs below the banner */ .topic-content .breadcrumb-container { position: fixed; z-index: 60; margin-top: var(--breadcrumb-padding); padding-top: 10px; padding-bottom: 5px; padding: 10px 0 5px 5px; background-color: rgb(255 255 255); width: 90%; } li.breadcrumb-link > a { font-size: 16px; color: #696969 !important; } li.breadcrumb-node { font-size: 16px; color: #525252 !important; font-weight: 500; } .site-sidebar-header { height: 85px; margin-bottom: 20px; } /* hide top navigation link in the body pages */ .site-body #navbar { visibility: hidden; } .site-sidebar .logo { height: 63px; max-width: 90%; padding: 20px 0 0 15px; display: inline-block; } /* change TOC settings */ ul.nav-site-sidebar li a { color: var(--heading_color); } li.opened > a.topic-link { /* style the active link in the TOC sidebar */ color: var(--active_item_color) !important; font-weight: bold; text-decoration: underline; } li.opened > a.topic-link:has(+ul > li.opened) { /* change style of parent link in TOC if child is open */ /* color: blue !important; */ font-weight: normal; } .site-sidebar { /* set the TOC background color */ background-color: var(--sidebar_color) !important; } .nav-site-sidebar .active > a { color: var(--heading_color); font-weight: bold; } .site-sidebar-search { background-color: #eeeeee; /* set the Search background color in the TOC */ } .site-sidebar-search .search-field { color: var(--body-font-color); } .site-sidebar-search input::placeholder { color: var(--placeholder_searchword_color) !important; opacity: 0.5; /* Firefox */ } .site-sidebar-search input:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: var(--placeholder_searchword_color) !important; } .site-sidebar-search input::-ms-input-placeholder { /* Microsoft Edge */ color: var(--placeholder_searchword_color) !important; } .site-sidebar-search input::placeholder { display: none; } .site-sidebar-search .search-field { background-image: url("https://upload.wikimedia.org/wikipedia/commons/5/55/Magnifying_glass_icon.svg"); background-size: 16px; background-repeat: no-repeat; background-position: 90% center; } /* Admonition settings */ /* Admonition background colors */ .caution { background-color: var(--caution_bkgcolor); border-left-color: var(--caution_sidecolor); } .note { background-color: var(--note_bkgcolor); border-left-color: var(--note_sidecolor); } .note.org_admins { background-color: var(--admin_bkgcolor); border-left-color: var(--admin_sidecolor) !important; } .note.proj_admins { background-color: var(--admin_bkgcolor); border-left-color: var(--admin_sidecolor) !important; } .warning.org_admins { background-color: var(--admin_bkgcolor) !important; border-left-color: var(--admin_sidecolor) !important; } .warning.proj_admins { background-color: var(--admin_bkgcolor) !important; border-left-color: var(--admin_sidecolor) !important; } .notice { background-color: var(--notice_bkgcolor); border-left-color: var(--notice_sidecolor); } .important { background-color: var(--important_bkgcolor); border-left-color: var(--important_sidecolor); } .tip { background-color: var(--tip_bkgcolor); border-left-color: var(--tip_sidecolor); } .warning.danger { /* danger */ background-color: var(--danger_bkgcolor); border-left-color: var(--danger_sidecolor); } .warning { background-color: var(--warning_bkgcolor); border-left-color: var(--warning_sidecolorr); } /* icon colors */ .note::before { color: var(--note_iconcolor); content: var(--note_icon); } /* .note.admins::before { content: ""; display: inline-block; width: 1.5em; height: 1.5em; vertical-align: middle; background-image: url("data:image/svg+xml;utf8,!"); background-size: contain; background-repeat: no-repeat; margin-right: 0.5em; } */ .note.org_admins, .note.proj_admins { position: relative; } .warning.org_admins, .warning.proj_admins { position: relative; } .note.org_admins::before, .note.proj_admins::before { content: ""; display: flex; align-items: center; position: absolute; top: 0.75em; left: 0.75em; height: 32px; width: max-content; background-image: url('data:image/svg+xml,'); background-size: 27px 32px; background-repeat: no-repeat; padding-inline-start: 40px; /* space for icon */ } .warning.org_admins::before, .warning.proj_admins::before { content: ""; display: flex; align-items: center; position: absolute; top: 0.75em; left: 0.75em; height: 32px; width: max-content; background-image: url('data:image/svg+xml,'); background-size: 27px 32px; background-repeat: no-repeat; padding-inline-start: 40px; /* space for icon */ } .note.org_admins .title, .note.proj_admins .title { margin-block-end: 0.5em; color: var(--admin_titlecolor); } .warning.org_admins .title, .warning.proj_admins .title { margin-block-end: 0.5em; color: var(--admin_titlecolor); } .warning.org_admins p, .warning.proj_admins p { color: var(--admin_textcolor); } .notice::before { color: var(--notice_iconcolor); content: var(--notice_icon); } .tip::before { color: var(--tip_iconcolor); content: var(--tip_icon); } .important::before { color: var(--important_iconcolor); content: var(--important_icon); } .caution::before { color: var(--caution_iconcolor); content: var(--caution_icon); } .warning::before { color: var(--h2_color); content: var(--warning_icon); } .warning.danger::before { content: var(--danger_icon); color: var(--danger_iconcolor); } .warning.danger.org_admins::before, .warning.danger.proj_admins::before { content: '' } /* Admonition title or label */ .caution h3 { font-size: var(--h3admonition_fontsize); color: var(--h3_label_color); display: inherit; /* none = hide Caution title */ } .important h3 { font-size: var(--h3admonition_fontsize); color: var(--h3_label_color); display: inherit; /* none = hide Important title */ } .note h3 { font-size: var(--h3admonition_fontsize); color: var(--h3_label_color); display: inherit; /* none = hide Note title */ } .tip h3 { font-size: var(--h3admonition_fontsize); color: var(--h3_label_color); display: inherit; /* none = hide Tip title */ } .warning h3 { font-size: var(--h3admonition_fontsize); color: var(--h3_label_color); display: inherit; /* none = hide Warning and Danger title */ } /* Admonition body text */ .caution p { font-size: var(--admonition_fontsize); color: var(--h3_label_color); } .important p { font-size: var(--admonition_fontsize); color: var(--h3_label_color); } .note p { font-size: var(--admonition_fontsize) !important; color: var(--h3_label_color); } .notice p { font-size: var(--admonition_fontsize); color: var(--notice_txtcolor) } .warning p { font-size: var(--admonition_fontsize) !important; font-family: var(--body-font-family) !important; } .tip p { font-size: var(--admonition_fontsize); color: var(--h3_label_color); } /* End of admonition settings */ /* define program listing variable colors */ div.section-toc-title { font-size: 1.3em; color: var(--heading_color); } code, kbd, pre, samp { font-family: Consolas, Menlo, Monaco, "Courier New", monospace; } pre { margin-bottom: var(--pre_margin_bottom); /* override margin setting defined in Theme2.css */ } td pre { margin-bottom: var(--pre_margin_bottom_table); /* override margin setting defined in Theme2.css, for tables */ } /* Change height of body banner to match that of TOC banner */ .toolbar { min-height: 85px; box-shadow: none; position: fixed; left: 10%; width: 100%; z-index: 20; } a[href^="http"]::after, a[href^="https://"]::after { color: white; } a.external-top-nav-link { z-index: 30; } /* End of Portal Main Page settings */ /* 7) TOC Settings */ /* Set background color for TOC items */ .toc.nav.nav-site-sidebar li { background-color: var(--site-sidebar-bkg-color); } /* Make sure the background covers the entire area */ .toc.nav.nav-site-sidebar li a { background-color: var(--site-sidebar-bkg-color); } /* Ensure submenus also have the same background */ .toc.nav.nav-site-sidebar li ul li { background-color: var(--site-sidebar-bkg-color); } /* Preserve the active/opened item styling */ .toc.nav.nav-site-sidebar li.active, .toc.nav.nav-site-sidebar li.opened { background-color: var(--site-sidebar-bkg-color); } /* Set the sidebar background to match */ .site-sidebar { background-color: var(--site-sidebar-bkg-color) !important; } /* PURE CSS VISUAL SOLUTION FOR TOC ARROWS */ /* Works with existing JavaScript but handles all visual effects via CSS */ /* Step 1: Standardize all arrows to use right-pointing arrow with CSS rotation */ .toc.nav.nav-site-sidebar .glyphicon::before { content: "\e080" !important; /* Always use right arrow */ transition: transform 0.3s ease; display: inline-block; transform-origin: center; } /* Step 2: CSS-controlled submenu visibility */ .toc.nav.nav-site-sidebar li ul { opacity: 0; max-height: 0; overflow: hidden; transition: all 0.3s ease; } /* Step 3: When JavaScript adds .opened class, CSS handles the visual changes */ .toc.nav.nav-site-sidebar li.opened > ul { opacity: 1; max-height: 1000px; display: block !important; } .toc.nav.nav-site-sidebar li.opened > a .glyphicon::before { transform: rotate(90deg); } /* Step 4: Ensure closed state is properly styled */ .toc.nav.nav-site-sidebar li:not(.opened) > ul { opacity: 0; max-height: 0; display: none !important; } .toc.nav.nav-site-sidebar li:not(.opened) > a .glyphicon::before { transform: rotate(0deg); } /* Step 5: Enhanced hover effects */ .toc.nav.nav-site-sidebar li:has(ul) > a { cursor: pointer; transition: background-color 0.2s ease; } .toc.nav.nav-site-sidebar li:has(ul) > a:hover { background-color: rgba(0, 0, 0, 0.05); border-radius: 4px; } .toc.nav.nav-site-sidebar li:has(ul) > a:hover .glyphicon::before { color: var(--link-color); } /* Step 6: Make arrows more interactive */ .toc.nav.nav-site-sidebar .glyphicon { padding: 2px; border-radius: 2px; transition: all 0.3s ease; } /* EXPLANATION: This CSS solution works by: 1. Using the existing JavaScript that toggles .opened classes 2. CSS handles ALL visual aspects (arrow rotation, submenu animation) 3. Replaces icon swapping with smooth CSS transforms 4. Provides better animations than the original JavaScript The JavaScript continues to work as before, but now the visual effects are smoother and more maintainable since they're handled by CSS. This is the closest to "pure CSS" possible without modifying HTML structure. */ /* CSS-ONLY ALTERNATIVE SOLUTION */ /* Uncomment this for a pure CSS solution using checkbox hack */ /* / * Hide original arrows and implement CSS-only toggle * / .css-only-toc .glyphicon { display: none !important; } / * Add hidden checkbox for each expandable item * / .css-only-toc li:has(ul) { position: relative; } .css-only-toc li:has(ul) > a::before { content: ""; position: absolute; left: 8px; top: 50%; transform: translateY(-50%); width: 0; height: 0; border-left: 6px solid var(--heading_color); border-top: 4px solid transparent; border-bottom: 4px solid transparent; transition: transform 0.3s ease; cursor: pointer; } / * Checkbox hack for toggle state * / .css-only-toc input[type="checkbox"] { display: none; } .css-only-toc li ul { display: none; transition: all 0.3s ease; } .css-only-toc input[type="checkbox"]:checked ~ ul { display: block; } .css-only-toc input[type="checkbox"]:checked ~ a::before { transform: translateY(-50%) rotate(90deg); } .css-only-toc li:has(ul) > a { padding-left: 25px; } */ /* 8) Responsive web settings */ /* adjust position of navbar menu */ @media ( width < 768px ) { .topic-content .breadcrumb { transform: translateX(-40px); scale: 90%; } .toolbar-tools { margin-top: 10px; } .tool-search { position: absolute; margin: 0 -20px; } .search, .tool-search-form .search-field { margin-top: -10px; margin-right: 0; margin-bottom: 30px; margin-left: calc(120px - 100vw); padding-bottom: 25px; min-width: 67vw; } .form-control { width: 50% !important; } .toc.nav.nav-site-sidebar { margin-top: 22px; /* width: 200px; */ } .site-sidebar { max-width: 400px; /* sets the max width of the TOC menu on small screens */ margin-top: 160px; } .site-sidebar-header { position: sticky; margin-top: -120px; z-index: 75; left: 0; } .site-sidebar-header .logo { position: relative; margin: 0; } } @media (width < 750px ) { .search, .tool-search-form .search-field { margin-top: -10px; margin-right: 0; margin-bottom: 30px; margin-left: calc(120px - 100vw); padding-bottom: 25px; min-width: 67vw; } } @media (width < 700px) { .titlepage { padding-top: 70px; } } @media (width < 453px) { .titlepage { padding-top: 90px; } } @media ( width < 450px ) { .toolbar-tools { margin-right: 30px; } .topic-content .breadcrumb { transform: translateX(-30px); } } @media (width < 768px) { /* on small screens, compensate for image disappearing */ .toolbar.top-nav-on::before { content: url('image/corporate-logo.svg'); display: block; position: absolute; padding: 10px; padding-top: 5px; width: 160px; } } /* Fix TOC problems -- should be defined in theme1.css and theme2.css */ .toc.nav.nav-site-sidebar { position: relative; } .toc.nav.nav-site-sidebar li { position: relative; } .toc.nav.nav-site-sidebar li a { position: relative; } /* Original TOC glyphicon positioning - preserved from existing styles */ .toc .glyphicon { position: absolute; top: 0; right: 10px; margin: 4px; display: inline-block; font-family: 'Glyphicons Halflings'; -webkit-font-smoothing: antialiased; font-style: normal; font-weight: 300; line-height: 1; font-size: 10px; /* Enhanced with CSS-only functionality */ transition: transform 0.3s ease; transform-origin: center; } .toc > li > .topic-link > .glyphicon { margin-top: 17px; } /* Responsive positioning adjustments */ .toc.nav.nav-site-sidebar li ul li { position: relative; } .toc.nav.nav-site-sidebar li.active, .toc.nav.nav-site-sidebar li.opened { position: relative; } /* Fix for sidebar extending into banner/header area with fixed toolbar */ .fixed-toolbar .site-sidebar { top: 64px !important; } /* Fix for sidebar header - make it fixed at top of sidebar, not scrollable */ .fixed-toolbar .site-sidebar-header { position: fixed !important; top: 0px !important; left: 0 !important; width: 25% !important; z-index: 1001 !important; background-color: #2c2b44 !important; } @media (min-width: 1200px) { .fixed-toolbar .site-sidebar-header { width: 16.66666667% !important; } } /* Adjust navigation area to start below the fixed header */ .fixed-toolbar .nav-site-sidebar { position: absolute !important; top: 85px !important; /* Height of sidebar-header */ bottom: 0 !important; left: 0 !important; right: 0 !important; overflow-y: auto !important; overflow-x: hidden !important; padding-top: 15px !important; }