front-end-interview-handbook/website/src/css/custom.css

192 lines
3.5 KiB
CSS
Executable File

@font-face {
font-family: 'Inter var';
font-weight: 100 900;
font-display: swap;
font-style: normal;
font-named-instance: 'Regular';
src: url('./fonts/Inter-roman-latin.var.woff2') format('woff2');
}
@font-face {
font-family: 'Inter var';
font-weight: 100 900;
font-display: swap;
font-style: italic;
font-named-instance: 'Italic';
src: url('./fonts/Inter-italic-latin.var.woff2') format('woff2');
}
:root {
--ifm-font-size-base: 15px;
--ifm-color-primary: #d62b79;
--ifm-color-primary-dark: #c2256d;
--ifm-color-primary-darker: #b72367;
--ifm-color-primary-darkest: #971d55;
--ifm-color-primary-light: #da4187;
--ifm-color-primary-lighter: #dc4b8d;
--ifm-color-primary-lightest: #e26ca2;
--ifm-font-family-base: 'Inter var', -apple-system, BlinkMacSystemFont,
'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
'Droid Sans', 'Helvetica Neue', sans-serif;
--ifm-footer-padding-vertical: 5rem;
}
html[data-theme='dark'] {
--ifm-color-primary: #ffa700;
--ifm-color-primary-dark: #e69600;
--ifm-color-primary-darker: #d98e00;
--ifm-color-primary-darkest: #b37500;
--ifm-color-primary-light: #ffb01a;
--ifm-color-primary-lighter: #ffb426;
--ifm-color-primary-lightest: #ffc14d;
}
strong {
font-weight: 600;
}
html[data-theme='dark'] strong {
color: #fff;
}
.footer, .footer-dark {
--ifm-footer-background-color: #18181b;
}
.navbar {
font-size: 0.875rem;
}
.navbar__items .navbar-icon {
margin-right: 4px;
}
.footer__links {
margin-bottom: 3rem;
}
.footer__copyright {
text-align: start;
}
header h1 {
font-size: 1.875rem;
line-height: 1.2em;
}
html[data-theme="dark"] .markdown h1,
html[data-theme="dark"] .markdown h2,
html[data-theme="dark"] .markdown h3,
html[data-theme="dark"] .markdown h4,
html[data-theme="dark"] .markdown h5,
html[data-theme="dark"] .markdown h6 {
color: #fff;
}
.markdown h1 {
font-size: 2rem;
line-height: 1.2em;
}
.markdown h2 {
--ifm-h2-font-size: 1.375em;
margin-top: 2em;
margin-bottom: 0.5em;
}
@media screen and (min-width: 768px) {
.markdown h2 {
--ifm-h2-font-size: 1.5em;
}
}
.markdown h3 {
--ifm-h3-font-size: 1.25em;
margin-top: 1.8em;
margin-bottom: 0.5em;
}
.markdown h4 {
font-size: 1.15em;
font-weight: 600;
margin-top: 1.6em;
margin-bottom: 0.4em;
}
.markdown h5 {
font-size: 1em;
font-weight: 600;
margin-top: 1.4em;
margin-bottom: 0.3em;
}
.markdown blockquote {
border-left-color: var(--ifm-color-emphasis-200);
border-left-width: 0.5rem;
color: var(--ifm-color-emphasis-600);
}
.markdown ul blockquote {
font-size: 0.9em;
margin-top: 0.5em;
}
@media screen and (max-width: 767px) {
:root {
--ifm-font-size-base: 16px;
}
}
div[class^='announcementBar_'] {
background-color: var(--ifm-color-primary);
color: var(--ifm-color-emphasis-100);
font-weight: bold;
}
.menu {
font-size: 0.875rem;
}
.navbar__item.dropdown.dropdown--hoverable {
flex-shrink: 0;
}
.navbar-icon {
border-radius: 50%;
display: flex;
height: 32px;
width: 32px;
align-items: center;
justify-content: center;
margin-right: 12px;
padding: 0;
transition: background var(--ifm-transition-fast);
}
.navbar-icon:hover {
background: var(--ifm-color-emphasis-200);
color: inherit;
}
.theme-doc-markdown a[target='_blank']:after {
content: '↗';
width: 5px;
position: relative;
margin-left: 3px;
bottom: 1px;
height: 5px;
}
video.gfe-webm {
width: 80%;
height: auto;
}
.video-container {
margin: 20px;
display: flex;
justify-content: center;
align-items: center;
}