revert palette, add WIP skin
This commit is contained in:
Martin Rotter
parent
795043c176
commit
9f70325177
19 changed files with 1365 additions and 87 deletions
4
resources/skins/solarized-dark/html_adblocked.html
Normal file
4
resources/skins/solarized-dark/html_adblocked.html
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
<div>
|
||||
<h4><span>Error: </span>%1</h4>
|
||||
<div role="alert">%2</div>
|
||||
</div>
|
||||
1
resources/skins/solarized-dark/html_enclosure_every.html
Normal file
1
resources/skins/solarized-dark/html_enclosure_every.html
Normal file
|
|
@ -0,0 +1 @@
|
|||
 / <a class="menc" href="%1"><span style="text-transform: uppercase;">%2</span></a>
|
||||
5
resources/skins/solarized-dark/html_enclosure_image.html
Normal file
5
resources/skins/solarized-dark/html_enclosure_image.html
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
<a href="%1">
|
||||
<img alt="%2"
|
||||
src="%1"
|
||||
style="max-height: %3px;">
|
||||
</a>
|
||||
16
resources/skins/solarized-dark/html_single_message.html
Normal file
16
resources/skins/solarized-dark/html_single_message.html
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
<div class="rssguard-mwrapper" dir="%9" id="%8">
|
||||
|
||||
<section class="rssguard-mhead">
|
||||
<div style="float: right; margin: 10px;"><!-- Should it remain here??? -->%7</div>
|
||||
<span class="msmall">%2</span>
|
||||
<h1>%1<span class="mlinks">%6<span class="mwrapurl"><span> / </span><a href="%3">URL</a></span></h1>
|
||||
<span class="msmall">%5</span>
|
||||
</section>
|
||||
|
||||
<hr>
|
||||
|
||||
<div class="rssguard-mbody">
|
||||
%4
|
||||
</div>
|
||||
|
||||
</div>
|
||||
393
resources/skins/solarized-dark/html_style.css
Normal file
393
resources/skins/solarized-dark/html_style.css
Normal file
|
|
@ -0,0 +1,393 @@
|
|||
@charset "UTF-8";
|
||||
* {
|
||||
font-family: inherit;
|
||||
font-size: inherit; }
|
||||
|
||||
body, h1, h2, h3, h4, h5, h6,
|
||||
p, blockquote, pre, hr,
|
||||
dl, dd, ol, ul, figure {
|
||||
margin: 0;
|
||||
padding: 0; }
|
||||
|
||||
body {
|
||||
background-color: #2F3134;
|
||||
box-sizing: border-box;
|
||||
color: #f5f5f5;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-webkit-font-feature-settings: "kern" 1;
|
||||
font-feature-settings: "kern" 1;
|
||||
font-kerning: normal;
|
||||
padding: 10px !important;
|
||||
min-height: 100vh; }
|
||||
|
||||
::selection {
|
||||
background-color: #647595;
|
||||
text-shadow: none; }
|
||||
|
||||
h1, h2, h3, h4, h5, h6,
|
||||
p, blockquote, pre,
|
||||
ul, ol, dl, figure,
|
||||
details {
|
||||
margin-bottom: 10px; }
|
||||
|
||||
hr {
|
||||
background-color: #545556;
|
||||
border: none;
|
||||
display: block;
|
||||
height: 2px;
|
||||
margin: 10px 0; }
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-weight: 600 !important; }
|
||||
|
||||
h1 {
|
||||
font-size: 1.25rem !important; }
|
||||
|
||||
h2 {
|
||||
font-size: 1.20rem !important; }
|
||||
|
||||
h3 {
|
||||
font-size: 1.15rem !important; }
|
||||
|
||||
h4 {
|
||||
font-size: 1.1rem !important; }
|
||||
|
||||
h5 {
|
||||
font-size: 1rem !important; }
|
||||
|
||||
h6 {
|
||||
font-size: .95rem !important; }
|
||||
|
||||
b {
|
||||
font-weight: bold !important; }
|
||||
|
||||
i {
|
||||
font-style: italic !important; }
|
||||
|
||||
strong {
|
||||
font-weight: 800 !important; }
|
||||
|
||||
em {
|
||||
font-style: oblique !important; }
|
||||
|
||||
mark {
|
||||
background-color: #f8d08c66; }
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: .8rem !important; }
|
||||
|
||||
small {
|
||||
font-size: .9rem !important; }
|
||||
|
||||
abbr {
|
||||
cursor: help;
|
||||
font-style: italic !important;
|
||||
font-weight: 100 !important; }
|
||||
|
||||
q {
|
||||
font-style: italic !important; }
|
||||
q::before {
|
||||
content: '“'; }
|
||||
q::after {
|
||||
content: '”'; }
|
||||
|
||||
time {
|
||||
font-weight: 450 !important; }
|
||||
|
||||
var {
|
||||
font-style: oblique !important;
|
||||
font-weight: 500 !important; }
|
||||
|
||||
a {
|
||||
color: #647595; }
|
||||
a:hover {
|
||||
text-decoration: none; }
|
||||
a:focus {
|
||||
box-shadow: none;
|
||||
outline: none; }
|
||||
|
||||
cite {
|
||||
font-style: italic !important;
|
||||
font-weight: bold !important; }
|
||||
|
||||
figure {
|
||||
max-width: 100%; }
|
||||
|
||||
figure > img {
|
||||
display: block; }
|
||||
|
||||
figcaption {
|
||||
font-size: .8rem !important; }
|
||||
|
||||
blockquote {
|
||||
border-left: 0.3em solid #545556;
|
||||
margin-left: 0;
|
||||
padding: 0 10px; }
|
||||
blockquote,
|
||||
blockquote p {
|
||||
color: #E2E2E2; }
|
||||
|
||||
pre,
|
||||
code {
|
||||
border: 1px solid #222325;
|
||||
border-radius: 0.3em;
|
||||
color: #E2E2E2;
|
||||
font-family: monospace;
|
||||
font-size: .95rem !important; }
|
||||
|
||||
code {
|
||||
background-color: rgba(33, 35, 39, 0.4);
|
||||
padding: 0 .25em;
|
||||
word-break: break-word; }
|
||||
|
||||
pre {
|
||||
background-color: rgba(33, 35, 39, 0.4);
|
||||
overflow-x: auto;
|
||||
padding: 7px 13px;
|
||||
tab-size: 2;
|
||||
white-space: pre !important;
|
||||
width: unset !important; }
|
||||
pre > code {
|
||||
background-color: unset;
|
||||
border: none;
|
||||
color: unset;
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
tab-size: 2; }
|
||||
|
||||
kbd {
|
||||
background: rgba(33, 35, 39, 0.4);
|
||||
border: 1px solid #222325;
|
||||
border-bottom: 3px solid #1b1c1d;
|
||||
border-radius: 0.3em;
|
||||
box-shadow: 0 2px 4px #202224, inset 0 1px #2F3134;
|
||||
font-size: .9rem !important;
|
||||
padding: .1em .4em .2em .4em; }
|
||||
|
||||
select {
|
||||
background-color: rgba(33, 35, 39, 0.4);
|
||||
border: 1px solid #222325;
|
||||
border-radius: 0.3em;
|
||||
color: #f5f5f5;
|
||||
padding: .04em .25em;
|
||||
width: 100%; }
|
||||
select:focus {
|
||||
box-shadow: none;
|
||||
outline: none;
|
||||
background-color: #2F3134; }
|
||||
select > option {
|
||||
background-color: #2F3134; }
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
width: 100% !important; }
|
||||
|
||||
li {
|
||||
display: list-item; }
|
||||
|
||||
ul,
|
||||
ol {
|
||||
padding-left: 1.5em; }
|
||||
|
||||
ul {
|
||||
list-style-type: disc; }
|
||||
ul li ul {
|
||||
list-style-type: square; }
|
||||
|
||||
ol {
|
||||
list-style-type: decimal; }
|
||||
ol li ol {
|
||||
list-style-type: lower-roman; }
|
||||
|
||||
details {
|
||||
border: 1px solid rgba(33, 35, 39, 0.4);
|
||||
border-radius: 0.3em;
|
||||
padding: .5em .5em 0; }
|
||||
details > summary {
|
||||
background-color: rgba(33, 35, 39, 0.4);
|
||||
border-radius: 0.27em;
|
||||
cursor: pointer;
|
||||
margin: -.5em -.5em 0;
|
||||
padding-left: .5em; }
|
||||
details > summary:focus {
|
||||
box-shadow: none;
|
||||
outline: none; }
|
||||
details *:last-child {
|
||||
margin-bottom: 0; }
|
||||
|
||||
details[open] {
|
||||
border-color: #222325;
|
||||
padding: .5em; }
|
||||
details[open] > summary {
|
||||
border-bottom: 1px solid #222325;
|
||||
border-radius: 0.27em 0.27em 0 0;
|
||||
margin-bottom: .5em; }
|
||||
|
||||
iframe {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
width: auto; }
|
||||
|
||||
a:focus,
|
||||
select:focus,
|
||||
summary:focus {
|
||||
background-color: #222325;
|
||||
text-shadow: 0 -1px #2F3134; }
|
||||
|
||||
:target {
|
||||
outline: 1px solid #647595; }
|
||||
|
||||
.rssguard-mwrapper {
|
||||
padding: 0px !important; }
|
||||
.rssguard-mwrapper .rssguard-mhead .msmall,
|
||||
.rssguard-mwrapper .rssguard-mhead .mlinks {
|
||||
opacity: .8; }
|
||||
.rssguard-mwrapper .rssguard-mhead > h1 {
|
||||
margin: 0; }
|
||||
.rssguard-mwrapper .rssguard-mhead .msmall {
|
||||
font-size: .9em; }
|
||||
.rssguard-mwrapper .rssguard-mhead .mlinks .menc {
|
||||
word-break: break-word; }
|
||||
.rssguard-mwrapper .rssguard-mhead .mlinks .mwrapurl {
|
||||
display: inline-flex; }
|
||||
.rssguard-mwrapper .rssguard-mhead .mlinks .mwrapurl a[href=""], .rssguard-mwrapper .rssguard-mhead .mlinks .mwrapurl a[href=""] + span {
|
||||
display: none; }
|
||||
@media only screen and (max-width: 800px) {
|
||||
.rssguard-mwrapper img, .rssguard-mwrapper video {
|
||||
max-width: 100% !important; } }
|
||||
|
||||
.rssguard-mbody {
|
||||
word-break: break-word; }
|
||||
|
||||
table {
|
||||
word-break: normal; }
|
||||
|
||||
html::before,
|
||||
html::after,
|
||||
body::before,
|
||||
body::after {
|
||||
content: "";
|
||||
background-color: #222325;
|
||||
display: block;
|
||||
position: fixed;
|
||||
z-index: 5; }
|
||||
|
||||
html::before {
|
||||
height: 1px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0; }
|
||||
|
||||
html::after {
|
||||
width: 1px;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0; }
|
||||
|
||||
body::before {
|
||||
height: 1px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0; }
|
||||
|
||||
body::after {
|
||||
width: 1px;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0; }
|
||||
|
||||
::-webkit-scrollbar {
|
||||
height: 13px;
|
||||
width: 14px; }
|
||||
|
||||
::-webkit-scrollbar-track,
|
||||
::-webkit-scrollbar-corner {
|
||||
background-color: #313235;
|
||||
box-shadow: inset 1px 1px #2c2d30; }
|
||||
|
||||
::-webkit-scrollbar-corner {
|
||||
border-radius: 0 0 0.3em 0; }
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
box-shadow: inset 1px 1px #515258, inset -1px -1px #515258, inset 0px 1px #515258, inset 0px -1px #515258, inset 1px 0px #515258, inset 1px -1px #515258, inset -1px 0px #515258, inset -1px 1px #515258; }
|
||||
::-webkit-scrollbar-thumb:horizontal {
|
||||
background-image: linear-gradient(#3b3c40 5%, #36373b);
|
||||
min-width: 25px; }
|
||||
::-webkit-scrollbar-thumb:horizontal:hover {
|
||||
background-image: linear-gradient(#3d3e43 25%, #36373b); }
|
||||
::-webkit-scrollbar-thumb:vertical {
|
||||
background-image: linear-gradient(to right, #3b3c40 5%, #36373b);
|
||||
min-height: 25px; }
|
||||
::-webkit-scrollbar-thumb:vertical:hover {
|
||||
background-image: linear-gradient(to right, #3d3e43 25%, #36373b); }
|
||||
::-webkit-scrollbar-thumb:active {
|
||||
background-image: linear-gradient(#36373b, #36373b) !important; }
|
||||
|
||||
:not(body)::-webkit-scrollbar-thumb:horizontal {
|
||||
box-shadow: inset 1px 1px #515258, inset -1px -1px #515258, inset 0px 1px #515258, inset 0px -1px #515258, inset 1px 0px #515258, inset 1px -1px #515258, inset -1px 0px #515258, inset -1px 1px #515258, 1px 0px #222325, 1px 1px #222325, -1px 1px #222325, -1px 0px #222325; }
|
||||
:not(body)::-webkit-scrollbar-thumb:vertical {
|
||||
box-shadow: inset 1px 1px #515258, inset -1px -1px #515258, inset 0px 1px #515258, inset 0px -1px #515258, inset 1px 0px #515258, inset 1px -1px #515258, inset -1px 0px #515258, inset -1px 1px #515258, 0px -1px #222325, 1px -1px #222325, 1px 1px #222325, 0px 1px #222325; }
|
||||
|
||||
::-webkit-scrollbar-thumb:horizontal,
|
||||
::-webkit-scrollbar-track:horizontal {
|
||||
border-top: 1px solid #222325; }
|
||||
::-webkit-scrollbar-thumb:vertical,
|
||||
::-webkit-scrollbar-track:vertical {
|
||||
border-left: 1px solid #222325; }
|
||||
|
||||
body::-webkit-scrollbar-thumb:horizontal, body::-webkit-scrollbar-thumb:vertical,
|
||||
body::-webkit-scrollbar-track:horizontal,
|
||||
body::-webkit-scrollbar-track:vertical {
|
||||
border: 1px solid #222325; }
|
||||
body::-webkit-scrollbar-thumb:horizontal,
|
||||
body::-webkit-scrollbar-track:horizontal {
|
||||
border-top: none; }
|
||||
body::-webkit-scrollbar-thumb:vertical,
|
||||
body::-webkit-scrollbar-track:vertical {
|
||||
border-left: none; }
|
||||
|
||||
body::-webkit-scrollbar-corner {
|
||||
border: 1px solid #222325;
|
||||
border-top: none;
|
||||
border-left: none; }
|
||||
|
||||
::-webkit-scrollbar-track:corner-present:horizontal,
|
||||
::-webkit-scrollbar-thumb:corner-present:horizontal {
|
||||
border-radius: 0 0 0 0.3em; }
|
||||
::-webkit-scrollbar-track:corner-present:vertical,
|
||||
::-webkit-scrollbar-thumb:corner-present:vertical {
|
||||
border-radius: 0 0.3em 0 0; }
|
||||
::-webkit-scrollbar-track:horizontal,
|
||||
::-webkit-scrollbar-thumb:horizontal {
|
||||
border-radius: 0 0 0.3em 0.3em; }
|
||||
::-webkit-scrollbar-track:vertical,
|
||||
::-webkit-scrollbar-thumb:vertical {
|
||||
border-radius: 0 0.3em 0.3em 0; }
|
||||
|
||||
/* Please enable JS for additional colouring features */
|
||||
:root {
|
||||
--rssguard-red: 0;
|
||||
--rssguard-green: 0;
|
||||
--rssguard-blue: 0;
|
||||
--rssguard-threshold: 0.5; }
|
||||
|
||||
:root {
|
||||
--rssguard-r: calc(var(--rssguard-red) * 0.2126);
|
||||
--rssguard-g: calc(var(--rssguard-green) * 0.7152);
|
||||
--rssguard-b: calc(var(--rssguard-blue) * 0.0722);
|
||||
--rssguard-sum:
|
||||
calc(
|
||||
var(--rssguard-r) +
|
||||
var(--rssguard-g) +
|
||||
var(--rssguard-b)
|
||||
);
|
||||
--rssguard-perceived-lightness: calc(var(--rssguard-sum) / 255); }
|
||||
|
||||
body,
|
||||
::selection,
|
||||
mark, code, pre, pre > code,
|
||||
blockquote, blockquote p {
|
||||
color: hsla(0, 0%, calc( ( var(--rssguard-perceived-lightness) - var(--rssguard-threshold) ) * -10000000% ), 0.9); }
|
||||
|
||||
/*# sourceMappingURL=html_style.css.map */
|
||||
309
resources/skins/solarized-dark/html_style.scss
Normal file
309
resources/skins/solarized-dark/html_style.scss
Normal file
|
|
@ -0,0 +1,309 @@
|
|||
@charset "utf-8";
|
||||
|
||||
$qtbg-base: #2F3134 !default; // clr_basbg
|
||||
$qtbg-button: #2C2D30 !default; // clr_altbg // button bg (scrollbar, alt bg)
|
||||
$qcselbg: #647595 !default; // clr_selbg
|
||||
|
||||
// {{{ Emulate Fusion colour processing (dark only)
|
||||
|
||||
// Scrollbar colours
|
||||
|
||||
//$qcbgbg: lighten($qtbg-button, 6%); // See toolbar bg
|
||||
$bgscroll: lighten($qtbg-button, 2%) !default; // track and corner bg
|
||||
$tr-border: darken($qtbg-button, 4%) !default; // track brdr
|
||||
|
||||
// {{{ Scrollbar thumb
|
||||
|
||||
// Thumb bg gradient
|
||||
|
||||
// Normal
|
||||
$thscrlin: lighten($qtbg-button, 6%) !default;
|
||||
$thscrlout: lighten($qtbg-button, 4%) !default;
|
||||
|
||||
// Hover
|
||||
$thscrlhvin: lighten($qtbg-button, 7%) !default;
|
||||
$thscrlhvout: $thscrlout;
|
||||
|
||||
// Light outline
|
||||
$th-border: lighten($qtbg-button, 15%) !default;
|
||||
|
||||
// }}}
|
||||
|
||||
// }}}
|
||||
|
||||
// {{{ HTML palette (Colours)
|
||||
|
||||
$cbg00: $qtbg-base;
|
||||
|
||||
// {{{ Irrelevant, because colour switcher (see below) overrides all fg colours (either with JS on or off)
|
||||
$cfg00: #f5f5f5 !default;
|
||||
$cfg10: #E2E2E2 !default;
|
||||
$cfg11: $cfg10;
|
||||
// }}}
|
||||
|
||||
$cbor2: #545556 !default;
|
||||
|
||||
$ccodeblock: rgba(33, 35, 39, 0.4) !default;
|
||||
$ccode: $ccodeblock;
|
||||
$cbor3: $tr-border;
|
||||
$cmark: #f8d08c66 !default; // 40% transparency
|
||||
|
||||
$clink: $qcselbg;
|
||||
|
||||
// }}}
|
||||
|
||||
// Other
|
||||
|
||||
$radius-unit: .3em !default;
|
||||
|
||||
@import
|
||||
"../nudus-base/html_style_base"
|
||||
;
|
||||
|
||||
//
|
||||
// Dark CSS style has following additions:
|
||||
//
|
||||
|
||||
// {{{ Border around viewport
|
||||
|
||||
// https://csswizardry.com/2010/12/simplified-page-borders-in-pure-css/
|
||||
|
||||
html::before,
|
||||
html::after,
|
||||
body::before,
|
||||
body::after {
|
||||
content: "";
|
||||
background-color: $tr-border;
|
||||
display: block;
|
||||
position: fixed;
|
||||
z-index: 5;
|
||||
}
|
||||
|
||||
html::before {
|
||||
height: 1px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
html::after {
|
||||
width: 1px;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
body::before {
|
||||
height: 1px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
body::after {
|
||||
width: 1px;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
// }}}
|
||||
|
||||
// {{{ Dark-coloured scrollbar
|
||||
|
||||
::-webkit-scrollbar {
|
||||
height: 13px;
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track,
|
||||
::-webkit-scrollbar-corner {
|
||||
background-color: $bgscroll;
|
||||
box-shadow: inset 1px 1px lighten($tr-border, 4%);
|
||||
}
|
||||
|
||||
// Part where vertical and horizontal scrollbars meet
|
||||
::-webkit-scrollbar-corner {
|
||||
border-radius: 0 0 $radius-unit 0;
|
||||
}
|
||||
|
||||
// TODO: Can be simplified to @include and function
|
||||
$th-outline:
|
||||
inset 1px 1px $th-border,
|
||||
inset -1px -1px $th-border,
|
||||
|
||||
inset 0px 1px $th-border,
|
||||
inset 0px -1px $th-border,
|
||||
|
||||
inset 1px 0px $th-border,
|
||||
inset 1px -1px $th-border,
|
||||
|
||||
inset -1px 0px $th-border,
|
||||
inset -1px 1px $th-border
|
||||
;
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
$th-min-unit: 25px;
|
||||
box-shadow: $th-outline;
|
||||
|
||||
&:horizontal {
|
||||
background-image: linear-gradient($thscrlin 5%, $thscrlout);
|
||||
min-width: $th-min-unit;
|
||||
|
||||
&:hover {
|
||||
background-image: linear-gradient($thscrlhvin 25%, $thscrlhvout);
|
||||
}
|
||||
}
|
||||
|
||||
&:vertical {
|
||||
background-image: linear-gradient(to right, $thscrlin 5%, $thscrlout);
|
||||
min-height: $th-min-unit;
|
||||
|
||||
&:hover {
|
||||
background-image: linear-gradient(to right, $thscrlhvin 25%, $thscrlhvout);
|
||||
}
|
||||
}
|
||||
|
||||
&:active {
|
||||
background-image: linear-gradient($thscrlout, $thscrlout) !important;
|
||||
}
|
||||
}
|
||||
|
||||
// Light and dark borders to outline the thumb
|
||||
// Clockwise (x y)
|
||||
:not(body)::-webkit-scrollbar-thumb {
|
||||
|
||||
&:horizontal {
|
||||
box-shadow:
|
||||
$th-outline,
|
||||
1px 0px $tr-border,
|
||||
1px 1px $tr-border,
|
||||
-1px 1px $tr-border,
|
||||
-1px 0px $tr-border
|
||||
;
|
||||
}
|
||||
|
||||
&:vertical {
|
||||
box-shadow:
|
||||
$th-outline,
|
||||
0px -1px $tr-border,
|
||||
1px -1px $tr-border,
|
||||
1px 1px $tr-border,
|
||||
0px 1px $tr-border
|
||||
;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb,
|
||||
::-webkit-scrollbar-track {
|
||||
|
||||
&:horizontal {
|
||||
border-top: 1px solid $tr-border;
|
||||
}
|
||||
|
||||
&:vertical {
|
||||
border-left: 1px solid $tr-border;
|
||||
}
|
||||
}
|
||||
|
||||
// Complete the borders for body scrollbar
|
||||
body::-webkit-scrollbar-thumb,
|
||||
body::-webkit-scrollbar-track {
|
||||
|
||||
&:horizontal,
|
||||
&:vertical {
|
||||
border: 1px solid $tr-border;
|
||||
}
|
||||
|
||||
&:horizontal {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
&:vertical {
|
||||
border-left: none;
|
||||
}
|
||||
}
|
||||
|
||||
body::-webkit-scrollbar-corner {
|
||||
border: 1px solid $tr-border;
|
||||
border-top: none;
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track,
|
||||
::-webkit-scrollbar-thumb {
|
||||
|
||||
&:corner-present {
|
||||
|
||||
&:horizontal {
|
||||
border-radius: 0 0 0 $radius-unit;
|
||||
}
|
||||
|
||||
&:vertical {
|
||||
border-radius: 0 $radius-unit 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
&:horizontal {
|
||||
border-radius: 0 0 $radius-unit $radius-unit;
|
||||
}
|
||||
|
||||
&:vertical {
|
||||
border-radius: 0 $radius-unit $radius-unit 0;
|
||||
}
|
||||
}
|
||||
|
||||
// }}}
|
||||
|
||||
// {{{ Fg colour switcher
|
||||
|
||||
// Thank you so much!!
|
||||
// https://css-tricks.com/switch-font-color-for-different-backgrounds-with-css/
|
||||
|
||||
/* Please enable JS for additional colouring features */
|
||||
:root {
|
||||
// Default RGB values for background colour
|
||||
--rssguard-red: 0;
|
||||
--rssguard-green: 0;
|
||||
--rssguard-blue: 0;
|
||||
// The threshold at which colours are considered "light
|
||||
// Range: decimals from 0 to 1, recommended 0.5 - 0.6
|
||||
--rssguard-threshold: 0.5;
|
||||
}
|
||||
|
||||
:root {
|
||||
// Calculates perceived lightness using the sRGB Luma method
|
||||
// Luma = (red * 0.2126 + green * 0.7152 + blue * 0.0722) / 255
|
||||
--rssguard-r: calc(var(--rssguard-red) * 0.2126);
|
||||
--rssguard-g: calc(var(--rssguard-green) * 0.7152);
|
||||
--rssguard-b: calc(var(--rssguard-blue) * 0.0722);
|
||||
--rssguard-sum:
|
||||
calc(
|
||||
var(--rssguard-r) +
|
||||
var(--rssguard-g) +
|
||||
var(--rssguard-b)
|
||||
);
|
||||
--rssguard-perceived-lightness: calc(var(--rssguard-sum) / 255);
|
||||
}
|
||||
|
||||
// Shows either white or black colour depending on perceived lightness
|
||||
body,
|
||||
::selection,
|
||||
mark, code, pre, pre > code,
|
||||
blockquote, blockquote p { // TODO: why did not I add 'blockquote p' here before?
|
||||
color:
|
||||
hsla(
|
||||
0,
|
||||
0%,
|
||||
calc(
|
||||
(
|
||||
var(--rssguard-perceived-lightness) -
|
||||
var(--rssguard-threshold)
|
||||
) *
|
||||
-10000000%
|
||||
),
|
||||
.9
|
||||
);
|
||||
}
|
||||
// }}}
|
||||
// vim:foldmethod=marker
|
||||
423
resources/skins/solarized-dark/html_style_base.scss
Normal file
423
resources/skins/solarized-dark/html_style_base.scss
Normal file
|
|
@ -0,0 +1,423 @@
|
|||
// ___________________________
|
||||
// < I'm an expert in my field. >
|
||||
// ---------------------------
|
||||
// \ ^__^
|
||||
// \ (oo)\_______
|
||||
// (__)\ )\/\
|
||||
// ||----w |
|
||||
// || ||
|
||||
|
||||
//
|
||||
// Variables
|
||||
//
|
||||
|
||||
$base-unit: 10px !default;
|
||||
|
||||
//
|
||||
// Styling
|
||||
//
|
||||
|
||||
// Let the font be customised via RSS Guard settings
|
||||
* {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
//
|
||||
// Reset some basic elements
|
||||
//
|
||||
|
||||
body, h1, h2, h3, h4, h5, h6,
|
||||
p, blockquote, pre, hr,
|
||||
dl, dd, ol, ul, figure {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
//
|
||||
// Add some basic styling
|
||||
//
|
||||
|
||||
body {
|
||||
background-color: $cbg00;
|
||||
|
||||
box-sizing: border-box;
|
||||
color: $cfg00;
|
||||
//cursor: default;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-webkit-font-feature-settings: "kern" 1;
|
||||
font-feature-settings: "kern" 1;
|
||||
font-kerning: normal;
|
||||
padding: 10px !important;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background-color: $clink;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6,
|
||||
p, blockquote, pre,
|
||||
ul, ol, dl, figure,
|
||||
details {
|
||||
margin-bottom: $base-unit;
|
||||
}
|
||||
|
||||
hr {
|
||||
background-color: $cbor2;
|
||||
border: none;
|
||||
display: block;
|
||||
height: 2px;
|
||||
margin: $base-unit 0;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-weight: 600 !important;
|
||||
}
|
||||
|
||||
h1 { font-size: 1.25rem !important; }
|
||||
h2 { font-size: 1.20rem !important; }
|
||||
h3 { font-size: 1.15rem !important; }
|
||||
h4 { font-size: 1.1rem !important; }
|
||||
h5 { font-size: 1rem !important; }
|
||||
h6 { font-size: .95rem !important; }
|
||||
|
||||
b {
|
||||
font-weight: bold !important;
|
||||
}
|
||||
|
||||
i {
|
||||
font-style: italic !important;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-weight: 800 !important;
|
||||
}
|
||||
|
||||
em {
|
||||
font-style: oblique !important;
|
||||
}
|
||||
|
||||
mark {
|
||||
background-color: $cmark;
|
||||
}
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: .8rem !important;
|
||||
}
|
||||
|
||||
small {
|
||||
font-size: .9rem !important;
|
||||
}
|
||||
|
||||
abbr {
|
||||
cursor: help;
|
||||
font-style: italic !important;
|
||||
font-weight: 100 !important;
|
||||
}
|
||||
|
||||
q {
|
||||
font-style: italic !important;
|
||||
|
||||
&::before {
|
||||
content: '“';
|
||||
}
|
||||
|
||||
&::after {
|
||||
content: '”';
|
||||
}
|
||||
}
|
||||
|
||||
time {
|
||||
font-weight: 450 !important;
|
||||
}
|
||||
|
||||
var {
|
||||
font-style: oblique !important;
|
||||
font-weight: 500 !important;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $clink;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
box-shadow: none;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
cite {
|
||||
font-style: italic !important;
|
||||
font-weight: bold !important;
|
||||
}
|
||||
|
||||
// override if width is defined in element's style attribute
|
||||
figure {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
figure > img {
|
||||
display: block;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
font-size: .8rem !important;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: .3em solid $cbor2;
|
||||
margin-left: 0;
|
||||
padding: 0 $base-unit;
|
||||
|
||||
&,
|
||||
p {
|
||||
color: $cfg11;
|
||||
}
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
border: 1px solid $cbor3;
|
||||
border-radius: $radius-unit;
|
||||
color: $cfg10;
|
||||
//cursor: text;
|
||||
|
||||
// Font for code blocks falls back to system default monospace
|
||||
font-family: monospace;
|
||||
font-size: .95rem !important;
|
||||
}
|
||||
|
||||
code {
|
||||
background-color: $ccode;
|
||||
padding: 0 .25em;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
pre {
|
||||
background-color: $ccodeblock;
|
||||
overflow-x: auto;
|
||||
padding: 7px 13px;
|
||||
tab-size: 2;
|
||||
// For <pre style='white-space:pre-wrap;'>
|
||||
white-space: pre !important;
|
||||
|
||||
// For <pre style='white-space:pre-wrap;width:81ex'>
|
||||
width: unset !important;
|
||||
|
||||
> code {
|
||||
background-color: unset;
|
||||
border: none;
|
||||
color: unset;
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
tab-size: 2;
|
||||
}
|
||||
}
|
||||
|
||||
kbd {
|
||||
background: $ccode;
|
||||
border: 1px solid $cbor3;
|
||||
border-bottom: 3px solid darken($cbor3, 3%);
|
||||
border-radius: $radius-unit;
|
||||
box-shadow:
|
||||
0 2px 4px darken($cbg00, 6%),
|
||||
inset 0 1px $cbg00
|
||||
;
|
||||
font-size: .9rem !important;
|
||||
padding: .1em .4em .2em .4em;
|
||||
}
|
||||
|
||||
select {
|
||||
background-color: $ccodeblock;
|
||||
border: 1px solid $cbor3;
|
||||
border-radius: $radius-unit;
|
||||
color: $cfg00;
|
||||
padding: .04em .25em;
|
||||
// Do not use max-width here
|
||||
width: 100%;
|
||||
|
||||
&:focus {
|
||||
box-shadow: none;
|
||||
outline: none;
|
||||
|
||||
background-color: $cbg00;
|
||||
}
|
||||
|
||||
> option {
|
||||
background-color: $cbg00;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
// `!important` is set to override something like <table width="900px">
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
// Return this if something goes wrong, and return the JS override for dark theme
|
||||
//table,
|
||||
//th,
|
||||
//td {
|
||||
// color: $cfg00;
|
||||
//}
|
||||
|
||||
li {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
ul,
|
||||
ol {
|
||||
padding-left: 1.5em;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style-type: disc;
|
||||
|
||||
li ul {
|
||||
list-style-type: square;
|
||||
}
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style-type: decimal;
|
||||
|
||||
li ol {
|
||||
list-style-type: lower-roman;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
// Let the width be defined (see .rssguard-mbody img), but keep aspect ratio
|
||||
//height: auto;
|
||||
// `width auto` creates many problems even if set as a fallback
|
||||
//width: auto;
|
||||
}
|
||||
|
||||
details {
|
||||
border: 1px solid $ccodeblock;
|
||||
border-radius: $radius-unit;
|
||||
padding: .5em .5em 0;
|
||||
|
||||
> summary {
|
||||
background-color: $ccodeblock;
|
||||
border-radius: $radius-unit * 0.9;
|
||||
cursor: pointer;
|
||||
margin: -.5em -.5em 0;
|
||||
padding-left: .5em;
|
||||
|
||||
&:focus {
|
||||
box-shadow: none;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
& *:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
details[open] {
|
||||
border-color: $cbor3;
|
||||
padding: .5em;
|
||||
|
||||
> summary {
|
||||
border-bottom: 1px solid $cbor3;
|
||||
border-radius: ($radius-unit * 0.9) ($radius-unit * 0.9) 0 0;
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
}
|
||||
|
||||
iframe {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
a,
|
||||
select,
|
||||
summary {
|
||||
|
||||
&:focus {
|
||||
background-color: $cbor3;
|
||||
text-shadow: 0 -1px $cbg00;
|
||||
}
|
||||
}
|
||||
|
||||
:target {
|
||||
outline: 1px solid $clink;
|
||||
}
|
||||
|
||||
// m* == message*
|
||||
.rssguard-mwrapper {
|
||||
padding: 0px !important;
|
||||
|
||||
.rssguard-mhead {
|
||||
|
||||
.msmall,
|
||||
.mlinks {
|
||||
opacity: .8;
|
||||
}
|
||||
|
||||
> h1 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.msmall {
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
.mlinks {
|
||||
|
||||
.menc {
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.mwrapurl {
|
||||
display: inline-flex;
|
||||
|
||||
a[href=""] {
|
||||
|
||||
&,
|
||||
& + span {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
img, video {
|
||||
// Needs to be `!important` when max-width is defined by image style
|
||||
// <img src="https://....png" alt="alt" style="max-width: 100%;">
|
||||
//max-width: 450px !important;
|
||||
// For cases when they both are set
|
||||
//max-height: unset !important;
|
||||
|
||||
@media only screen and (max-width: 800px) {
|
||||
// `!important` to override `!important` that is set above
|
||||
max-width: 100% !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Other
|
||||
//
|
||||
|
||||
// For articles without any html elements;
|
||||
// If not applied to _all_, *must* be applied to links in mbody
|
||||
// mbody == article body
|
||||
.rssguard-mbody {
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
// Fix at least some mess produced by above
|
||||
table {
|
||||
word-break: normal;
|
||||
}
|
||||
29
resources/skins/solarized-dark/html_wrapper.html
Normal file
29
resources/skins/solarized-dark/html_wrapper.html
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>%1</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<style>
|
||||
%style%
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
%2
|
||||
|
||||
<script>
|
||||
const rssGuardroot = document.documentElement;
|
||||
rssGuardBody = document.body;
|
||||
let rssGuardColor = window.getComputedStyle(rssGuardBody).backgroundColor;
|
||||
rssGuardMatch = rssGuardColor.match(/(\w+)\((\d+), (\d+), (\d+)\)/);
|
||||
|
||||
if (rssGuardMatch != null) {
|
||||
rssGuardroot.style.setProperty('--rssguard-red', rssGuardMatch[2]);
|
||||
rssGuardroot.style.setProperty('--rssguard-green', rssGuardMatch[3]);
|
||||
rssGuardroot.style.setProperty('--rssguard-blue', rssGuardMatch[4]);
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1 @@
|
|||
/ <a href="%1"><span style="text-transform: uppercase;">%2</span></a>
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
<a href="%1">
|
||||
<img alt="%2" src="%1" height="%3">
|
||||
</a>
|
||||
<br/>
|
||||
15
resources/skins/solarized-dark/lite_html_single_message.html
Normal file
15
resources/skins/solarized-dark/lite_html_single_message.html
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<div dir="%9" id="%8">
|
||||
|
||||
<div>
|
||||
<div>%7</div>
|
||||
<span>%2</span>
|
||||
<h2>%1<span>%6</span> / <a href="%3">URL</a></h2>
|
||||
<span>%5</span>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<div>
|
||||
%4
|
||||
</div>
|
||||
</div>
|
||||
25
resources/skins/solarized-dark/lite_html_style.css
Normal file
25
resources/skins/solarized-dark/lite_html_style.css
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
body,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
blockquote,
|
||||
pre,
|
||||
hr,
|
||||
dl,
|
||||
dd,
|
||||
ol,
|
||||
ul,
|
||||
figure {
|
||||
margin: 0;
|
||||
padding: 0; }
|
||||
|
||||
body {
|
||||
background-color: #2F3134;
|
||||
color: #f5f5f5; }
|
||||
|
||||
a {
|
||||
color: #647595; }
|
||||
7
resources/skins/solarized-dark/lite_html_style.scss
Normal file
7
resources/skins/solarized-dark/lite_html_style.scss
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
@charset "utf-8";
|
||||
|
||||
$col_back: #2F3134 !default;
|
||||
$col_front: #f5f5f5 !default;
|
||||
$col_link: #647595 !default;
|
||||
|
||||
@import "../nudus-base/lite_html_style_base";
|
||||
28
resources/skins/solarized-dark/lite_html_style_base.scss
Normal file
28
resources/skins/solarized-dark/lite_html_style_base.scss
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
body,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
blockquote,
|
||||
pre,
|
||||
hr,
|
||||
dl,
|
||||
dd,
|
||||
ol,
|
||||
ul,
|
||||
figure {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: $col_back;
|
||||
color: $col_front;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $col_link;
|
||||
}
|
||||
61
resources/skins/solarized-dark/metadata.xml
Normal file
61
resources/skins/solarized-dark/metadata.xml
Normal file
|
|
@ -0,0 +1,61 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<skin version="6.6.6">
|
||||
<author>
|
||||
<name>martinrotter</name>
|
||||
</author>
|
||||
<description>Dark variation of solarized theme.</description>
|
||||
|
||||
<palette>
|
||||
<color key="FgInteresting">#acc2c5</color>
|
||||
<color key="FgSelectedInteresting">#acc2c5</color>
|
||||
<color key="FgNewMessages">#B58900</color>
|
||||
<color key="FgSelectedNewMessages">#B58900</color>
|
||||
<color key="FgError">#DC322F</color>
|
||||
<color key="FgSelectedError">#DC322F</color>
|
||||
<color key="FgDisabledFeed">#586e75</color>
|
||||
<color key="Allright">#859900</color>
|
||||
</palette>
|
||||
|
||||
<forced-styles>Fusion</forced-styles>
|
||||
<forced-skin-colors>true</forced-skin-colors>
|
||||
|
||||
<style-palette>
|
||||
<group id="All">
|
||||
<color role="Base">#002b36</color>
|
||||
<color role="AlternateBase">#073642</color>
|
||||
<color role="ToolTipBase" brush="Dense1Pattern">#586e75</color>
|
||||
<color role="Dark">#001f27</color>
|
||||
<color role="Midlight">#586e75</color>
|
||||
<color role="Mid">#657b83</color>
|
||||
<color role="Shadow">#073642</color>
|
||||
<color role="Light">#839496</color>
|
||||
<color role="Highlight">#d33682</color>
|
||||
|
||||
<color role="Window">#073642</color>
|
||||
<color role="Button">#073642</color>
|
||||
|
||||
<color role="Text">#96aaac</color>
|
||||
<color role="BrightText">#ffffff</color>
|
||||
<color role="HighlightedText">#ffffff</color>
|
||||
<color role="PlaceholderText">#586e75</color>
|
||||
<color role="ToolTipText">#96aaac</color>
|
||||
<color role="ButtonText">#ffffff</color>
|
||||
<color role="WindowText">#96aaac</color>
|
||||
<color role="Link">#268bd2</color>
|
||||
<color role="LinkVisited">#6c71c4</color>
|
||||
|
||||
<color role="NoRole">#073642</color>
|
||||
</group>
|
||||
|
||||
<group id="Disabled">
|
||||
<color role="Base">#002b36</color>
|
||||
<color role="Dark">#001f27</color>
|
||||
<color role="Shadow">#073642</color>
|
||||
<color role="Text">#586e75</color>
|
||||
<color role="ButtonText">#586e75</color>
|
||||
<color role="WindowText">#586e75</color>
|
||||
<color role="Highlight">#d33682</color>
|
||||
</group>
|
||||
</style-palette>
|
||||
|
||||
</skin>
|
||||
4
resources/skins/solarized-dark/qt_style.qss
Normal file
4
resources/skins/solarized-dark/qt_style.qss
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
QProgressBar {
|
||||
background-color: palette(highlight);
|
||||
color: palette(window);
|
||||
}
|
||||
24
resources/skins/solarized-dark/qt_style_forced.qss
Normal file
24
resources/skins/solarized-dark/qt_style_forced.qss
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
QListWidget,
|
||||
QScrollArea {
|
||||
border: 1px solid palette(light);
|
||||
}
|
||||
|
||||
|
||||
QPlainTextEdit:focus {
|
||||
border: 1px solid palette(highlight);
|
||||
}
|
||||
|
||||
QToolTip {
|
||||
background-color: palette(window);
|
||||
color: palette(text);
|
||||
border: 1px solid palette(highlight);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
QSplitter::handle {
|
||||
background: palette(light);
|
||||
}
|
||||
|
||||
QStatusBar::item {
|
||||
border: none;
|
||||
}
|
||||
|
|
@ -94,7 +94,7 @@ QIcon MessagesModel::generateUnreadIcon() {
|
|||
QPointF center(64, 64);
|
||||
qreal radius = 32;
|
||||
|
||||
QColor custom_clr = qApp->skins()->colorForModel(SkinEnums::PaletteColors::FgNewMessages).value<QColor>();
|
||||
QColor custom_clr = qApp->skins()->colorForModel(SkinEnums::PaletteColors::FgInteresting).value<QColor>();
|
||||
|
||||
if (!custom_clr.isValid()) {
|
||||
custom_clr = QColor(RAD_COLOR);
|
||||
|
|
|
|||
|
|
@ -63,34 +63,18 @@ bool SkinFactory::isStyleGoodForAlternativeStylePalette(const QString& style_nam
|
|||
// This is here because in Qt 6.5.0, they hardcoded
|
||||
// DARK palette if user has enabled "dark mode" in OS.
|
||||
QPalette qt_fusionPalette(bool dark_appearance) {
|
||||
// Define Solarized dark and light colors
|
||||
const QColor solarized_base03 = QColor(0, 43, 54); // Dark background for Solarized dark
|
||||
const QColor solarized_base2 = QColor(238, 232, 213); // Light background for Solarized light
|
||||
const QColor solarized_yellow = QColor(181, 137, 0);
|
||||
const QColor solarized_orange = QColor(203, 75, 22);
|
||||
const QColor solarized_red = QColor(220, 50, 47);
|
||||
const QColor solarized_magenta = QColor(211, 54, 130);
|
||||
const QColor solarized_violet = QColor(108, 113, 196);
|
||||
const QColor solarized_blue = QColor(38, 139, 210);
|
||||
const QColor solarized_cyan = QColor(42, 161, 152);
|
||||
const QColor solarized_green = QColor(133, 153, 0);
|
||||
|
||||
// Choose background and text colors based on appearance
|
||||
const QColor background = dark_appearance ? solarized_base03 : solarized_base2;
|
||||
const QColor window_text = dark_appearance ? QColor(131, 148, 150) : QColor(0, 43, 54); // Adjusted for contrast
|
||||
const QColor text = window_text;
|
||||
|
||||
// Derive other colors
|
||||
const QColor light_color = background.lighter(150);
|
||||
const QColor middle_color = (background.darker(130));
|
||||
const QColor middle_light_color = middle_color.lighter(110);
|
||||
const QColor base = dark_appearance ? background.darker(140) : QColor(253, 246, 227); // Solarized base2 for light
|
||||
const QColor disabled_base = background;
|
||||
const QColor window_text = dark_appearance ? QColor(240, 240, 240) : Qt::black;
|
||||
const QColor background = dark_appearance ? QColor(50, 50, 50) : QColor(239, 239, 239);
|
||||
const QColor light = background.lighter(150);
|
||||
const QColor mid = (background.darker(130));
|
||||
const QColor midlight = mid.lighter(110);
|
||||
const QColor base = dark_appearance ? background.darker(140) : Qt::white;
|
||||
const QColor disabled_base(background);
|
||||
const QColor dark = background.darker(150);
|
||||
const QColor disabled_dark = QColor(209, 209, 209).darker(110);
|
||||
const QColor highlight = dark_appearance ? solarized_magenta : solarized_yellow; // Example highlight
|
||||
const QColor disabled_highlight = QColor(145, 145, 145);
|
||||
const QColor highlighted_text = dark_appearance ? window_text : QColor(0, 43, 54);
|
||||
const QColor text = dark_appearance ? window_text : Qt::black;
|
||||
const QColor highlight = QColor(48, 140, 198);
|
||||
const QColor hightlighted_text = dark_appearance ? window_text : Qt::white;
|
||||
const QColor disabled_text = dark_appearance ? QColor(130, 130, 130) : QColor(190, 190, 190);
|
||||
const QColor button = background;
|
||||
const QColor shadow = dark.darker(135);
|
||||
|
|
@ -99,11 +83,11 @@ QPalette qt_fusionPalette(bool dark_appearance) {
|
|||
QColor placeholder = text;
|
||||
placeholder.setAlpha(128);
|
||||
|
||||
QPalette fusion_palette(window_text, background, light_color, dark, middle_color, text, base);
|
||||
fusion_palette.setBrush(QPalette::Midlight, middle_light_color);
|
||||
QPalette fusion_palette(window_text, background, light, dark, mid, text, base);
|
||||
fusion_palette.setBrush(QPalette::Midlight, midlight);
|
||||
fusion_palette.setBrush(QPalette::Button, button);
|
||||
fusion_palette.setBrush(QPalette::Shadow, shadow);
|
||||
fusion_palette.setBrush(QPalette::HighlightedText, highlighted_text);
|
||||
fusion_palette.setBrush(QPalette::HighlightedText, hightlighted_text);
|
||||
|
||||
fusion_palette.setBrush(QPalette::Disabled, QPalette::Text, disabled_text);
|
||||
fusion_palette.setBrush(QPalette::Disabled, QPalette::WindowText, disabled_text);
|
||||
|
|
@ -114,7 +98,7 @@ QPalette qt_fusionPalette(bool dark_appearance) {
|
|||
|
||||
fusion_palette.setBrush(QPalette::Active, QPalette::Highlight, highlight);
|
||||
fusion_palette.setBrush(QPalette::Inactive, QPalette::Highlight, highlight);
|
||||
fusion_palette.setBrush(QPalette::Disabled, QPalette::Highlight, disabled_highlight);
|
||||
fusion_palette.setBrush(QPalette::Disabled, QPalette::Highlight, QColor(145, 145, 145));
|
||||
|
||||
fusion_palette.setBrush(QPalette::PlaceholderText, placeholder);
|
||||
|
||||
|
|
@ -125,61 +109,6 @@ QPalette qt_fusionPalette(bool dark_appearance) {
|
|||
return fusion_palette;
|
||||
}
|
||||
|
||||
/*
|
||||
* QPalette qt_fusionPalette(bool dark_appearance) {
|
||||
// Define pastel and well-readable colors depending on appearance
|
||||
const QColor window_text = dark_appearance ? QColor(200, 200, 200) : QColor(30, 30, 30);
|
||||
const QColor background = dark_appearance ? QColor(40, 40, 50) : QColor(245, 245, 245);
|
||||
const QColor light_color = background.lighter(150);
|
||||
const QColor middle_color = background.darker(130);
|
||||
const QColor middle_light_color = middle_color.lighter(110);
|
||||
const QColor base = dark_appearance ? background.darker(140) : QColor(255, 255, 255);
|
||||
const QColor disabled_base = background;
|
||||
const QColor dark = background.darker(150);
|
||||
const QColor disabled_dark = QColor(180, 180, 180).darker(110);
|
||||
|
||||
// Pastel accent colors for highlights
|
||||
const QColor highlight = dark_appearance ? QColor(150, 200, 225) : QColor(100, 180, 220);
|
||||
const QColor disabled_highlight = QColor(180, 180, 180);
|
||||
const QColor highlighted_text = dark_appearance ? window_text : QColor(255, 255, 255);
|
||||
const QColor disabled_text = dark_appearance ? QColor(130, 130, 130) : QColor(180, 180, 180);
|
||||
const QColor button = background;
|
||||
const QColor shadow = dark.darker(135);
|
||||
const QColor disabled_shadow = shadow.lighter(150);
|
||||
|
||||
// Placeholder with semi-transparent effect
|
||||
QColor placeholder = highlighted_text;
|
||||
placeholder.setAlpha(128);
|
||||
|
||||
QPalette fusion_palette(window_text, background, light_color, dark, middle_color, highlighted_text, base);
|
||||
fusion_palette.setBrush(QPalette::Midlight, middle_light_color);
|
||||
fusion_palette.setBrush(QPalette::Button, button);
|
||||
fusion_palette.setBrush(QPalette::Shadow, shadow);
|
||||
fusion_palette.setBrush(QPalette::HighlightedText, highlighted_text);
|
||||
|
||||
// Disabled states
|
||||
fusion_palette.setBrush(QPalette::Disabled, QPalette::Text, disabled_text);
|
||||
fusion_palette.setBrush(QPalette::Disabled, QPalette::WindowText, disabled_text);
|
||||
fusion_palette.setBrush(QPalette::Disabled, QPalette::ButtonText, disabled_text);
|
||||
fusion_palette.setBrush(QPalette::Disabled, QPalette::Base, disabled_base);
|
||||
fusion_palette.setBrush(QPalette::Disabled, QPalette::Dark, disabled_dark);
|
||||
fusion_palette.setBrush(QPalette::Disabled, QPalette::Shadow, disabled_shadow);
|
||||
|
||||
// Highlight states
|
||||
fusion_palette.setBrush(QPalette::Active, QPalette::Highlight, highlight);
|
||||
fusion_palette.setBrush(QPalette::Inactive, QPalette::Highlight, highlight);
|
||||
fusion_palette.setBrush(QPalette::Disabled, QPalette::Highlight, disabled_highlight);
|
||||
|
||||
// Placeholder text
|
||||
fusion_palette.setBrush(QPalette::PlaceholderText, placeholder);
|
||||
|
||||
if (dark_appearance) {
|
||||
fusion_palette.setBrush(QPalette::Link, highlight);
|
||||
}
|
||||
|
||||
return fusion_palette;
|
||||
}*/
|
||||
|
||||
void SkinFactory::loadSkinFromData(const Skin& skin, bool replace_existing_qss) {
|
||||
#if QT_VERSION >= 0x060500 // Qt >= 6.5.0
|
||||
auto system_color_scheme = qApp->styleHints()->colorScheme();
|
||||
|
|
@ -261,7 +190,7 @@ void SkinFactory::loadSkinFromData(const Skin& skin, bool replace_existing_qss)
|
|||
// colors are now derived from system.
|
||||
#if QT_VERSION >= 0x060500 // Qt >= 6.5.0
|
||||
else /*if (qApp->styleHints()->colorScheme() == Qt::ColorScheme::Light)*/ {
|
||||
qApp->setPalette(qt_fusionPalette(true));
|
||||
qApp->setPalette(qt_fusionPalette(false));
|
||||
}
|
||||
#endif
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue