mirror of
https://github.com/ultralytics/ultralytics
synced 2026-05-11 09:33:31 +00:00
368 lines
9 KiB
CSS
368 lines
9 KiB
CSS
/* Ultralytics 🚀 AGPL-3.0 License - https://ultralytics.com/license */
|
|
|
|
/* Table format like GitHub ----------------------------------------------------------------------------------------- */
|
|
th,
|
|
td {
|
|
border: 1px solid var(--md-typeset-table-color);
|
|
border-spacing: 0;
|
|
border-bottom: none;
|
|
border-left: none;
|
|
border-top: none;
|
|
}
|
|
.md-typeset__table {
|
|
line-height: 1;
|
|
}
|
|
.md-typeset__table table:not([class]) {
|
|
font-size: 0.74rem;
|
|
border-right: none;
|
|
}
|
|
.md-typeset__table table:not([class]) td,
|
|
.md-typeset__table table:not([class]) th {
|
|
padding: 9px;
|
|
}
|
|
/* light mode alternating table bg colors */
|
|
.md-typeset__table tr:nth-child(2n) {
|
|
background-color: #f6f8fa;
|
|
}
|
|
/* fix inline code overlap */
|
|
.md-typeset__table table:not([class]) code {
|
|
padding: unset;
|
|
}
|
|
/* dark mode alternating table bg colors */
|
|
[data-md-color-scheme="slate"] .md-typeset__table tr:nth-child(2n) {
|
|
background-color: #161b22;
|
|
}
|
|
/* Table format like GitHub ----------------------------------------------------------------------------------------- */
|
|
|
|
/* Ensure in-page anchors account for sticky header/nav height to fix Zensical bug of clicked header behind nav bar*/
|
|
:root {
|
|
--anchor-offset: 140px;
|
|
}
|
|
html {
|
|
scroll-padding-top: var(--anchor-offset);
|
|
}
|
|
.md-typeset :is(h1, h2, h3, h4, h5, h6)[id] {
|
|
scroll-margin-top: var(--anchor-offset);
|
|
}
|
|
@media (max-width: 768px) {
|
|
:root {
|
|
--anchor-offset: 110px;
|
|
}
|
|
}
|
|
|
|
/* Code block vertical scroll */
|
|
div.highlight {
|
|
max-height: 20rem;
|
|
overflow-y: auto; /* for adding a scrollbar when needed */
|
|
}
|
|
|
|
/* Set content width */
|
|
.md-grid {
|
|
max-width: 1440px;
|
|
}
|
|
|
|
/* Set language dropdown maximum height to screen height */
|
|
.md-header .md-select:hover .md-select__inner {
|
|
max-height: 75vh;
|
|
}
|
|
|
|
/* Ultralytics Search Bar ------------------------------------------------------------------------------------------- */
|
|
:root {
|
|
--ult-search-bg: #f5f6f8;
|
|
--ult-search-border: #dcdfe5;
|
|
--ult-search-hover-bg: #eef0f4;
|
|
--ult-search-hover-border: #cfd3db;
|
|
--ult-search-hotkey-bg: var(--md-default-fg-color--lightest);
|
|
--ult-search-hotkey-fg: var(--md-default-fg-color--lighter);
|
|
--ult-search-icon-bg: #eef0f4;
|
|
--ult-search-icon-border: #cfd3db;
|
|
}
|
|
[data-md-color-scheme="slate"] {
|
|
--ult-search-bg: rgba(255, 255, 255, 0.04);
|
|
--ult-search-border: rgba(255, 255, 255, 0.12);
|
|
--ult-search-hover-bg: rgba(255, 255, 255, 0.08);
|
|
--ult-search-hover-border: rgba(255, 255, 255, 0.2);
|
|
--ult-search-hotkey-bg: rgba(255, 255, 255, 0.14);
|
|
--ult-search-hotkey-fg: rgba(255, 255, 255, 0.86);
|
|
--ult-search-icon-bg: rgba(255, 255, 255, 0.08);
|
|
--ult-search-icon-border: rgba(255, 255, 255, 0.24);
|
|
}
|
|
.md-header label[for="__search"],
|
|
.md-search {
|
|
display: none;
|
|
}
|
|
.ult-header-search {
|
|
transform: scale(0.7);
|
|
transform-origin: left center;
|
|
margin-right: 0.5rem;
|
|
}
|
|
.ult-search-button {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
padding: 0.5rem 1rem;
|
|
background: var(--ult-search-bg);
|
|
border: 1px solid var(--ult-search-border);
|
|
border-radius: 0.5rem;
|
|
color: var(--md-default-fg-color);
|
|
font-size: 1.1rem;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
}
|
|
.ult-search-button:hover {
|
|
transform: scale(1.1);
|
|
filter: brightness(1.04);
|
|
border-color: var(--ult-search-hover-border);
|
|
background: var(--ult-search-hover-bg);
|
|
}
|
|
.ult-search-button:focus-visible {
|
|
outline: none;
|
|
border-color: var(--ult-search-hover-border);
|
|
background: var(--ult-search-hover-bg);
|
|
}
|
|
.ult-search-button svg {
|
|
flex-shrink: 0;
|
|
width: 30px;
|
|
height: 30px;
|
|
}
|
|
.ult-search-hotkey {
|
|
margin-left: 0.25rem;
|
|
padding: 0.1rem 0.4rem;
|
|
border-radius: 0.35rem;
|
|
background: var(--ult-search-hotkey-bg);
|
|
color: var(--ult-search-hotkey-fg);
|
|
font-size: 0.75rem;
|
|
line-height: 1.3;
|
|
}
|
|
@media (max-width: 768px) {
|
|
.ult-header-search {
|
|
transform: none;
|
|
margin-right: 0;
|
|
}
|
|
.ult-search-button {
|
|
width: 2.5rem;
|
|
height: 2.5rem;
|
|
padding: 0.25rem;
|
|
gap: 0;
|
|
border: none;
|
|
border-radius: 0;
|
|
background: transparent;
|
|
justify-content: center;
|
|
}
|
|
.ult-search-button:hover,
|
|
.ult-search-button:focus-visible {
|
|
transform: none;
|
|
filter: none;
|
|
background: transparent;
|
|
border: none;
|
|
}
|
|
.ult-search-button span {
|
|
display: none;
|
|
}
|
|
.ult-search-button svg {
|
|
width: 1rem;
|
|
height: 1rem;
|
|
}
|
|
}
|
|
/* Ultralytics Search Bar ------------------------------------------------------------------------------------------- */
|
|
|
|
/* Banner ----------------------------------------------------------------------------------------------------------- */
|
|
.md-banner {
|
|
background-image: url(https://cdn.prod.website-files.com/680a070c3b99253410dd3dcf/69ba5b087cc15ceeac92de7b_Banner%20Horizontal%201920x540.png);
|
|
background-size: cover;
|
|
background-position: 85%;
|
|
background-repeat: no-repeat;
|
|
}
|
|
.md-banner__inner {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
gap: 12px;
|
|
}
|
|
.md-banner__button {
|
|
cursor: pointer;
|
|
flex-shrink: 0;
|
|
width: 20px;
|
|
height: 20px;
|
|
color: #fff;
|
|
transition: opacity 0.2s ease;
|
|
}
|
|
.md-banner__button svg {
|
|
stroke-width: 2;
|
|
}
|
|
.md-banner__button:hover {
|
|
opacity: 0.6;
|
|
}
|
|
.banner-wrapper,
|
|
.banner-wrapper > .banner-content-wrapper {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.banner-wrapper {
|
|
flex: 1;
|
|
padding: 40px 0;
|
|
}
|
|
.banner-wrapper > .banner-content-wrapper {
|
|
flex-direction: column;
|
|
gap: 12px;
|
|
}
|
|
.banner-wrapper > .banner-content-wrapper > .banner-logo {
|
|
height: 30px;
|
|
}
|
|
.banner-wrapper > .banner-content-wrapper > p {
|
|
margin: 0;
|
|
font-size: 16px;
|
|
font-weight: 600;
|
|
text-align: center;
|
|
color: #fff;
|
|
background-image: linear-gradient(93deg, #b8fff2, #e3fffa 24%, #eef1fe 70%, #a1b0f3);
|
|
background-clip: text;
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
}
|
|
.banner-wrapper > .banner-arrow {
|
|
display: none;
|
|
}
|
|
@media screen and (min-width: 768px) {
|
|
.md-banner {
|
|
background-position: center;
|
|
}
|
|
.md-banner__inner,
|
|
.banner-wrapper,
|
|
.banner-wrapper > .banner-content-wrapper {
|
|
gap: 32px;
|
|
}
|
|
.banner-wrapper > .banner-content-wrapper {
|
|
flex-direction: row;
|
|
}
|
|
.banner-wrapper {
|
|
padding: 20px 0;
|
|
}
|
|
.banner-wrapper > .banner-content-wrapper > .banner-logo {
|
|
height: 28px;
|
|
}
|
|
.banner-wrapper > .banner-content-wrapper > p {
|
|
font-size: 18px;
|
|
}
|
|
.banner-wrapper > .banner-arrow {
|
|
display: revert;
|
|
width: 24px;
|
|
height: 24px;
|
|
flex-shrink: 0;
|
|
}
|
|
}
|
|
/* Banner ----------------------------------------------------------------------------------------------------------- */
|
|
|
|
/* MkDocs Ultralytics Plugin ---------------------------------------------------------------------------------------- */
|
|
.git-info,
|
|
.dates-container,
|
|
.authors-container,
|
|
.share-buttons {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
flex-wrap: wrap;
|
|
}
|
|
.git-info {
|
|
font-size: 0.8em;
|
|
color: gray;
|
|
margin-bottom: 10px;
|
|
}
|
|
.dates-container,
|
|
.authors-container {
|
|
margin-bottom: 10px;
|
|
}
|
|
.date-item,
|
|
.author-link,
|
|
.share-button {
|
|
display: flex;
|
|
align-items: center;
|
|
cursor: pointer;
|
|
}
|
|
.date-item {
|
|
margin-right: 10px;
|
|
}
|
|
.hover-item {
|
|
transition: all 0.2s ease;
|
|
filter: grayscale(100%);
|
|
}
|
|
.date-item .hover-item {
|
|
font-size: 1.6em;
|
|
margin-right: 5px;
|
|
}
|
|
.author-link .hover-item {
|
|
width: 50px;
|
|
height: 50px;
|
|
border-radius: 50%;
|
|
margin-right: 3px;
|
|
background-color: #f0f0f0; /* Placeholder color */
|
|
opacity: 0; /* Start fully transparent */
|
|
transition: opacity 0.3s ease-in-out;
|
|
}
|
|
.author-link .hover-item[src] {
|
|
opacity: 1; /* Fade in when src is set (image loaded) */
|
|
}
|
|
.hover-item:hover {
|
|
transform: scale(1.2);
|
|
filter: grayscale(0%);
|
|
}
|
|
.share-buttons {
|
|
margin-top: 10px;
|
|
}
|
|
.share-button {
|
|
background-color: #1da1f2;
|
|
color: white;
|
|
padding: 6px 12px;
|
|
border-radius: 5px;
|
|
border: none;
|
|
font-size: 0.95em;
|
|
margin: 5px;
|
|
transition: all 0.2s ease;
|
|
}
|
|
.share-button:hover {
|
|
transform: scale(1.1);
|
|
filter: brightness(1.2);
|
|
}
|
|
.share-button.linkedin {
|
|
background-color: #0077b5;
|
|
}
|
|
.share-button i {
|
|
margin-right: 5px;
|
|
font-size: 1.1em;
|
|
}
|
|
@media (max-width: 1024px) {
|
|
.git-info {
|
|
flex-direction: column;
|
|
align-items: flex-end;
|
|
}
|
|
.dates-container,
|
|
.authors-container {
|
|
width: 100%;
|
|
}
|
|
}
|
|
/* MkDocs Ultralytics Plugin ---------------------------------------------------------------------------------------- */
|
|
|
|
/* Logo switching for light/dark mode ------------------------------------------------------------------------------- */
|
|
[data-md-color-scheme="default"] .md-header__button.md-logo img {
|
|
content: url("https://cdn.prod.website-files.com/680a070c3b99253410dd3dcf/68e4eb1e9893320b26cc02c3_Ultralytics%20Logo.png.svg");
|
|
}
|
|
[data-md-color-scheme="slate"] .md-header__button.md-logo img {
|
|
content: url("https://raw.githubusercontent.com/ultralytics/assets/main/logo/Ultralytics_Logotype_Reverse.svg");
|
|
}
|
|
/* Logo switching for light/dark mode ------------------------------------------------------------------------------- */
|
|
|
|
/* Remove underlines from links */
|
|
.md-typeset a {
|
|
text-decoration: none;
|
|
}
|
|
|
|
/* Remove language switcher */
|
|
.weglot-container,
|
|
.weglot_switcher,
|
|
[id^="weglot-switcher"],
|
|
.weglot-container[id^="weglot-switcher"] {
|
|
display: none;
|
|
}
|