Tweaks global styles

This commit is contained in:
Alicia Sykes 2021-08-25 23:14:21 +01:00
parent 7d430ef79a
commit a00a77d9e6
3 changed files with 77 additions and 25 deletions

View File

@ -2,7 +2,7 @@
:root {
/* Greyscale */
--bright-white: #ffffff;
--white: #e5e5e5;
--white: #f7f7f7;
--pale-grey: #e9e9e8;
--mid-grey: #a9a9a9;
--dark-grey: ##18191a;
@ -31,29 +31,13 @@ html { /* Light Theme */
}
html[data-theme='dark'] { /* Dark Theme */
--primary: #202020;
--primary: #db78fc;
--background: var(--dark-grey);
--text-color: var(--white);
--hero-background: var(--black);
--kinda-transparent: #000000d9;
--hyperlink: #ff62ce;
--hyperlink: var(--primary);
--feature-img-shadow: 4px 4px 6px #00000080, -2px -2px 4px rgb(0 0 0 / 40%);
--footer-color: var(--black);
}
.footer {
box-shadow: var(--feature-img-shadow);
--ifm-footer-background-color: var(--footer-color);
--ifm-footer-color: var(--footer-text-color);
--ifm-footer-link-color: var(--footer-text-color);
--ifm-footer-title-color: var(--footer-text-color);
--ifm-footer-link-hover-color: var(--primary);
--ifm-link-color: var(--footer-text-color);
--ifm-link-hover-color: var(--primary);
.footer__copyright, .footer__copyright a {
font-size: 0.9rem;
font-weight: bold;
opacity: 0.9;
font-family: 'Roboto Mono', monospace;
}
--footer-text-color: var(--white);
}

View File

@ -24,6 +24,16 @@ header.heroBanner {
h3.heroSubTitle {
text-shadow: var(--sub-heading-shadow);
}
img.starButton {
position: absolute;
width: 12rem;
top: 1rem;
right: 1rem;
opacity: 0.85;
&:hover {
opacity: 1;
}
}
}
.buttons {
display: flex;
@ -35,7 +45,7 @@ header.heroBanner {
}
}
.dashyDescription {
max-width: 800px;
max-width: 680px;
margin: 1rem auto;
text-align: left;
font-size: 1.2rem;

View File

@ -24,6 +24,26 @@
--ifm-hero-text-color: var(--text-color);
}
.footer {
box-shadow: var(--feature-img-shadow);
--ifm-footer-background-color: var(--footer-color);
--ifm-footer-color: var(--footer-text-color);
--ifm-footer-link-color: var(--footer-text-color);
--ifm-footer-title-color: var(--footer-text-color);
--ifm-footer-link-hover-color: var(--primary);
--ifm-link-color: var(--footer-text-color);
--ifm-link-hover-color: var(--primary);
.footer__link-item {
font-size: 1rem;
}
.footer__copyright, .footer__copyright a {
font-size: 0.9rem;
font-weight: bold;
opacity: 0.9;
font-family: 'Roboto Mono', monospace;
}
}
.docusaurus-highlight-code-line {
background-color: rgba(0, 0, 0, 0.1);
@ -56,12 +76,22 @@ h1, h2, h3, h4, h5 {
cursor: default;
}
/* Markdown Docs content */
article div.markdown {
--ifm-h1-font-size: 3.0rem;
--ifm-h2-font-size: 2.5rem;
--ifm-h3-font-size: 1.4rem;
p, a, ol, ul, li, code span {
font-size: 1rem;
}
h2 {
font-size: 2.5rem;
h1 { font-size: var(--ifm-h1-font-size); }
h2 { font-size: var(--ifm-h2-font-size); }
h3 { font-size: var(--ifm-h3-font-size); }
p img {
border-radius: 4px;
}
table > tr > td > a > img {
border-radius: 6px;
}
}
@ -69,10 +99,10 @@ article div.markdown {
ul.table-of-contents li {
a {
font-size: 1rem;
&:hover {
&:hover, &:hover code {
color: var(--hyperlink);
}
&.table-of-contents__link--active {
&.table-of-contents__link--active, &.table-of-contents__link--active code {
color: var(--hyperlink);
font-weight: bold;
}
@ -91,3 +121,31 @@ ul.menu__list {
}
}
}
/* Code Blocks */
code span {
font-family: 'Roboto Mono', monospace;
font-size: 0.9rem !important;
}
html[data-theme='light'] {
main div.container.padding-top--md.padding-bottom--lg{
padding: 0 1rem !important;
div > div.col.docItemCol_node_modules-\@docusaurus-theme-classic-lib-next-theme-DocItem-styles-module {
padding: 1rem;
background: var(--bright-white);
border-right: 1px solid var(--ifm-toc-border-color);
ul li a {
font-weight: bold;
}
}
.table-of-contents__left-border {
border-left: none;
}
.pagination-nav__label {
color: var(--black);
}
}
}