diff --git a/static/style/inverted-style.css b/static/style/inverted-style.css index 8dc5004..92f1441 100644 --- a/static/style/inverted-style.css +++ b/static/style/inverted-style.css @@ -528,6 +528,17 @@ .preview img { max-width: 100%; } + .preview table { + border-collapse: collapse; + margin-bottom: 12px; + } + .preview th { + font-weight: bold; + } + .preview th, + .preview td { + padding: 6px 13px; + } .preview pre { position: relative; display: inline-block; diff --git a/static/style/special.css b/static/style/special.css index 64f202e..6cd467c 100644 --- a/static/style/special.css +++ b/static/style/special.css @@ -1,8 +1,12 @@ :root { --dark-background: #000210; --dark-background-half: #00021080; + --alt-dark-background: #808080; + --alt-dark-background-half: #80808020; --light-background: #f8f8f8; --light-background-half: #f8f8f880; + --alt-light-background: #7f7f7f; + --alt-light-background-half: #7f7f7f20; } @media (prefers-color-scheme: dark) { @@ -13,14 +17,12 @@ #issues-container > div, .preview { background-color: var(--dark-background); - border-color: var(--border-color); - border-color: #80808020; + border-color: var(--alt-dark-background-half); } #issues-container > div, .preview > .preview-content { box-shadow: inset 0 0 24px #0080ff08; } - .toolbar.ready { background-color: var(--dark-background-half); } @@ -36,16 +38,21 @@ filter: blur(0px) drop-shadow(0 0 8px #fff); } .preview-body::-webkit-scrollbar-track { - background: var(--dark-background); /* Background */ + background: var(--dark-background); } - .preview-body::-webkit-scrollbar-thumb { - background-color: var(--light-background-half); /* Scrollbar thumb */ + background-color: var(--light-background-half); } - .preview-body::-webkit-scrollbar-thumb:hover { background-color: var(--light-background); } + .preview th, + .preview td{ + border: 1px solid var(--alt-dark-background); + } + .preview tr:nth-child(even) { + background-color: var(--alt-dark-background-half); + } } @media (prefers-color-scheme: light) { @@ -82,16 +89,21 @@ background-image: none; } .preview-body::-webkit-scrollbar-track { - background: var(--light-background); /* Background */ + background: var(--light-background); } - .preview-body::-webkit-scrollbar-thumb { - background-color: var(--dark-background-half); /* Scrollbar thumb */ + background-color: var(--dark-background-half); } - .preview-body::-webkit-scrollbar-thumb:hover { background-color: var(--dark-background); } + .preview th, + .preview td{ + border: 1px solid var(--alt-light-background); + } + .preview tr:nth-child(even) { + background-color: var(--alt-light-background-half); + } } @keyframes highlight-dark-mode { diff --git a/static/style/style.css b/static/style/style.css index acfb601..cfe93e3 100644 --- a/static/style/style.css +++ b/static/style/style.css @@ -528,6 +528,17 @@ .preview img { max-width: 100%; } + .preview table { + border-collapse: collapse; + margin-bottom: 12px; + } + .preview th { + font-weight: bold; + } + .preview th, + .preview td { + padding: 6px 13px; + } .preview pre { position: relative; display: inline-block;