diff --git a/sass/main.scss b/sass/main.scss index a05da44..1a2ca17 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -41,7 +41,7 @@ --code-font: 'Cascadia Code'; - --bg-0: #fff; + --bg-0: #f0f0f0; --bg-1: #e7e7e7; --bg-2: #fefefe; --hover-color: white; @@ -58,16 +58,16 @@ --input-color: #e0a615; --meta-color: rgb(53, 53, 53); --accent-color: #aacb73; + --table-header-color: #91bf47; } [data-theme='dark'] { - --bg-0: #818181; + --bg-0: #2f2f2f; --bg-1: rgba(133, 133, 133, 0.5); --bg-2: rgba(23, 23, 23, 100%); --primary-color: #ef5350; --hover-color: white; --background-color: #1f1f1f; --secondary-color: #696969; - --highlights: #b35a5a; --links: #d35d6e; --text-color: #e1e1e1; --code: #ef476f; @@ -77,6 +77,7 @@ --input-color: #294797; --meta-color: rgb(198, 197, 197); --accent-color: #ff9a8c; + --table-header-color: #554994; .invertable-image { filter: invert(.88); diff --git a/sass/parts/_misc.scss b/sass/parts/_misc.scss index 737e7b5..0bffe3c 100644 --- a/sass/parts/_misc.scss +++ b/sass/parts/_misc.scss @@ -60,3 +60,34 @@ a:hover { padding: 0; } } + +table { + justify-self: center; + font: inherit; + overflow: hidden; + border-style : hidden!important; + margin: 2rem 0; + font-family: sans-serif; + min-width: 400px; + border-radius: 0.8rem; + border: none; + margin-left: auto; + margin-right: auto; + min-width: 13rem; +} + +table thead tr { + background-color: var(--table-header-color); + color: white; + text-align: left; +} + +table th, +table td { + padding: 0.5em 0.7em; + font-family: 'Source Serif Pro', serif; +} + +table tbody tr:nth-child(even) { + background-color: var(--bg-0); +}