| /* css for clang-doc mustache backend */ |
| @import "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"; |
| |
| *,*::before *::after { |
| box-sizing:border-box |
| } |
| * { |
| margin:0; |
| padding:0 |
| } |
| ol, |
| ul { |
| list-style:none |
| } |
| img, |
| picture, |
| svg, |
| video { |
| display:block; |
| max-width:100% |
| } |
| |
| * { |
| --brand-light:#ce6300; |
| --text1-light:#000000; |
| --text2-light:#333333; |
| --surface1-light:#ffffff; |
| --surface2-light:#f5f5f5; |
| --brand-dark:#de9853; |
| --text1-dark:#ffffff; |
| --text2-dark:#cccccc; |
| --surface1-dark:#161212; |
| --surface2-dark:#272424 |
| } |
| |
| :root { |
| color-scheme:light; |
| --brand:var(--brand-light); |
| --text1:var(--text1-light); |
| --text2:var(--text2-light); |
| --text1-inverse:var(--text1-dark); |
| --text2-inverse:var(--text2-dark); |
| --surface1:var(--surface1-light); |
| --surface2:var(--surface2-light) |
| } |
| |
| @media(prefers-color-scheme:dark) { |
| :root { |
| color-scheme:dark; |
| --brand:var(--brand-dark); |
| --text1:var(--text1-dark); |
| --text2:var(--text2-dark); |
| --text1-inverse:var(--text1-light); |
| --text2-inverse:var(--text2-light); |
| --surface1:var(--surface1-dark); |
| --surface2:var(--surface2-dark) |
| } |
| } |
| |
| [color-scheme=light] { |
| color-scheme:light; |
| --brand:var(--brand-light); |
| --text1:var(--text1-light); |
| --text2:var(--text2-light); |
| --text1-inverse:var(--text1-dark); |
| --text2-inverse:var(--text2-dark); |
| --surface1:var(--surface1-light); |
| --surface2:var(--surface2-light) |
| } |
| |
| [color-scheme=dark] { |
| color-scheme:dark; |
| --brand:var(--brand-dark); |
| --text1:var(--text1-dark); |
| --text2:var(--text2-dark); |
| --text1-inverse:var(--text1-light); |
| --text2-inverse:var(--text2-light); |
| --surface1:var(--surface1-dark); |
| --surface2:var(--surface2-dark) |
| } |
| |
| html { |
| background-color:var(--surface1) |
| } |
| |
| html, body { |
| min-height: 100vh; |
| margin: 0; |
| padding: 0; |
| width: 100%; |
| } |
| |
| .container { |
| display: flex; |
| margin-top: 60px; |
| height: calc(100% - 60px); |
| box-sizing: border-box; |
| } |
| |
| body, html { |
| font-family:Inter,sans-serif; |
| margin: 0; |
| padding: 0; |
| height: 100%; |
| } |
| |
| /* Navbar Styles */ |
| .navbar { |
| background-color: var(--surface2); |
| border-bottom: 1px solid var(--text2); |
| position: fixed; |
| width: 100%; |
| top: 0; |
| left: 0; |
| height: 60px; /* Adjust as needed */ |
| color: white; |
| display: flex; |
| align-items: center; |
| padding: 0 20px; |
| box-sizing: border-box; |
| z-index: 1000; |
| } |
| |
| |
| .navbar__container { |
| display:flex; |
| justify-content:space-between; |
| align-items:center; |
| padding:1rem; |
| color:var(--text1); |
| max-width:2048px; |
| margin:auto |
| } |
| .navbar__logo { |
| display:flex; |
| align-items:center; |
| height:40px |
| } |
| .navbar__logo a { |
| display:flex; |
| align-items:center; |
| text-decoration:none; |
| height:100% |
| } |
| .navbar__logo img { |
| height:100%; |
| width:auto |
| } |
| .navbar__toggle { |
| background:0 0; |
| color:var(--text2); |
| border:none; |
| cursor:pointer; |
| font-size:1.5rem; |
| width:2.5rem; |
| height:2.5rem; |
| margin-left:auto |
| } |
| .navbar__toggle:hover { |
| color:var(--text1) |
| } |
| @media(min-width:769px) { |
| .navbar__toggle { |
| display:none |
| } |
| } |
| .navbar__menu { |
| display:flex; |
| justify-content:space-between; |
| align-items:center; |
| list-style:none; |
| margin:0; |
| padding:0; |
| gap:.25rem; |
| margin-left:auto |
| } |
| |
| @media(max-width:768px) { |
| .navbar__menu { |
| flex-direction:column; |
| justify-content:flex-start; |
| width:100%; |
| background-color:var(--surface2); |
| position:fixed; |
| top:0; |
| left:0; |
| right:0; |
| bottom:0; |
| padding:1.5rem; |
| transform:translateX(100%); |
| transition:transform .5s ease-in-out |
| } |
| } |
| @media(max-width:768px) { |
| .navbar__menu.active { |
| transform:translateX(0) |
| } |
| } |
| .navbar__close { |
| background:0 0; |
| border:none; |
| cursor:pointer; |
| font-size:1.5rem; |
| color:var(--text2); |
| margin-left:auto |
| } |
| .navbar__close:hover { |
| color:var(--text1) |
| } |
| |
| @media(min-width:769px) { |
| .navbar__close { |
| display:none |
| } |
| } |
| .navbar__links { |
| display:flex; |
| gap:1rem; |
| align-items:center; |
| margin:0; |
| padding:0 |
| } |
| |
| @media(max-width:768px) { |
| .navbar__links { |
| flex-direction:column |
| } |
| } |
| |
| .navbar__item { |
| list-style-type:none |
| } |
| |
| .navbar__link { |
| color:var(--text2); |
| text-decoration:none; |
| padding:.5rem |
| } |
| |
| .navbar__link:hover { |
| color:var(--text1) |
| } |
| |
| .navbar__theme-toggle-button { |
| background:0 0; |
| color:var(--text2); |
| border:none; |
| cursor:pointer; |
| font-size:1.5rem; |
| width:2.5rem; |
| height:2.5rem |
| } |
| |
| .navbar__theme-toggle-button:hover { |
| color:var(--text1) |
| } |
| |
| .hero__container { |
| margin-top:1rem; |
| display:flex; |
| justify-content:center; |
| align-items:center; |
| gap:2rem |
| } |
| |
| .hero__title { |
| font-size:2.5rem; |
| margin-bottom:.5rem |
| } |
| |
| .hero__title-large { |
| font-size:3rem |
| } |
| |
| @media(max-width:768px) { |
| .hero__title-large { |
| font-size:2.5rem |
| } |
| } |
| |
| @media(max-width:480px) { |
| .hero__title-large { |
| font-size:2rem |
| } |
| } |
| |
| @media(max-width:768px) { |
| .hero__title { |
| font-size:2rem |
| } |
| } |
| |
| @media(max-width:480px) { |
| .hero__title { |
| font-size:1.75rem |
| } |
| } |
| |
| .hero__subtitle { |
| font-size:1.25rem; |
| font-weight:500 |
| } |
| |
| @media(max-width:768px) { |
| .hero__subtitle { |
| font-size:1rem |
| } |
| } |
| |
| @media(max-width:480px) { |
| .hero__subtitle { |
| font-size:.875rem |
| } |
| } |
| |
| .section-container { |
| max-width: 2048px; |
| margin-left:auto; |
| margin-right:auto; |
| margin-top:0; |
| margin-bottom: 1rem; |
| padding:1rem 2rem |
| } |
| |
| @media(max-width:768px) { |
| .section-container { |
| padding:1rem |
| } |
| } |
| |
| .section-container h2 { |
| font-size:1.5rem; |
| margin-bottom:1rem; |
| color:var(--brand); |
| border-bottom: 1px solid var(--text2); |
| } |
| |
| @media(max-width:768px) { |
| .section-container h2 { |
| font-size:1.25rem |
| } |
| } |
| |
| .section-container p { |
| font-size:1rem; |
| line-height:1.5 |
| } |
| |
| @media(max-width:768px) { |
| .section-container p { |
| font-size:.875rem |
| } |
| } |
| |
| .home__row { |
| display:grid; |
| grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); |
| gap:2rem |
| } |
| |
| .table-wrapper { |
| display:flex; |
| flex-direction:column; |
| padding:1rem; |
| border-collapse: collapse; /* Ensures there are no gaps between cells */ |
| } |
| |
| .table-wrapper th, .table-wrapper td { |
| padding: 0.5rem 1rem; /* Adds padding inside the cells */ |
| border:1px solid var(--text1); |
| text-align: left; |
| } |
| |
| .block-command-command { |
| font-weight: bold; |
| } |
| |
| .code-clang-doc { |
| font-size: 1.1rem; |
| } |
| |
| .delimiter-container { |
| padding: 0.5rem 1rem; |
| margin-bottom:1rem; |
| } |
| |
| .resizer { |
| width: 5px; |
| cursor: col-resize; |
| background-color: var(--text2); |
| } |
| |
| .resizer:hover { |
| background-color: var(--text2-inverse); |
| } |
| |
| .sidebar { |
| width: 250px; |
| top: 0; |
| left: 0; |
| height: 100%; |
| position: fixed; |
| background-color: var(--surface1); |
| display: flex; |
| border-left: 1px solid var(--text2); |
| flex-direction: column; |
| overflow-y: auto; |
| scrollbar-width: thin; |
| } |
| |
| .sidebar h2 { |
| margin-top: 0; |
| margin-bottom: 20px; |
| padding: 10px; |
| } |
| |
| .sidebar ul { |
| width: 100%; |
| padding: 0; |
| list-style-type: none; |
| } |
| |
| .sidebar ul li { |
| padding-right: 1rem; |
| padding-left: 2rem; |
| padding-top: 0.25rem; |
| padding-bottom: 0.25rem; |
| } |
| |
| .sidebar-section { |
| font-size:1.5rem; |
| font-weight: bold; |
| margin-bottom: 1rem; |
| padding: 3rem; |
| } |
| .sidebar-section a { |
| color: var(--brand) |
| } |
| |
| /* Content */ |
| .content { |
| background-color: var(--text1-inverse); |
| padding: 20px; |
| left: 250px; |
| position: relative; |
| width: calc(100% - 250px); |
| height: 100vh; |
| } |
| |
| .sidebar-item { |
| color: var(--text1); |
| } |
| |
| .sidebar-item-container:hover { |
| width: 100%; |
| background-color: grey; |
| } |
| |
| .sidebar-item-container:hover a { |
| width: 100%; |
| color: var(--text1-inverse); |
| } |
| |
| .class-container { |
| padding: 0.5rem 1rem; |
| } |
| |
| a, a:visited, a:hover, a:active { |
| text-decoration: none; |
| color: inherit; |
| } |
| |
| .code-block { |
| white-space: pre-line; |
| } |
