diff options
| -rw-r--r-- | README.md | 3 | ||||
| -rw-r--r-- | assets/css/main.css | 38 | ||||
| -rw-r--r-- | assets/css/vars.css | 5 |
3 files changed, 43 insertions, 3 deletions
@@ -51,5 +51,4 @@ If you use the theme or found it useful you can support me by leaving a star ⭐ ## 5 Future Works - [ ] Bring SEO and [performance metrics](https://pagespeed.web.dev/) to 100% both on mobile and desktop; -- [ ] Add color palettes; -- [ ] Add tables styling.
\ No newline at end of file +- [ ] Add color palettes.
\ No newline at end of file diff --git a/assets/css/main.css b/assets/css/main.css index 9c0ca9d..405dc65 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -4,7 +4,6 @@ html { body { font-family: "Literata"; - color: var(--content-primary); margin: auto; max-width: var(--main-width); padding-left: var(--main-padding); @@ -421,4 +420,41 @@ figcaption { font-size: small; margin-bottom: 2rem; margin-top: -3rem; +} + +/* Code in paragraphs */ + +p code { + background-color: var(--code-background); + border-radius: 3px; + padding: 2px; +} + +/* Tables */ + +table { + border-collapse: collapse; + margin-top: var(--table-margin-top); + margin-bottom: var(--table-margin-bottom); + font-size: var(--p-font-size); + line-height: var(--p-line-height); + color: var(--content-primary); +} + +th, +td { + padding: var(--table-cell-padding); + border: 1px solid var(--code-border); + text-align: left; +} + +th { + background-color: var(--code-background); + font-weight: bold; +} + +table code { + background-color: var(--code-background); + border-radius: 3px; + padding: 2px; }
\ No newline at end of file diff --git a/assets/css/vars.css b/assets/css/vars.css index 5e4625a..e950a41 100644 --- a/assets/css/vars.css +++ b/assets/css/vars.css @@ -51,6 +51,11 @@ /* Content */ --content-height: calc(100vh - var(--footer-height)); + /* Tables */ + --table-cell-padding: .5rem; + --table-margin-top: 1.5rem; + --table-margin-bottom: 1.5rem; + /* Theme */ --content-primary: rgb(36, 36, 36); --content-secondary: rgb(117, 117, 117); |