feat(theming): use translucent color for text selection

Keeps old design with stronger constrast between background color and
background for high contrast themes.

Fixes: #55508

Signed-off-by: Jonas <jonas@freesources.org>
This commit is contained in:
Jonas 2026-03-10 14:03:29 +01:00
parent b96083862b
commit 3f27ba3aac
No known key found for this signature in database
GPG key ID: 5262E7FF491049FE
10 changed files with 17 additions and 6 deletions

View file

@ -43,6 +43,7 @@
--color-info-text: #0066AC;
--color-favorite: #A37200;
--color-mark: #fff0c7;
--color-background-selection: rgb(from var(--color-primary-element) r g b / 0.2);
/** @deprecated use css color functions */
--color-error-rgb: 255,231,231;
/** @deprecated use css color functions */

View file

@ -99,6 +99,8 @@ class DarkHighContrastTheme extends DarkTheme implements ITheme {
'--color-info-hover' => $this->util->lighten($colorInfo, 5),
'--color-info-text' => $this->util->lighten($colorInfo, 60),
'--color-background-selection' => 'var(--color-primary-element)',
'--color-scrollbar' => 'auto transparent',
// used for the icon loading animation
@ -128,6 +130,9 @@ class DarkHighContrastTheme extends DarkTheme implements ITheme {
div.crumb {
filter: brightness(150%);
}
::selection {
color: var(--color-primary-element-text);
}
";
}
}

View file

