mirror of
https://github.com/huggingface/transformers.git
synced 2025-07-04 05:10:06 +06:00

* First draft * Styling * With all changes staged * Update docs/source/index.rst Co-authored-by: Julien Chaumond <chaumond@gmail.com> * Styling Co-authored-by: Julien Chaumond <chaumond@gmail.com>
351 lines
7.1 KiB
CSS
351 lines
7.1 KiB
CSS
/* Our DOM objects */
|
|
|
|
/* Colab dropdown */
|
|
|
|
table.center-aligned-table td {
|
|
text-align: center;
|
|
}
|
|
|
|
table.center-aligned-table th {
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.colab-dropdown {
|
|
position: relative;
|
|
display: inline-block;
|
|
}
|
|
|
|
.colab-dropdown-content {
|
|
display: none;
|
|
position: absolute;
|
|
background-color: #f9f9f9;
|
|
min-width: 117px;
|
|
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
|
|
z-index: 1;
|
|
}
|
|
|
|
.colab-dropdown-content button {
|
|
color: #6670FF;
|
|
background-color: #f9f9f9;
|
|
font-size: 12px;
|
|
border: none;
|
|
min-width: 117px;
|
|
padding: 5px 5px;
|
|
text-decoration: none;
|
|
display: block;
|
|
}
|
|
|
|
.colab-dropdown-content button:hover {background-color: #eee;}
|
|
|
|
.colab-dropdown:hover .colab-dropdown-content {display: block;}
|
|
|
|
/* Version control */
|
|
|
|
.version-button {
|
|
background-color: #6670FF;
|
|
color: white;
|
|
border: none;
|
|
padding: 5px;
|
|
font-size: 15px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.version-button:hover, .version-button:focus {
|
|
background-color: #A6B0FF;
|
|
}
|
|
|
|
.version-dropdown {
|
|
display: none;
|
|
background-color: #6670FF;
|
|
min-width: 160px;
|
|
overflow: auto;
|
|
font-size: 15px;
|
|
}
|
|
|
|
.version-dropdown a {
|
|
color: white;
|
|
padding: 3px 4px;
|
|
text-decoration: none;
|
|
display: block;
|
|
}
|
|
|
|
.version-dropdown a:hover {
|
|
background-color: #A6B0FF;
|
|
}
|
|
|
|
.version-show {
|
|
display: block;
|
|
}
|
|
|
|
/* Framework selector */
|
|
|
|
.framework-selector {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: flex-end;
|
|
margin-right: 30px;
|
|
}
|
|
|
|
.framework-selector > button {
|
|
background-color: white;
|
|
color: #6670FF;
|
|
border: 1px solid #6670FF;
|
|
padding: 5px;
|
|
}
|
|
|
|
.framework-selector > button.selected{
|
|
background-color: #6670FF;
|
|
color: white;
|
|
border: 1px solid #6670FF;
|
|
padding: 5px;
|
|
}
|
|
|
|
/* Copy button */
|
|
|
|
a.copybtn {
|
|
margin: 3px;
|
|
}
|
|
|
|
/* The literal code blocks */
|
|
.rst-content tt.literal, .rst-content tt.literal, .rst-content code.literal {
|
|
color: #6670FF;
|
|
}
|
|
|
|
/* To keep the logo centered */
|
|
.wy-side-scroll {
|
|
width: auto;
|
|
font-size: 20px;
|
|
}
|
|
|
|
/* The div that holds the Hugging Face logo */
|
|
.HuggingFaceDiv {
|
|
width: 100%
|
|
}
|
|
|
|
/* The research field on top of the toc tree */
|
|
.wy-side-nav-search{
|
|
padding-top: 0;
|
|
background-color: #6670FF;
|
|
}
|
|
|
|
/* The toc tree */
|
|
.wy-nav-side{
|
|
background-color: #6670FF;
|
|
}
|
|
|
|
/* The section headers in the toc tree */
|
|
.wy-menu-vertical p.caption{
|
|
background-color: #4d59ff;
|
|
line-height: 40px;
|
|
}
|
|
|
|
/* The selected items in the toc tree */
|
|
.wy-menu-vertical li.current{
|
|
background-color: #A6B0FF;
|
|
}
|
|
|
|
/* When a list item that does belong to the selected block from the toc tree is hovered */
|
|
.wy-menu-vertical li.current a:hover{
|
|
background-color: #B6C0FF;
|
|
}
|
|
|
|
/* When a list item that does NOT belong to the selected block from the toc tree is hovered. */
|
|
.wy-menu-vertical li a:hover{
|
|
background-color: #A7AFFB;
|
|
}
|
|
|
|
/* The text items on the toc tree */
|
|
.wy-menu-vertical a {
|
|
color: #FFFFDD;
|
|
font-family: Calibre-Light, sans-serif;
|
|
}
|
|
.wy-menu-vertical header, .wy-menu-vertical p.caption{
|
|
color: white;
|
|
font-family: Calibre-Light, sans-serif;
|
|
}
|
|
|
|
/* The color inside the selected toc tree block */
|
|
.wy-menu-vertical li.toctree-l2 a, .wy-menu-vertical li.toctree-l3 a, .wy-menu-vertical li.toctree-l4 a {
|
|
color: black;
|
|
}
|
|
|
|
/* Inside the depth-2 selected toc tree block */
|
|
.wy-menu-vertical li.toctree-l2.current>a {
|
|
background-color: #B6C0FF
|
|
}
|
|
.wy-menu-vertical li.toctree-l2.current li.toctree-l3>a {
|
|
background-color: #C6D0FF
|
|
}
|
|
|
|
/* Inside the depth-3 selected toc tree block */
|
|
.wy-menu-vertical li.toctree-l3.current li.toctree-l4>a{
|
|
background-color: #D6E0FF
|
|
}
|
|
|
|
/* Inside code snippets */
|
|
.rst-content dl:not(.docutils) dt{
|
|
font-size: 15px;
|
|
}
|
|
|
|
/* Links */
|
|
a {
|
|
color: #6670FF;
|
|
}
|
|
|
|
/* Content bars */
|
|
.rst-content dl:not(.docutils) dt {
|
|
background-color: rgba(251, 141, 104, 0.1);
|
|
border-right: solid 2px #FB8D68;
|
|
border-left: solid 2px #FB8D68;
|
|
color: #FB8D68;
|
|
font-family: Calibre-Light, sans-serif;
|
|
border-top: none;
|
|
font-style: normal !important;
|
|
}
|
|
|
|
/* Expand button */
|
|
.wy-menu-vertical li.toctree-l2 span.toctree-expand,
|
|
.wy-menu-vertical li.on a span.toctree-expand, .wy-menu-vertical li.current>a span.toctree-expand,
|
|
.wy-menu-vertical li.toctree-l3 span.toctree-expand{
|
|
color: black;
|
|
}
|
|
|
|
/* Max window size */
|
|
.wy-nav-content{
|
|
max-width: 1200px;
|
|
}
|
|
|
|
/* Mobile header */
|
|
.wy-nav-top{
|
|
background-color: #6670FF;
|
|
}
|
|
|
|
|
|
/* Source spans */
|
|
.rst-content .viewcode-link, .rst-content .viewcode-back{
|
|
color: #6670FF;
|
|
font-size: 110%;
|
|
letter-spacing: 2px;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
/* It would be better for table to be visible without horizontal scrolling */
|
|
.wy-table-responsive table td, .wy-table-responsive table th{
|
|
white-space: normal;
|
|
}
|
|
|
|
.footer {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.footer__Social {
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
.footer__CustomImage {
|
|
margin: 2px 5px 0 0;
|
|
}
|
|
|
|
/* class and method names in doc */
|
|
.rst-content dl:not(.docutils) tt.descname, .rst-content dl:not(.docutils) tt.descclassname, .rst-content dl:not(.docutils) tt.descname, .rst-content dl:not(.docutils) code.descname, .rst-content dl:not(.docutils) tt.descclassname, .rst-content dl:not(.docutils) code.descclassname{
|
|
font-family: Calibre, sans-serif;
|
|
font-size: 20px !important;
|
|
}
|
|
|
|
/* class name in doc*/
|
|
.rst-content dl:not(.docutils) tt.descname, .rst-content dl:not(.docutils) tt.descname, .rst-content dl:not(.docutils) code.descname{
|
|
margin-right: 10px;
|
|
font-family: Calibre-Medium, sans-serif;
|
|
}
|
|
|
|
/* Method and class parameters */
|
|
.sig-param{
|
|
line-height: 23px;
|
|
}
|
|
|
|
/* Class introduction "class" string at beginning */
|
|
.rst-content dl:not(.docutils) .property{
|
|
font-size: 18px;
|
|
color: black;
|
|
}
|
|
|
|
|
|
/* FONTS */
|
|
body{
|
|
font-family: Calibre, sans-serif;
|
|
font-size: 16px;
|
|
}
|
|
|
|
h1 {
|
|
font-family: Calibre-Thin, sans-serif;
|
|
font-size: 70px;
|
|
}
|
|
|
|
h2, .rst-content .toctree-wrapper p.caption, h3, h4, h5, h6, legend{
|
|
font-family: Calibre-Medium, sans-serif;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: Calibre-Medium;
|
|
src: url(./Calibre-Medium.otf);
|
|
font-weight:400;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: Calibre;
|
|
src: url(./Calibre-Regular.otf);
|
|
font-weight:400;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: Calibre-Light;
|
|
src: url(./Calibre-Light.ttf);
|
|
font-weight:400;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: Calibre-Thin;
|
|
src: url(./Calibre-Thin.otf);
|
|
font-weight:400;
|
|
}
|
|
|
|
|
|
/**
|
|
* Nav Links to other parts of huggingface.co
|
|
*/
|
|
div.menu {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
padding-top: 20px;
|
|
padding-right: 20px;
|
|
z-index: 1000;
|
|
}
|
|
div.menu a {
|
|
font-size: 14px;
|
|
letter-spacing: 0.3px;
|
|
text-transform: uppercase;
|
|
color: white;
|
|
-webkit-font-smoothing: antialiased;
|
|
background: linear-gradient(0deg, #6671ffb8, #9a66ffb8 50%);
|
|
padding: 10px 16px 6px 16px;
|
|
border-radius: 3px;
|
|
margin-left: 12px;
|
|
position: relative;
|
|
}
|
|
div.menu a:active {
|
|
top: 1px;
|
|
}
|
|
@media (min-width: 768px) and (max-width: 1750px) {
|
|
.wy-breadcrumbs {
|
|
margin-top: 32px;
|
|
}
|
|
}
|
|
@media (max-width: 768px) {
|
|
div.menu {
|
|
display: none;
|
|
}
|
|
}
|