* { all: unset; margin: 0; padding: 0; border: none; box-sizing: border-box; } head, title { display: none; } header { background-color: #1a1a1a; padding: 1px 1em; display: flex; justify-content: space-between; align-items: center; width: 100%; border-bottom: 1px solid #444; } header .header-section { display: flex; align-items: center; gap: 3px; font-family: "Noto Sans", "Liberation Sans"; } header .header-section.header-left a { color: #f0f0f0; text-decoration: none; font-weight: normal; font-size: 0.95rem; padding: 0.3em; margin: 1px; border-radius: 3px; line-height: 2em; } header .header-section.header-left a.logo { display: flex; align-items: center; margin-right: 1em; padding: auto; } header .header-section.header-left a.logo img { height: 27px; width: auto; } header .header-section.header-left a:hover { color: #bfbfbf; background-color: #444; } header .header-section.header-right a { color: #f0f0f0; display: flex; align-items: center; justify-content: center; text-decoration: none; font-size: 1.2rem; width: 32px; height: 32px; } header .header-section.header-right a.profile-icon { border-radius: 50%; overflow: hidden; display: flex; align-items: center; justify-content: center; } header .header-section.header-right a.profile-icon img { width: 26px; height: 26px; border-radius: 50%; } header .header-section.header-right a.profile-icon:hover { border: 1px solid #707070; } header .header-section.header-right a:hover { background-color: #333; border-radius: 50%; } .sidebar-right { width: 250px; background-color: #1a1a1a; color: #f0f0f0; padding: 0; display: flex; flex-direction: column; } .sidebar-right .repo-info { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-bottom: 2px solid cadetblue; } .sidebar-right .repo-info .repo-logo { width: 39px; height: 39px; border-radius: 50%; display: flex; padding: 2px; background-color: black; } .sidebar-right .repo-info .repo-logo img { width: 35px; height: 35px; border-radius: 50%; line-height: 35px; text-align: center; font-size: 23px; font-family: "Font Awesome 6 Free"; font-style: normal; font-weight: 400; font-display: block; src: url("../fonts/fa-regular-400.woff2") format("woff2"), url("../fonts/fa-regular-400.ttf") format("truetype"); } .sidebar-right .repo-info .repo-details .repo-author { font-size: 0.9rem; color: #bfbfbf; display: block; } .sidebar-right .repo-info .repo-details .repo-name { font-size: 1.1rem; font-weight: bold; display: block; } .sidebar-right .repo-info:hover .repo-logo img, .sidebar-right .repo-info:active .repo-logo img { border: 1px solid #9b9b9b; } .sidebar-right .repo-nav { display: flex; flex-direction: column; } .sidebar-right .repo-nav .nav-link { display: flex; align-items: center; gap: 10px; color: #f0f0f0; text-decoration: none; font-size: 15px; padding: 0.75em 12px; border-left: 2px solid rgba(0, 0, 0, 0); } .sidebar-right .repo-nav .nav-link:hover, .sidebar-right .repo-nav .nav-link:active { background-color: #333; border-left: 2px solid wheat; } .sidebar-right .repo-nav .nav-link i { font-size: 1em; width: 1em; height: 1em; text-align: center; } .sidebar-right .repo-stats { display: flex; gap: 0.5rem; padding: 7px 12px; } .sidebar-right .repo-stats .stat-item { display: flex; align-items: center; gap: 3px; background-color: #333; padding: 0.3rem 0.5rem; border-radius: 1rem; color: #f0f0f0; font-size: 0.8rem; height: 1.4rem; } .sidebar-right .repo-stats .stat-item .stat-icon { font-size: 0.9em; } .sidebar-right .repo-stats .stat-item .stat-count { color: #f0f0f0; min-width: 4ch; text-align: right; } .sidebar-right .repo-stats .stat-item:hover, .sidebar-right .repo-stats .stat-item:active { background-color: #444; color: #1b97ff; } .sidebar-right .settings-link { display: flex; align-items: center; gap: 10px; color: #f0f0f0; text-decoration: none; font-size: 15px; padding: 0.75em 12px; border-left: 2px solid rgba(0, 0, 0, 0); margin-top: auto; } .sidebar-right .settings-link:hover, .sidebar-right .settings-link:active { background-color: #333; border-left: 2px solid wheat; } .sidebar-right .settings-link i { font-size: 1em; width: 1em; height: 1em; text-align: center; } /*! * Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) * Copyright 2024 Fonticons, Inc. */ .fa { font-family: var(--fa-style-family, "Font Awesome 6 Free"); font-weight: var(--fa-style, 900); } .fa-solid, .fa-regular, .fa-brands, .fas, .far, .fab, .fa-sharp-solid, .fa-classic, .fa { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: var(--fa-display, inline-block); font-style: normal; font-variant: normal; line-height: 1; text-rendering: auto; } .fas, .fa-classic, .fa-solid, .far, .fa-regular { font-family: "Font Awesome 6 Free"; } .fab, .fa-brands { font-family: "Font Awesome 6 Brands"; } .fa-1x { font-size: 1em; } .fa-2x { font-size: 2em; } .fa-3x { font-size: 3em; } .fa-4x { font-size: 4em; } .fa-5x { font-size: 5em; } .fa-6x { font-size: 6em; } .fa-7x { font-size: 7em; } .fa-8x { font-size: 8em; } .fa-9x { font-size: 9em; } .fa-10x { font-size: 10em; } .fa-2xs { font-size: 0.625em; line-height: 0.1em; vertical-align: 0.225em; } .fa-xs { font-size: 0.75em; line-height: 0.0833333337em; vertical-align: 0.125em; } .fa-sm { font-size: 0.875em; line-height: 0.0714285718em; vertical-align: 0.0535714295em; } .fa-lg { font-size: 1.25em; line-height: 0.05em; vertical-align: -0.075em; } .fa-xl { font-size: 1.5em; line-height: 0.0416666682em; vertical-align: -0.125em; } .fa-2xl { font-size: 2em; line-height: 0.03125em; vertical-align: -0.1875em; } .fa-fw { text-align: center; width: 1.25em; } .fa-ul { list-style-type: none; margin-left: var(--fa-li-margin, 2.5em); padding-left: 0; } .fa-ul > li { position: relative; } .fa-li { left: calc(-1 * var(--fa-li-width, 2em)); position: absolute; text-align: center; width: var(--fa-li-width, 2em); line-height: inherit; } /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen readers do not read off random characters that represent icons */ .fa-house::before { content: "\f015"; } .fa-code::before { content: "\f121"; } .fa-exclamation-circle::before { content: "\f06a"; } .fa-code-branch::before { content: "\f126"; } .fa-play::before { content: "\f04b"; } .fa-tasks::before { content: "\f0ae"; } .fa-tag::before { content: "\f02b"; } .fa-book::before { content: "\f02d"; } .fa-chart-line::before { content: "\f201"; } .fa-gear::before { content: "\f013"; } .fa-eye::before { content: "\f06e"; } .fa-star::before { content: "\f005"; } .fa-box::before { content: "\f466"; } .sr-only, .fa-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; } .sr-only-focusable:not(:focus), .fa-sr-only-focusable:not(:focus) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; } /*! * Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) * Copyright 2024 Fonticons, Inc. */ :root, :host { --fa-style-family-classic: "Font Awesome 6 Free"; --fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free"; } @font-face { font-family: "Font Awesome 6 Free"; font-style: normal; font-weight: 400; font-display: block; src: url("../fonts/fa-regular-400.woff2") format("woff2"), url("../fonts/fa-regular-400.ttf") format("truetype"); } .far, .fa-regular { font-weight: 400; } /*! * Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) * Copyright 2024 Fonticons, Inc. */ :root, :host { --fa-style-family-classic: "Font Awesome 6 Free"; --fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free"; } @font-face { font-family: "Font Awesome 6 Free"; font-style: normal; font-weight: 900; font-display: block; src: url("../fonts/fa-solid-900.woff2") format("woff2"), url("../fonts/fa-solid-900.ttf") format("truetype"); } .fas, .fa-solid { font-weight: 900; } body { background-color: #232323; display: flex; flex-direction: column; min-height: 100vh; } body .body-content main.main-content { flex: 1; background-color: #535153; } body .body-content .sidebar-left { width: 250px; background-color: #747272; /* Left sidebar styles */ } body > *:not(header) { display: flex; flex-direction: row; flex: 1; }