@ -116,6 +116,7 @@ class DarkTheme extends DefaultTheme implements ITheme {
'--color-info-text' => $colorInfoText,
'--color-favorite' => '#ffde00',
'--color-mark' => '#4d3800',
'--color-background-selection' => 'rgb(from var(--color-primary-element) r g b / 0.4)',
// deprecated
'--color-error-rgb' => join(',', $this->util->hexToRGB($colorError)),
'--color-warning-rgb' => join(',', $this->util->hexToRGB($colorWarning)),

View file

@ -166,6 +166,7 @@ class DefaultTheme implements ITheme {
'--color-info-text' => $colorInfoText,
'--color-favorite' => '#A37200',
'--color-mark' => '#fff0c7',
'--color-background-selection' => 'rgb(from var(--color-primary-element) r g b / 0.2)',
// deprecated
'--color-error-rgb' => join(',', $this->util->hexToRGB($colorError)),
'--color-warning-rgb' => join(',', $this->util->hexToRGB($colorWarning)),

View file

@ -98,6 +98,7 @@ class HighContrastTheme extends DefaultTheme implements ITheme {
'--color-success-text' => $this->util->darken($colorSuccess, 70),
'--color-favorite' => '#936B06',
'--color-background-selection' => 'var(--color-primary-element)',
'--color-scrollbar' => 'auto transparent',
@ -131,6 +132,9 @@ class HighContrastTheme extends DefaultTheme implements ITheme {
#app-navigation {
border-right: 1px solid var(--color-border);
}
::selection {
color: var(--color-primary-element-text);
}
";
}
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["styles.scss","variables.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAAA,GCEA;AAAA;AAAA;AAAA,GDOA,MACC,mCACA,uCAGD,yQACC,SACA,UACA,SACA,oBACA,eACA,oBACA,wBACA,eACA,uCAGD,6CACC,aAID,0CACC,wDACA,aAGD,UACC,YAEA,8BAGD,6DACC,cAGD,MACC,yBACA,iBACA,mBAGD,cACC,iBACA,mBAGD,YACC,sBAGD,EACC,SACA,6BACA,qBACA,eACA,IACC,eAIF,WACC,aACA,0BAGD,MACC,eACA,QACC,eAIF,0BACC,eAGD,KACC,mCAGD,GACC,gBAGD,KACC,mBAEA,mCACA,uCACA,6BACA,6BAGD,mBACC,kBAGD,qBACC,kBACA,sBACA,qBACA,2BACA,2DACA,uBAGD,iBACC,qBACA,aACA,oCAGD,eACC,YACA,aAGD,cACC,eACA,MACA,SACA,qBACA,YACA,WACA,aACA,kBACA,gDACA,wCACA,iBACA,eACA,kBACC,cACA,kBACA,UACA,QACA,gBAED,gBACC,wCACA,sDACA,4CACC,6CAOH,oBACC,WACA,YAGD,2BACC,+BAGD,gCACC,+BAGD,0BACC,kCACA,yCACA,+BACA,4BAMD,YACC,8CACA,wCAMD,kBACC,sBAKD,4BAEC,oCACA,kBACA,gBACA,WACA,sDACC,gBAED,sEACC,gBAED,kCACC,mBAED,oHAEC,qBACA,YACA,WACA,mBACA,gcAEC,WAOH,sBACC,WASD,oCACC,kBACA,yBACA,sBACA,qBACA,iBAID,kBAEC,kBACA,qBACA,SAEA,YAGD,8CAGC,WAGD,8BACC,sBACA,oBACA,wBACA,wBAGD,2EACC,WAGD,oGACC,kDACA,UACA,qBAGD,mDACC,6BACA,YACA,WACA,yCACA,4BACA,2BACA,WAOA,qEACC,UAED,qEACC,UAIF,wEACC,aAGD,2CACC,wBAGD,yBACC,kBACA,qBACA,sBAGD,qBACC,cACA,mBACA,iBACA,uBACA,aAKD,4CACC,eACA,YACA,mCACA,6BACA,qDAIA,2BACC,4BAKD,wBACC,sBACA,4BACA,+BACC,+CACA,qBACA,kBAGF,0BACC,qBACA,iBAIF,YACC,YACA,sCACA,oBACC,sBAIF,eACC,gDAUD,mBACC,kBACA,cACA,2BACC,kBACA,cAIF,UACC,gBAGD,8CACC,UAIA,WACC,WACA,YAGD,8CAEC,UAGD,oGAGC,WAIF,mBACC,WACA,kBACA,QAEA,kDACC,UAKD,kDACC,UAIF,eACC,WAEA,0CACC,UAKD,uGACC,8CAIF,KACC,mFAGD,OACC,gBACA,YACA,eACA,qBACA,UACC,qBAOD,qBACC,WACA,aAED,wBACC,cACA,gDACA,WACA,aAED,2BACC,WACA,YACA,6BACC,WAGF,wBACC,wCACA,kBACA,mBACA,gBACA,uBACA,0CACA,kCACA,6DACC,0CAGF,sBACC,UACA,WAKF,YACC,oBACA,YAGD,SACC,oBACA,kDACA,4BACA,iCACA,YACA,0BACA,cACA,QACA,uBACA,mBACC,QACA,kBACA,qBACC,WAIA,wFACC,cAIF,gCACC,SACA,sBACA,mCACC,iBACA,gBACA,kBACA,uBACA,+DACC,+EAGF,+CACC,aAIH,gBACC,aACA,uBACC,QAGF,yBAEC,kBACA,aACA,WACA,uBACA,mBACA,gBACA,cAEA,gBAEA,8FAGC,oBAGF,yBACC,UACA,WAGD,oBACC,iBACA,uBAEA,2BACC,uBAGF,+DACC,UAEA,0JAEC,WAOH,QACC,UACA,yCACA,sCACA,qCACA,oCACA,iCACA,oBACC,UAOD,+CACC,SACA,kBAED,mDACC,gBAKF,cACC,mBAMD,mBACC,aACA,QACA,SACA","file":"styles.css"}
{"version":3,"sourceRoot":"","sources":["styles.scss","variables.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAAA,GCEA;AAAA;AAAA;AAAA,GDOA,MACC,mCACA,uCAGD,yQACC,SACA,UACA,SACA,oBACA,eACA,oBACA,wBACA,eACA,uCAGD,6CACC,aAID,0CACC,wDACA,aAGD,UACC,YAEA,8BAGD,6DACC,cAGD,MACC,yBACA,iBACA,mBAGD,cACC,iBACA,mBAGD,YACC,sBAGD,EACC,SACA,6BACA,qBACA,eACA,IACC,eAIF,WACC,aACA,0BAGD,MACC,eACA,QACC,eAIF,0BACC,eAGD,KACC,mCAGD,GACC,gBAGD,KACC,mBAEA,mCACA,uCACA,6BACA,6BAGD,mBACC,kBAGD,qBACC,kBACA,sBACA,qBACA,2BACA,2DACA,uBAGD,iBACC,qBACA,aACA,oCAGD,eACC,YACA,aAGD,cACC,eACA,MACA,SACA,qBACA,YACA,WACA,aACA,kBACA,gDACA,wCACA,iBACA,eACA,kBACC,cACA,kBACA,UACA,QACA,gBAED,gBACC,wCACA,sDACA,4CACC,6CAOH,oBACC,WACA,YAGD,2BACC,+BAGD,gCACC,+BAGD,0BACC,kCACA,yCACA,+BACA,4BAMD,YACC,mDAMD,kBACC,sBAKD,4BAEC,oCACA,kBACA,gBACA,WACA,sDACC,gBAED,sEACC,gBAED,kCACC,mBAED,oHAEC,qBACA,YACA,WACA,mBACA,gcAEC,WAOH,sBACC,WASD,oCACC,kBACA,yBACA,sBACA,qBACA,iBAID,kBAEC,kBACA,qBACA,SAEA,YAGD,8CAGC,WAGD,8BACC,sBACA,oBACA,wBACA,wBAGD,2EACC,WAGD,oGACC,kDACA,UACA,qBAGD,mDACC,6BACA,YACA,WACA,yCACA,4BACA,2BACA,WAOA,qEACC,UAED,qEACC,UAIF,wEACC,aAGD,2CACC,wBAGD,yBACC,kBACA,qBACA,sBAGD,qBACC,cACA,mBACA,iBACA,uBACA,aAKD,4CACC,eACA,YACA,mCACA,6BACA,qDAIA,2BACC,4BAKD,wBACC,sBACA,4BACA,+BACC,+CACA,qBACA,kBAGF,0BACC,qBACA,iBAIF,YACC,YACA,sCACA,oBACC,sBAIF,eACC,gDAUD,mBACC,kBACA,cACA,2BACC,kBACA,cAIF,UACC,gBAGD,8CACC,UAIA,WACC,WACA,YAGD,8CAEC,UAGD,oGAGC,WAIF,mBACC,WACA,kBACA,QAEA,kDACC,UAKD,kDACC,UAIF,eACC,WAEA,0CACC,UAKD,uGACC,8CAIF,KACC,mFAGD,OACC,gBACA,YACA,eACA,qBACA,UACC,qBAOD,qBACC,WACA,aAED,wBACC,cACA,gDACA,WACA,aAED,2BACC,WACA,YACA,6BACC,WAGF,wBACC,wCACA,kBACA,mBACA,gBACA,uBACA,0CACA,kCACA,6DACC,0CAGF,sBACC,UACA,WAKF,YACC,oBACA,YAGD,SACC,oBACA,kDACA,4BACA,iCACA,YACA,0BACA,cACA,QACA,uBACA,mBACC,QACA,kBACA,qBACC,WAIA,wFACC,cAIF,gCACC,SACA,sBACA,mCACC,iBACA,gBACA,kBACA,uBACA,+DACC,+EAGF,+CACC,aAIH,gBACC,aACA,uBACC,QAGF,yBAEC,kBACA,aACA,WACA,uBACA,mBACA,gBACA,cAEA,gBAEA,8FAGC,oBAGF,yBACC,UACA,WAGD,oBACC,iBACA,uBAEA,2BACC,uBAGF,+DACC,UAEA,0JAEC,WAOH,QACC,UACA,yCACA,sCACA,qCACA,oCACA,iCACA,oBACC,UAOD,+CACC,SACA,kBAED,mDACC,gBAKF,cACC,mBAMD,mBACC,aACA,QACA,SACA","file":"styles.css"}

View file

@ -181,8 +181,7 @@ body {
/* SELECTION */
::selection {
background-color: var(--color-primary-element);
color: var(--color-primary-element-text);
background-color: var(--color-background-selection);
}