From 689b10ef5d5113a5281608ac0aee6eeda9f578db Mon Sep 17 00:00:00 2001 From: vichydra Date: Fri, 22 Nov 2024 17:16:40 -0300 Subject: [PATCH 1/4] feat: styled table --- static/style/inverted-style.css | 10 ++++++++++ static/style/style.css | 10 ++++++++++ 2 files changed, 20 insertions(+) diff --git a/static/style/inverted-style.css b/static/style/inverted-style.css index 8dc50045..d62a94af 100644 --- a/static/style/inverted-style.css +++ b/static/style/inverted-style.css @@ -528,6 +528,16 @@ .preview img { max-width: 100%; } + .preview table { + border-collapse: collapse; + } + .preview th { + font-weight: bold; + } + .preview th, + .preview td { + padding: 6px 13px; + } .preview pre { position: relative; display: inline-block; diff --git a/static/style/style.css b/static/style/style.css index acfb6018..70f05645 100644 --- a/static/style/style.css +++ b/static/style/style.css @@ -528,6 +528,16 @@ .preview img { max-width: 100%; } + .preview table { + border-collapse: collapse; + } + .preview th { + font-weight: bold; + } + .preview th, + .preview td { + padding: 6px 13px; + } .preview pre { position: relative; display: inline-block; From f861e92eca9e59b2a635c6e2d857cba3802d573a Mon Sep 17 00:00:00 2001 From: vichydra Date: Fri, 22 Nov 2024 17:17:19 -0300 Subject: [PATCH 2/4] feat: border and background table colors --- static/style/special.css | 19 ++++++++++++++----- 1 file changed, 14 insertions(+), 5 deletions(-) diff --git a/static/style/special.css b/static/style/special.css index 64f202e5..a49955b8 100644 --- a/static/style/special.css +++ b/static/style/special.css @@ -20,7 +20,6 @@ .preview > .preview-content { box-shadow: inset 0 0 24px #0080ff08; } - .toolbar.ready { background-color: var(--dark-background-half); } @@ -38,14 +37,19 @@ .preview-body::-webkit-scrollbar-track { background: var(--dark-background); /* Background */ } - .preview-body::-webkit-scrollbar-thumb { background-color: var(--light-background-half); /* Scrollbar thumb */ } - .preview-body::-webkit-scrollbar-thumb:hover { background-color: var(--light-background); } + .preview th, + .preview td{ + border: 1px solid #3d444d; + } + .preview tr:nth-child(even) { + background-color: #151b23; + } } @media (prefers-color-scheme: light) { @@ -84,14 +88,19 @@ .preview-body::-webkit-scrollbar-track { background: var(--light-background); /* Background */ } - .preview-body::-webkit-scrollbar-thumb { background-color: var(--dark-background-half); /* Scrollbar thumb */ } - .preview-body::-webkit-scrollbar-thumb:hover { background-color: var(--dark-background); } + .preview th, + .preview td{ + border: 1px solid #d1d9e0; + } + .preview tr:nth-child(even) { + background-color: #efefef; + } } @keyframes highlight-dark-mode { From eae07fd31eb13f39dce645eeb780ac0c847a4b60 Mon Sep 17 00:00:00 2001 From: vichydra Date: Fri, 22 Nov 2024 21:23:48 -0300 Subject: [PATCH 3/4] feat: margin below table --- static/style/inverted-style.css | 1 + static/style/style.css | 1 + 2 files changed, 2 insertions(+) diff --git a/static/style/inverted-style.css b/static/style/inverted-style.css index d62a94af..92f14418 100644 --- a/static/style/inverted-style.css +++ b/static/style/inverted-style.css @@ -530,6 +530,7 @@ } .preview table { border-collapse: collapse; + margin-bottom: 12px; } .preview th { font-weight: bold; diff --git a/static/style/style.css b/static/style/style.css index 70f05645..cfe93e36 100644 --- a/static/style/style.css +++ b/static/style/style.css @@ -530,6 +530,7 @@ } .preview table { border-collapse: collapse; + margin-bottom: 12px; } .preview th { font-weight: bold; From f099bbdb6f94c18b59254912ebeee3a63de0b922 Mon Sep 17 00:00:00 2001 From: vichydra Date: Fri, 22 Nov 2024 21:43:37 -0300 Subject: [PATCH 4/4] refactor: using alternative border/background color as variable --- static/style/special.css | 23 +++++++++++++---------- 1 file changed, 13 insertions(+), 10 deletions(-) diff --git a/static/style/special.css b/static/style/special.css index a49955b8..6cd467cd 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,8 +17,7 @@ #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 { @@ -35,20 +38,20 @@ 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 #3d444d; + border: 1px solid var(--alt-dark-background); } .preview tr:nth-child(even) { - background-color: #151b23; + background-color: var(--alt-dark-background-half); } } @@ -86,20 +89,20 @@ 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 #d1d9e0; + border: 1px solid var(--alt-light-background); } .preview tr:nth-child(even) { - background-color: #efefef; + background-color: var(--alt-light-background-half); } }