mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2025-03-13 12:50:19 +00:00
af3bd11bcd
and only apply it to IE This will help to simplify further develpment by relying only to variant.css for evergreen browsers
1473 lines
28 KiB
CSS
1473 lines
28 KiB
CSS
@charset "UTF-8";
|
|
|
|
@import "tags.css";
|
|
@import "tabs.css";
|
|
|
|
@font-face {
|
|
font-family: 'Work Sans';
|
|
font-style: normal;
|
|
font-weight: 200;
|
|
src: url("../fonts/WorkSans-ExtraLight.woff") format("woff2"), url("../fonts/WorkSans-ExtraLight.woff") format("woff");
|
|
font-display: swap;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'Work Sans';
|
|
font-style: normal;
|
|
font-weight: 300;
|
|
src: url("../fonts/WorkSans-Light.woff2") format("woff2"), url("../fonts/WorkSans-Light.woff") format("woff");
|
|
font-display: swap;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'Work Sans';
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
src: url("../fonts/WorkSans-Regular.woff2") format("woff2"), url("../fonts/WorkSans-Regular.woff") format("woff");
|
|
font-display: swap;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'Work Sans';
|
|
font-style: normal;
|
|
font-weight: 500;
|
|
src: url("../fonts/WorkSans-Medium.woff2") format("woff2"), url("../fonts/WorkSans-Medium.woff") format("woff");
|
|
font-display: swap;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'Work Sans';
|
|
font-style: normal;
|
|
font-weight: 600;
|
|
src: url("../fonts/WorkSans-Bold.woff2") format("woff2"), url("../fonts/WorkSans-Bold.woff") format("woff");
|
|
font-display: swap;
|
|
}
|
|
|
|
html {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
body {
|
|
display: flex;
|
|
flex-direction: row-reverse; /* IE11 to allow body to have initial focus for PS and better SEO and a11y */
|
|
font-size: 16.25px;
|
|
font-weight: 300;
|
|
height: 100%;
|
|
justify-content: flex-end;
|
|
line-height: 1.574;
|
|
overflow: hidden; /* to avoid browser scrollbar to flicker before we create our own */
|
|
width: 100%;
|
|
}
|
|
|
|
body #body-inner .chapter h1 {
|
|
font-size: 3.5rem;
|
|
}
|
|
@media only screen and (min-width: 48em) and (max-width: 59.938em) {
|
|
body #body-inner .chapter h1 {
|
|
font-size: 2.8rem;
|
|
}
|
|
}
|
|
@media only screen and (max-width: 47.938em) {
|
|
body #body-inner .chapter h1 {
|
|
font-size: 2rem;
|
|
}
|
|
}
|
|
|
|
pre {
|
|
position: relative;
|
|
}
|
|
|
|
b,
|
|
strong,
|
|
label,
|
|
th {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.default-animation{
|
|
transition: all 0.35s ease;
|
|
}
|
|
|
|
#sidebar {
|
|
display: flex;
|
|
flex-basis: auto;
|
|
flex-direction: column;
|
|
flex-grow: 0;
|
|
flex-shrink: 0;
|
|
font-size: 15.25px;
|
|
height: 100%;
|
|
left: 0;
|
|
line-height: 1.574;
|
|
min-height: 100%;
|
|
min-width: 300px;
|
|
max-width: 300px;
|
|
position: fixed;
|
|
width: 300px;
|
|
z-index: 310;
|
|
}
|
|
|
|
#header-wrapper {
|
|
border-bottom-style: solid;
|
|
border-bottom-width: 4px;
|
|
text-align: center;
|
|
padding: 1rem;
|
|
position: relative;
|
|
}
|
|
#header a {
|
|
display: inline-block;
|
|
}
|
|
|
|
.searchbox {
|
|
border-radius: 4px;
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
position: relative;
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.searchbox label {
|
|
color: rgba( 255, 255, 255, .8 );
|
|
position: absolute;
|
|
left: 10px;
|
|
top: 3px;
|
|
}
|
|
|
|
.searchbox span {
|
|
color: rgba( 255, 255, 255, .6 );
|
|
position: absolute;
|
|
right: 10px;
|
|
top: 3px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.searchbox span:hover {
|
|
color: rgba( 255, 255, 255, .9 );
|
|
}
|
|
|
|
.searchbox input {
|
|
display: inline-block;
|
|
width: 100%;
|
|
height: 30px;
|
|
background: transparent;
|
|
border: 0;
|
|
padding: 0 25px 0 30px;
|
|
margin: 0;
|
|
font-weight: 300;
|
|
}
|
|
|
|
.searchbox input:-ms-input-placeholder {
|
|
color: rgba( 255, 255, 255, .4 );
|
|
}
|
|
|
|
.searchbox input::placeholder {
|
|
color: rgba( 255, 255, 255, .4 );
|
|
}
|
|
|
|
#content-wrapper {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex: 1; /* fill rest of vertical space */
|
|
overflow: hidden;
|
|
position: relative; /* PS */
|
|
z-index: 410;
|
|
}
|
|
|
|
#sidebar a.padding {
|
|
padding: 0 1rem;
|
|
}
|
|
|
|
#sidebar ul.topics {
|
|
margin: 0 1rem;
|
|
}
|
|
|
|
#sidebar ul.topics.searched ul {
|
|
display: block;
|
|
}
|
|
|
|
#sidebar ul.topics ul {
|
|
display: none;
|
|
}
|
|
|
|
#sidebar ul.topics li {
|
|
position: relative;
|
|
}
|
|
|
|
#sidebar ul.topics > li > ul > li:last-child {
|
|
padding-bottom: 1rem;
|
|
}
|
|
|
|
#sidebar ul.topics ul ul {
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
#sidebar ul.topics li.parent > ul,
|
|
#sidebar ul.topics li.active > ul,
|
|
#sidebar ul.topics li.alwaysopen > ul {
|
|
display: block;
|
|
}
|
|
|
|
#sidebar ul.topics input.toggle,
|
|
#sidebar ul.topics label {
|
|
display: none;
|
|
}
|
|
|
|
#sidebar ul.topics > li > label,
|
|
#sidebar ul.topics > li > a {
|
|
font-size: 1.1rem;
|
|
line-height: 2rem;
|
|
}
|
|
|
|
#sidebar ul.topics > li > a b {
|
|
font-weight: 400;
|
|
opacity: 0.5;
|
|
}
|
|
|
|
#sidebar ul.topics > li > a .fa {
|
|
margin-top: 9px;
|
|
}
|
|
|
|
#sidebar ul.topics > li {
|
|
margin-left: -1rem;
|
|
margin-right: -1rem;
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
|
|
#sidebar ul.topics li > a {
|
|
margin-left: -1rem;
|
|
margin-right: -1rem;
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
|
|
#sidebar ul {
|
|
list-style: none;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
#sidebar ul li {
|
|
padding: 0;
|
|
}
|
|
|
|
#sidebar ul li.visited + span {
|
|
margin-right: 16px;
|
|
}
|
|
|
|
#sidebar ul li a {
|
|
display: block;
|
|
padding: 2px 0;
|
|
}
|
|
|
|
#sidebar ul li a span {
|
|
display: block;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
#sidebar ul li > a {
|
|
padding: 4px 0;
|
|
}
|
|
|
|
#sidebar ul li li {
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
#sidebar ul.topics > li > a .read-icon {
|
|
margin-top: 9px;
|
|
}
|
|
|
|
#sidebar #shortcuts li {
|
|
list-style: none;
|
|
padding: 2px 0;
|
|
}
|
|
|
|
#sidebar ul li .read-icon {
|
|
display: none;
|
|
float: right;
|
|
font-size: 13px;
|
|
margin: 4px 0 0 0;
|
|
min-width: 16px;
|
|
text-align: right;
|
|
}
|
|
|
|
#sidebar ul li.visited > a .read-icon {
|
|
display: inline;
|
|
}
|
|
|
|
#sidebar .nav-title {
|
|
font-size: 2rem;
|
|
font-weight: 200;
|
|
letter-spacing: -1px;
|
|
line-height: 110% !important;
|
|
margin: 1rem 0 1rem 0;
|
|
padding-left: 1rem;
|
|
text-rendering: optimizeLegibility;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
#sidebar .footermargin {
|
|
margin-top: auto;
|
|
}
|
|
|
|
#sidebar hr {
|
|
border-bottom-style: solid;
|
|
border-bottom-width: 1px;
|
|
margin: 1.5rem 1rem 1rem 1rem;
|
|
}
|
|
|
|
#body {
|
|
display: flex;
|
|
flex-basis: 100%;
|
|
flex-direction: column;
|
|
flex-grow: 1;
|
|
flex-shrink: 0;
|
|
height: 100%;
|
|
margin-left: 300px;
|
|
min-height: 100%;
|
|
min-width: calc( 100% - 300px);
|
|
max-width: calc( 100% - 300px);
|
|
overflow-wrap: break-word; /* avoid x-scrolling of body if it is to large to fit */
|
|
position: relative; /* PS */
|
|
width: calc( 100% - 300px);
|
|
z-index: 300;
|
|
}
|
|
|
|
#body img,
|
|
#body .video-container {
|
|
display: block;
|
|
margin: 1.5rem auto;
|
|
text-align: center;
|
|
}
|
|
|
|
#body img.border,
|
|
#body .video-container.border {
|
|
border: 2px solid #e6e6e6;
|
|
padding: 2px;
|
|
}
|
|
|
|
#body img.shadow,
|
|
#body .video-container.shadow {
|
|
box-shadow: 0 10px 30px rgba( 200, 200, 200, .666 );
|
|
}
|
|
|
|
#body img.inline {
|
|
display: inline !important;
|
|
margin: 0 !important;
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
#body-inner {
|
|
display: flex;
|
|
flex: 1; /* fill rest of vertical space */
|
|
flex-direction: column;
|
|
padding: 0 3rem 4rem 3rem;
|
|
position: relative; /* PS */
|
|
}
|
|
@media screen and (max-width: 59.938em) {
|
|
#body-inner {
|
|
padding: 0 2rem 15px 2rem;
|
|
}
|
|
}
|
|
@media screen and (max-width: 47.938em) {
|
|
#body-inner {
|
|
padding: 0 1rem 5px 1rem;
|
|
}
|
|
}
|
|
|
|
#body h1 + hr {
|
|
margin-bottom: 2rem;
|
|
margin-top: -1rem;
|
|
}
|
|
|
|
/* we limit width if we have large screens */
|
|
@media screen and ( min-width: 1300px ){ /* #sidebar/width + ./max-width */
|
|
#body .flex-block-wrapper {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
max-width: 1000px;
|
|
}
|
|
}
|
|
|
|
#body-inner.chapter {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
padding: 2rem 9rem;
|
|
}
|
|
@media screen and (max-width: 59.938em) {
|
|
#body-inner.chapter {
|
|
padding: 15px 4rem 15px 4rem;
|
|
}
|
|
}
|
|
@media screen and (max-width: 47.938em) {
|
|
#body-inner.chapter {
|
|
padding: 5px 2rem 5px 2rem;
|
|
}
|
|
}
|
|
|
|
#body-inner .chapter h3:first-of-type {
|
|
font-weight: 200;
|
|
margin-top: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
#body-inner .chapter h1 {
|
|
border-bottom: 4px solid rgba( 134, 134, 134, .125 );
|
|
font-size: 5rem;
|
|
}
|
|
|
|
#body-inner .chapter p {
|
|
font-size: 1.2rem;
|
|
text-align: justify;
|
|
}
|
|
|
|
h1 {
|
|
font-weight: 200;
|
|
text-align: center;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
h2, h3, h4, h5, h6 {
|
|
letter-spacing: -1px;
|
|
text-rendering: optimizeLegibility;
|
|
}
|
|
|
|
blockquote {
|
|
border-left: 10px solid rgba( 134, 134, 134, .4 );
|
|
}
|
|
|
|
blockquote p {
|
|
font-size: 105%;
|
|
font-style: italic;
|
|
opacity: .75;
|
|
text-align: justify;
|
|
}
|
|
|
|
blockquote cite {
|
|
display: block;
|
|
font-weight: bold;
|
|
opacity: .5;
|
|
padding-top: .5em;
|
|
text-align: right;
|
|
}
|
|
|
|
/* colored boxes */
|
|
|
|
div.box {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NEUTRAL-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
|
|
--VARIABLE-BOX-CAPTION-color: var(--INTERNAL-BOX-CAPTION-color);
|
|
-webkit-print-color-adjust: exact;
|
|
color-adjust: exact;
|
|
margin: 1.5rem 0;
|
|
}
|
|
|
|
div.box > .box-label {
|
|
font-weight: 500;
|
|
padding: .2rem .6rem;
|
|
}
|
|
|
|
div.box > .box-content {
|
|
padding-bottom: .1rem;
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
|
|
div.box > .box-content > :first-child {
|
|
margin-top: 0;
|
|
padding-top: 1rem;
|
|
}
|
|
|
|
div.box > .box-content > :last-child {
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
div.box.info {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-BOX-INFO-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-INFO-TEXT-color);
|
|
}
|
|
|
|
div.box.warning {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-BOX-WARNING-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-WARNING-TEXT-color);
|
|
}
|
|
|
|
div.box.note {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NOTE-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NOTE-TEXT-color);
|
|
}
|
|
|
|
div.box.tip {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-BOX-TIP-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-TIP-TEXT-color);
|
|
}
|
|
|
|
div.box.primary {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-PRIMARY-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
|
|
}
|
|
|
|
div.box.secondary {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-SECONDARY-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
|
|
}
|
|
|
|
div.box.blue {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-BOX-BLUE-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-BLUE-TEXT-color);
|
|
}
|
|
|
|
div.box.green {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREEN-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREEN-TEXT-color);
|
|
}
|
|
|
|
div.box.grey {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREY-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREY-TEXT-color);
|
|
}
|
|
|
|
div.box.orange {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-BOX-ORANGE-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-WARNING-ORANGE-color);
|
|
}
|
|
|
|
div.box.red {
|
|
--VARIABLE-BOX-color: var(--INTERNAL-BOX-RED-color);
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-RED-TEXT-color);
|
|
}
|
|
|
|
div.box.transparent {
|
|
--VARIABLE-BOX-color: transparent;
|
|
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
|
|
--VARIABLE-BOX-CAPTION-color: var(--INTERNAL-MAIN-TITLES-TEXT-color);
|
|
background-color: transparent;
|
|
}
|
|
|
|
div.box.transparent > .box-content {
|
|
background-color: transparent;
|
|
}
|
|
|
|
/* attachments shortcode */
|
|
|
|
div.attachments .box-content {
|
|
display: block;
|
|
margin: 0;
|
|
padding-left: 1.75rem;
|
|
}
|
|
|
|
/* Children shortcode */
|
|
|
|
.children p {
|
|
font-size: small;
|
|
margin-bottom: 0px;
|
|
margin-top: 0px;
|
|
padding-bottom: 0px;
|
|
padding-top: 0px;
|
|
}
|
|
|
|
.children-li p {
|
|
font-size: small;
|
|
font-style: italic;
|
|
}
|
|
|
|
.children-h2 p,
|
|
.children-h3 p {
|
|
font-size: small;
|
|
margin-bottom: 0px;
|
|
margin-top: 0px;
|
|
padding-bottom: 0px;
|
|
padding-top: 0px;
|
|
}
|
|
|
|
#body-inner .children h2,
|
|
#body-inner .children h3,
|
|
#body-inner .children h4,
|
|
#body-inner .children h5,
|
|
#body-inner .children h6 {
|
|
margin-bottom: 0;
|
|
margin-top: 1rem;
|
|
}
|
|
#body-inner ul.children-h2,
|
|
#body-inner ul.children-h3,
|
|
#body-inner ul.children-h4,
|
|
#body-inner ul.children-h5,
|
|
#body-inner ul.children-h6 {
|
|
/* if we display children with style=h2 but without a containerstyle
|
|
a ul will be used for structuring; we remove default indention for uls
|
|
in this case */
|
|
padding-inline-start: 0;
|
|
}
|
|
|
|
code,
|
|
kbd,
|
|
pre,
|
|
samp {
|
|
font-size: 92%;
|
|
vertical-align: baseline;
|
|
}
|
|
|
|
code {
|
|
border-radius: 2px;
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
-webkit-print-color-adjust: economy;
|
|
color-adjust: economy;
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
span.copy-to-clipboard {
|
|
display: inline-block;
|
|
}
|
|
|
|
code.copy-to-clipboard-code {
|
|
border-bottom-right-radius: 0;
|
|
border-top-right-radius: 0;
|
|
border-right-width: 0;
|
|
}
|
|
|
|
pre {
|
|
border-radius: 2px;
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
-webkit-print-color-adjust: economy;
|
|
color-adjust: economy;
|
|
line-height: 1.15;
|
|
padding: 1rem;
|
|
}
|
|
|
|
pre code {
|
|
background-color: inherit;
|
|
color: inherit;
|
|
-webkit-print-color-adjust: economy;
|
|
color-adjust: economy;
|
|
border: 0;
|
|
font-size: 15px;
|
|
margin: 0;
|
|
padding: 0;
|
|
white-space: inherit;
|
|
}
|
|
|
|
hr {
|
|
border-bottom: 4px solid rgba( 134, 134, 134, .125 );
|
|
}
|
|
|
|
#body-inner pre {
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
#body-inner h1,
|
|
#body-inner h2,
|
|
#body-inner h3,
|
|
#body-inner h4,
|
|
#body-inner h5,
|
|
#body-inner h6 {
|
|
/* big titles cause a horizontal scrollbar - fixing this by wrapping text */
|
|
overflow-wrap: break-word;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
table {
|
|
border: 1px solid rgba( 134, 134, 134, .333 );
|
|
margin-bottom: 1rem;
|
|
margin-top: 1rem;
|
|
table-layout: auto;
|
|
}
|
|
|
|
th,
|
|
thead td {
|
|
background-color: rgba( 134, 134, 134, .166 );
|
|
border: 1px solid rgba( 134, 134, 134, .333 );
|
|
-webkit-print-color-adjust: exact;
|
|
color-adjust: exact;
|
|
padding: 0.5rem;
|
|
}
|
|
|
|
td {
|
|
border: 1px solid rgba( 134, 134, 134, .333 );
|
|
padding: 0.5rem;
|
|
}
|
|
|
|
.tooltipped {
|
|
position: relative;
|
|
}
|
|
|
|
.tooltipped:after {
|
|
background: rgba(0, 0, 0, 1);
|
|
border: 1px solid #777;
|
|
border-radius: 3px;
|
|
color: #fff;
|
|
content: attr(aria-label);
|
|
display: none;
|
|
font: normal normal 11px/1.5 "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
|
|
-webkit-font-smoothing: subpixel-antialiased;
|
|
letter-spacing: normal;
|
|
padding: 5px 8px;
|
|
pointer-events: none;
|
|
position: absolute;
|
|
text-align: center;
|
|
text-decoration: none;
|
|
text-shadow: none;
|
|
text-transform: none;
|
|
white-space: pre;
|
|
word-wrap: break-word;
|
|
z-index: 450;
|
|
}
|
|
|
|
.tooltipped:before {
|
|
border: 5px solid transparent;
|
|
color: rgba(0, 0, 0, 1);
|
|
content: "";
|
|
display: none;
|
|
height: 0;
|
|
pointer-events: none;
|
|
position: absolute;
|
|
width: 0;
|
|
z-index: 460;
|
|
}
|
|
|
|
.tooltipped:hover:before,
|
|
.tooltipped:hover:after,
|
|
.tooltipped:active:before,
|
|
.tooltipped:active:after,
|
|
.tooltipped:focus:before,
|
|
.tooltipped:focus:after {
|
|
display: inline-block;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.tooltipped-s:after,
|
|
.tooltipped-se:after,
|
|
.tooltipped-sw:after {
|
|
margin-top: 5px;
|
|
right: 50%;
|
|
top: 100%;
|
|
}
|
|
|
|
.tooltipped-s:before,
|
|
.tooltipped-se:before,
|
|
.tooltipped-sw:before {
|
|
border-bottom-color: rgba(0, 0, 0, 0.8);
|
|
bottom: -5px;
|
|
margin-right: -5px;
|
|
right: 50%;
|
|
top: auto;
|
|
}
|
|
|
|
.tooltipped-se:after {
|
|
left: 50%;
|
|
margin-left: -15px;
|
|
right: auto;
|
|
}
|
|
|
|
.tooltipped-sw:after {
|
|
margin-right: -15px;
|
|
}
|
|
|
|
.tooltipped-n:after,
|
|
.tooltipped-ne:after,
|
|
.tooltipped-nw:after {
|
|
bottom: 100%;
|
|
margin-bottom: 5px;
|
|
right: 50%;
|
|
}
|
|
|
|
.tooltipped-n:before,
|
|
.tooltipped-ne:before,
|
|
.tooltipped-nw:before {
|
|
border-top-color: rgba(0, 0, 0, 0.8);
|
|
bottom: auto;
|
|
margin-right: -5px;
|
|
right: 50%;
|
|
top: -5px;
|
|
}
|
|
|
|
.tooltipped-ne:after {
|
|
left: 50%;
|
|
margin-left: -15px;
|
|
right: auto;
|
|
}
|
|
|
|
.tooltipped-nw:after {
|
|
margin-right: -15px;
|
|
}
|
|
|
|
.tooltipped-s:after,
|
|
.tooltipped-n:after {
|
|
transform: translateX(50%);
|
|
}
|
|
|
|
.tooltipped-w:after {
|
|
bottom: 50%;
|
|
margin-right: 5px;
|
|
right: 100%;
|
|
transform: translateY(50%);
|
|
}
|
|
|
|
.tooltipped-w:before {
|
|
border-left-color: rgba(0, 0, 0, 0.8);
|
|
bottom: 50%;
|
|
left: -5px;
|
|
margin-top: -5px;
|
|
top: 50%;
|
|
}
|
|
|
|
.tooltipped-e:after {
|
|
bottom: 50%;
|
|
left: 100%;
|
|
margin-left: 5px;
|
|
transform: translateY(50%);
|
|
}
|
|
|
|
.tooltipped-e:before {
|
|
border-right-color: rgba(0, 0, 0, 0.8);
|
|
bottom: 50%;
|
|
margin-top: -5px;
|
|
right: -5px;
|
|
top: 50%;
|
|
}
|
|
|
|
#sidebar .highlightable {
|
|
padding: 1rem 0 1rem;
|
|
position: relative;
|
|
}
|
|
|
|
.lightbox-active #body {
|
|
overflow: visible;
|
|
}
|
|
|
|
.featherlight img {
|
|
margin: 0 !important;
|
|
}
|
|
|
|
#topbar {
|
|
min-height: 3rem;
|
|
position: relative;
|
|
z-index: 480;
|
|
}
|
|
|
|
#topbar > div {
|
|
background-color: rgba( 134, 134, 134, .066 );
|
|
height: 100%;
|
|
}
|
|
|
|
.navigation,
|
|
#top-print-link,
|
|
#top-github-link {
|
|
display: block;
|
|
float: right;
|
|
}
|
|
|
|
.nav,
|
|
.print-link,
|
|
.github-link {
|
|
border-left: thin solid rgba( 134, 134, 134, .333 );
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
span.nav i{
|
|
color: rgba( 134, 134, 134, .333 );
|
|
}
|
|
|
|
.navigation,
|
|
#top-print-link,
|
|
#top-github-link {
|
|
position: relative;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
}
|
|
|
|
#toc-menu{
|
|
cursor: pointer;
|
|
}
|
|
#toc-menu,
|
|
#sidebar-toggle-span {
|
|
border-right: thin solid rgba( 134, 134, 134, .333 );
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
|
|
#body #breadcrumbs {
|
|
display: inline-block;
|
|
float: left;
|
|
height: auto;
|
|
line-height: 1.4;
|
|
margin-bottom: 0;
|
|
overflow: hidden;
|
|
position: relative;
|
|
text-overflow: ellipsis;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
white-space: nowrap;
|
|
width: calc(100% - 5*3.25rem);
|
|
}
|
|
@media screen and (max-width: 47.938em) {
|
|
#body #breadcrumbs {
|
|
text-overflow: unset;
|
|
}
|
|
}
|
|
|
|
#sidebar-toggle-span {
|
|
display: none;
|
|
}
|
|
.progress {
|
|
left: 1rem;
|
|
top: 1rem;
|
|
}
|
|
@media screen and (max-width: 47.938em) {
|
|
.mobile-support #sidebar-toggle-span {
|
|
display: inline;
|
|
}
|
|
.progress {
|
|
left: 4.25rem;
|
|
}
|
|
}
|
|
|
|
#body #breadcrumbs .links {
|
|
display: inline;
|
|
padding: 0 .75rem;
|
|
}
|
|
@media screen and (max-width: 47.938em) {
|
|
#body #breadcrumbs .links {
|
|
/* we just hide the breadcrumbs instead of display: none;
|
|
this makes sure that the breadcrumbs are still usable for
|
|
accessability */
|
|
visibility: hidden;
|
|
}
|
|
}
|
|
|
|
#body #breadcrumbs .links * {
|
|
display: inline-block;
|
|
padding: 0;
|
|
}
|
|
|
|
#body #breadcrumbs .links meta {
|
|
display: none;
|
|
}
|
|
|
|
#body #breadcrumbs .links li:last-of-type {
|
|
cursor: text;
|
|
}
|
|
|
|
#body a[aria-disabled="true"] {
|
|
pointer-events: none;
|
|
text-decoration: none;
|
|
}
|
|
|
|
@media screen and (max-width: 59.938em) {
|
|
#sidebar {
|
|
min-width: 230px;
|
|
max-width: 230px;
|
|
width: 230px;
|
|
}
|
|
#body {
|
|
margin-left: 230px;
|
|
min-width: calc( 100% - 230px);
|
|
max-width: calc( 100% - 230px);
|
|
width: calc( 100% - 230px);
|
|
}
|
|
}
|
|
@media screen and (max-width: 47.938em) {
|
|
/* we don't support sidebar flyout in mobile */
|
|
.mobile-support #sidebar {
|
|
left: -230px;
|
|
}
|
|
.mobile-support #navshow{
|
|
display: inline;
|
|
}
|
|
.mobile-support #body {
|
|
margin-left: 0;
|
|
min-width: 100%;
|
|
max-width: 100%;
|
|
width: 100%;
|
|
}
|
|
.mobile-support.sidebar-flyout {
|
|
overflow: hidden;
|
|
}
|
|
.mobile-support.sidebar-flyout #sidebar {
|
|
left: 0;
|
|
z-index: 400;
|
|
}
|
|
.mobile-support.sidebar-flyout #body {
|
|
margin-left: 230px;
|
|
overflow: hidden;
|
|
}
|
|
.mobile-support.sidebar-flyout #sidebar-overlay{
|
|
background-color: rgba(134, 134, 134, 0.5);
|
|
bottom: 0;
|
|
cursor: pointer;
|
|
left: 0;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
z-index: 500;
|
|
}
|
|
}
|
|
|
|
.copy-to-clipboard-button {
|
|
border-radius: 0 2px 2px 0;
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
cursor: pointer;
|
|
font-size: 92%;
|
|
padding-left: 22px;
|
|
}
|
|
|
|
.copy-to-clipboard-button > i {
|
|
font-size: 92%;
|
|
font-weight: 500;
|
|
margin-left: -22px;
|
|
}
|
|
|
|
.copy-to-clipboard-code + .copy-to-clipboard-button > i {
|
|
padding-left: 5px;
|
|
padding-right: 5px;
|
|
}
|
|
|
|
pre .copy-to-clipboard-button {
|
|
background-color: rgba( 160, 160, 160, .2 );
|
|
border-radius: 2px;
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
padding: 5px 3px 5px 25px;
|
|
position: absolute;
|
|
right: 4px;
|
|
top: 4px;
|
|
}
|
|
|
|
#homelinks {
|
|
border-bottom-style: solid;
|
|
border-bottom-width: 4px;
|
|
padding: 7px 0;
|
|
}
|
|
|
|
option {
|
|
color: initial;
|
|
}
|
|
|
|
.expand{
|
|
margin-bottom: 1rem;
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.expand-label {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.expand-label > .fas {
|
|
font-size: .8rem;
|
|
width: .6rem;
|
|
}
|
|
|
|
/* expander collapsed, default */
|
|
.expand > .expand-label > .fa-chevron-down {
|
|
display: none;
|
|
}
|
|
.expand > .expand-label > .fa-chevron-right {
|
|
display: inline-block;
|
|
}
|
|
|
|
/* expander expanded, controlled by expand.html */
|
|
.expand.expand-expanded > .expand-label > .fa-chevron-down {
|
|
display: inline-block;
|
|
}
|
|
.expand.expand-expanded > .expand-label > .fa-chevron-right {
|
|
display: none;
|
|
}
|
|
|
|
/* expander expand collapsed marked, must override logic of expand.html, controlled by theme.js */
|
|
.expand:not(.expand-expanded).expand-marked > .expand-label > .fa-chevron-down {
|
|
display: inline-block;
|
|
}
|
|
.expand:not(.expand-expanded).expand-marked > .expand-label > .fa-chevron-right {
|
|
display: none;
|
|
}
|
|
.expand:not(.expand-expanded).expand-marked > .expand-content {
|
|
/* this will disable jquery's animation */
|
|
display: block !important;
|
|
}
|
|
|
|
#body footer.footline{
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
.footline i{
|
|
margin-left: .5rem;
|
|
}
|
|
.footline i:first-child{
|
|
margin-left: 0;
|
|
}
|
|
|
|
.mermaid {
|
|
margin-bottom: 1.7rem;
|
|
margin-top: 1.7rem;
|
|
}
|
|
|
|
.mermaid > svg {
|
|
border: 1px solid transparent;
|
|
cursor: pointer;
|
|
/* remove inline height from generated diagram */
|
|
height: initial !important;
|
|
}
|
|
|
|
.mermaid > svg:hover {
|
|
border-color: rgba( 134, 134, 134, .333 );
|
|
}
|
|
|
|
.mermaid-code {
|
|
display: none;
|
|
}
|
|
|
|
.include.hide-first-heading h1:first-of-type,
|
|
.include.hide-first-heading h2:first-of-type,
|
|
.include.hide-first-heading h3:first-of-type,
|
|
.include.hide-first-heading h4:first-of-type,
|
|
.include.hide-first-heading h5:first-of-type,
|
|
.include.hide-first-heading h6:first-of-type {
|
|
display: none;
|
|
}
|
|
|
|
.include.hide-first-heading h1 + h2:first-of-type,
|
|
.include.hide-first-heading h1 + h3:first-of-type,
|
|
.include.hide-first-heading h2 + h3:first-of-type,
|
|
.include.hide-first-heading h1 + h4:first-of-type,
|
|
.include.hide-first-heading h2 + h4:first-of-type,
|
|
.include.hide-first-heading h3 + h4:first-of-type,
|
|
.include.hide-first-heading h1 + h5:first-of-type,
|
|
.include.hide-first-heading h2 + h5:first-of-type,
|
|
.include.hide-first-heading h3 + h5:first-of-type,
|
|
.include.hide-first-heading h4 + h5:first-of-type,
|
|
.include.hide-first-heading h1 + h6:first-of-type,
|
|
.include.hide-first-heading h2 + h6:first-of-type,
|
|
.include.hide-first-heading h3 + h6:first-of-type,
|
|
.include.hide-first-heading h4 + h6:first-of-type,
|
|
.include.hide-first-heading h5 + h6:first-of-type {
|
|
display: block;
|
|
}
|
|
|
|
#body a.highlight,
|
|
#body a.highlight:hover,
|
|
#body a.highlight:focus {
|
|
outline-style: none;
|
|
text-decoration: none;
|
|
}
|
|
|
|
#body a.highlight {
|
|
display: inline-block;
|
|
line-height: 1.1;
|
|
}
|
|
|
|
#body a.highlight:after {
|
|
content: "";
|
|
display: block;
|
|
height: 1px;
|
|
width: 0%;
|
|
transition: width 0.5s ease;
|
|
}
|
|
|
|
#body a.highlight:hover:after,
|
|
#body a.highlight:focus:after {
|
|
width: 100%;
|
|
}
|
|
|
|
#body .navigation a.highlight:after,
|
|
#body #sidebar-toggle-span a.highlight:after,
|
|
#body #top-print-link a.highlight:after,
|
|
#body #top-github-link a.highlight:after {
|
|
background-color: transparent;
|
|
}
|
|
|
|
/* Table of contents */
|
|
|
|
.toc-flyout #toc-overlay{
|
|
bottom: 0;
|
|
cursor: pointer;
|
|
left: 0;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
z-index: 470;
|
|
}
|
|
|
|
.progress {
|
|
border: 0px solid rgba( 134, 134, 134, .166 );
|
|
box-shadow: 1px 2px 5px 1px rgba( 134, 134, 134, .2 );
|
|
height: 0;
|
|
opacity: 0;
|
|
overflow: hidden;
|
|
position: absolute;
|
|
width: 0;
|
|
z-index: 490;
|
|
}
|
|
|
|
.toc-flyout .progress {
|
|
border-width: 1px;
|
|
height: auto;
|
|
opacity: 1;
|
|
width: auto;
|
|
}
|
|
|
|
.progress .wrapper {
|
|
background-color: rgba( 134, 134, 134, .066 );
|
|
}
|
|
|
|
.progress ul {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0 15px;
|
|
}
|
|
|
|
#TableOfContents {
|
|
font-size: 13px !important;
|
|
max-height: 85%;
|
|
overflow: auto;
|
|
padding: 15px 5px !important;
|
|
}
|
|
|
|
#TableOfContents > ul > li > a {
|
|
font-weight: 500;
|
|
}
|
|
|
|
.btn {
|
|
background-image: none !important;
|
|
border-radius: 4px !important;
|
|
border-style: solid !important;
|
|
border-width: 1px !important;
|
|
cursor: pointer !important;
|
|
display: inline-block !important;
|
|
font-size: 14px !important;
|
|
font-weight: 500;
|
|
line-height: 1.42857143 !important;
|
|
padding: 6px 12px !important;
|
|
margin-bottom: 0 !important;
|
|
text-align: center !important;
|
|
touch-action: manipulation !important;
|
|
transition: all 0.15s !important;
|
|
-ms-user-select: none !important;
|
|
-webkit-user-select: none !important;
|
|
user-select: none !important;
|
|
white-space: nowrap !important;
|
|
}
|
|
|
|
.btn:focus {
|
|
outline: none !important;
|
|
}
|
|
|
|
.btn:hover,
|
|
.btn:focus {
|
|
text-decoration: none !important;
|
|
}
|
|
|
|
.btn-default {
|
|
background-color: transparent;
|
|
border-color: rgba( 134, 134, 134, .333 ) !important;
|
|
}
|
|
|
|
.btn-default:hover,
|
|
.btn-default:focus,
|
|
.btn-default:active {
|
|
background-color: rgba( 134, 134, 134, .75 ) !important;
|
|
border-color: rgba( 134, 134, 134, .75 ) !important;
|
|
}
|
|
|
|
.btn-default:active {
|
|
background-image: none !important;
|
|
}
|
|
|
|
/* anchors */
|
|
.anchor {
|
|
cursor: pointer;
|
|
font-size: .5em;
|
|
margin-left: .66em;
|
|
margin-top: .9em;
|
|
position: absolute;
|
|
visibility: hidden;
|
|
}
|
|
|
|
h2:hover .anchor,
|
|
h3:hover .anchor,
|
|
h4:hover .anchor,
|
|
h5:hover .anchor,
|
|
h6:hover .anchor {
|
|
visibility:visible;
|
|
}
|
|
|
|
/* Redfines headers style */
|
|
|
|
h1 a,
|
|
h2 a,
|
|
h3 a,
|
|
h4 a,
|
|
h5 a,
|
|
h6 a {
|
|
font-weight: inherit;
|
|
}
|
|
|
|
#body h2 {
|
|
font-size: 2.2rem;
|
|
font-weight: 500;
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
#body h3 {
|
|
font-size: 1.8rem;
|
|
font-weight: 500;
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
#body h4 {
|
|
font-size: 1.85rem;
|
|
font-weight: 300;
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
#body h5 {
|
|
font-size: 1.6rem;
|
|
font-weight: 300;
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
#body h6 {
|
|
font-size: 1.3rem;
|
|
font-weight: 300;
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
#body h1 + h2,
|
|
#body h1 + h3,
|
|
#body h1 + h4,
|
|
#body h1 + h5,
|
|
#body h1 + h6,
|
|
#body h2 + h3,
|
|
#body h2 + h4,
|
|
#body h2 + h5,
|
|
#body h2 + h6,
|
|
#body h3 + h4,
|
|
#body h3 + h5,
|
|
#body h3 + h6,
|
|
#body h4 + h5,
|
|
#body h4 + h6,
|
|
#body h5 + h6 {
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
rapi-doc {
|
|
/* adjust rapi-doc internals to fill out available space */
|
|
margin-left: calc( -8px - 24px );
|
|
width: calc( 100% + 8px + 24px + 8px );
|
|
}
|
|
|
|
.select-container i {
|
|
padding-top: .25em;
|
|
}
|
|
|
|
.select-container i,
|
|
.select-container span {
|
|
display: block;
|
|
float: left;
|
|
}
|
|
|
|
.select-style {
|
|
border: 0;
|
|
border-radius: 0px;
|
|
height: 1.574em;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.select-style select {
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
border: none;
|
|
box-shadow: none;
|
|
background-color: transparent;
|
|
background-image: none;
|
|
width: 100%;
|
|
}
|
|
|
|
.select-style select:focus {
|
|
outline: none;
|
|
}
|
|
|
|
.select-style select::-ms-expand {
|
|
display: none;
|
|
}
|
|
|
|
.select-style :hover {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.select-style option {
|
|
color: #000000;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.select-clear {
|
|
clear: both;
|
|
}
|
|
|
|
.footerLangSwitch,
|
|
.footerVariantSwitch,
|
|
.footerVisitedLinks,
|
|
.footerFooter {
|
|
display: none;
|
|
}
|
|
|
|
.showLangSwitch,
|
|
.showVariantSwitch,
|
|
.showVisitedLinks,
|
|
.showFooter {
|
|
display: initial;
|
|
}
|
|
|
|
@media screen and (max-width: 47.938em) {
|
|
#breadcrumbs .links {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
/* clears the 'X' from Chrome's search input */
|
|
input[type="search"]::-webkit-search-decoration,
|
|
input[type="search"]::-webkit-search-cancel-button,
|
|
input[type="search"]::-webkit-search-results-button,
|
|
input[type="search"]::-webkit-search-results-decoration { display: none; }
|
|
|
|
#sidebar ul.collapsible-menu input.toggle {
|
|
cursor: pointer;
|
|
display: block;
|
|
left: -1rem;
|
|
opacity: 0;
|
|
overflow: hidden;
|
|
position: absolute;
|
|
top: 0;
|
|
}
|
|
|
|
#sidebar ul.collapsible-menu label {
|
|
cursor: pointer;
|
|
display: inline;
|
|
height: 1rem;
|
|
left: 0;
|
|
margin-top: .25em;
|
|
position: absolute;
|
|
width: 1rem;
|
|
}
|
|
|
|
#sidebar .collapsible-menu input.toggle + label:after {
|
|
content: "▸";
|
|
}
|
|
|
|
#sidebar .collapsible-menu input.toggle:checked + label:after {
|
|
content: "▾";
|
|
}
|
|
|
|
#sidebar .collapsible-menu input.toggle + label + a + ul {
|
|
display: none;
|
|
}
|
|
|
|
#sidebar .collapsible-menu input.toggle:checked + label + a + ul {
|
|
display: inline;
|
|
}
|