More theme changes

This commit is contained in:
Eduard Kuzmenko 2023-01-28 18:11:39 +04:00
parent 773c2202ce
commit 69df832cd1
5 changed files with 38 additions and 5 deletions

View File

@ -221,7 +221,11 @@ export default class Chat extends EventListenerBase<{
if(patternRenderer) { if(patternRenderer) {
const setOpacityTo = isDarkPattern ? gradientCanvas : patternCanvas; const setOpacityTo = isDarkPattern ? gradientCanvas : patternCanvas;
setOpacityTo.style.setProperty('--opacity-max', '' + (Math.abs(intensity) * (isDarkPattern ? .5 : 1))); let opacityMax = Math.abs(intensity) * (isDarkPattern ? .5 : 1);
if(isDarkPattern) {
opacityMax = Math.max(0.3, opacityMax);
}
setOpacityTo.style.setProperty('--opacity-max', '' + opacityMax);
} }
const promise = new Promise<void>((resolve) => { const promise = new Promise<void>((resolve) => {

View File

@ -356,13 +356,23 @@ export default class AppGeneralSettingsTab extends SliderSuperTabEventable {
lastActive.classList.remove('active'); lastActive.classList.remove('active');
} }
let active: HTMLElement;
themesMap.forEach((item) => { themesMap.forEach((item) => {
applyThemeOnItem(item); applyThemeOnItem(item);
if(item.theme.id === currentTheme.id) { if(item.theme.id === currentTheme.id) {
item.container.classList.add('active'); item.container.classList.add('active');
active = item.container;
} }
}); });
if(active) {
scrollable.scrollIntoViewNew({
element: active,
position: 'center',
axis: 'x'
});
}
}); });
form.append(dayRow.container, nightRow.container, systemRow.container); form.append(dayRow.container, nightRow.container, systemRow.container);

View File

@ -13,7 +13,8 @@ import {changeColorAccent, ColorRgb, getAccentColor, getAverageColor, getHexColo
type AppColorName = 'primary-color' | 'message-out-primary-color' | type AppColorName = 'primary-color' | 'message-out-primary-color' |
'surface-color' | 'danger-color' | 'primary-text-color' | 'surface-color' | 'danger-color' | 'primary-text-color' |
'secondary-text-color' | 'message-out-background-color'; 'secondary-text-color' | 'message-out-background-color' |
'saved-color';
type AppColor = { type AppColor = {
rgb?: boolean, rgb?: boolean,
light?: boolean, light?: boolean,
@ -53,6 +54,9 @@ const appColorMap: {[name in AppColorName]: AppColor} = {
lightFilled: true, lightFilled: true,
dark: true, dark: true,
darkFilled: true darkFilled: true
},
'saved-color': {
lightFilled: true
} }
}; };
@ -67,7 +71,8 @@ const colorMap: {
'surface-color': '#ffffff', 'surface-color': '#ffffff',
'danger-color': '#df3f40', 'danger-color': '#df3f40',
'primary-text-color': '#000000', 'primary-text-color': '#000000',
'secondary-text-color': '#707579' 'secondary-text-color': '#707579',
'saved-color': '#359AD4'
}, },
night: { night: {
'primary-color': '#8774E1', 'primary-color': '#8774E1',
@ -75,7 +80,8 @@ const colorMap: {
'surface-color': '#212121', 'surface-color': '#212121',
'danger-color': '#ff595a', 'danger-color': '#ff595a',
'primary-text-color': '#ffffff', 'primary-text-color': '#ffffff',
'secondary-text-color': '#aaaaaa' 'secondary-text-color': '#aaaaaa',
'saved-color': '#8774E1'
} }
}; };
@ -284,6 +290,13 @@ export class ThemeController {
darkenAlpha: 0.04 darkenAlpha: 0.04
}); });
applyAppColor({
name: 'saved-color',
hex: newAccentHex,
lightenAlpha: 0.64,
mixColor: [255, 255, 255]
})
if(!themeSettings.message_colors?.length) { if(!themeSettings.message_colors?.length) {
return; return;
} }

View File

@ -34,6 +34,7 @@
position: relative; position: relative;
display: flex; display: flex;
justify-content: center; justify-content: center;
cursor: pointer;
// transform: scale(1); // transform: scale(1);
// @include animation-level(2) { // @include animation-level(2) {
@ -81,6 +82,7 @@
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: inherit; border-radius: inherit;
pointer-events: none;
} }
} }
@ -108,6 +110,7 @@
border-radius: 1.75rem; border-radius: 1.75rem;
background-color: #fff; background-color: #fff;
position: absolute; position: absolute;
pointer-events: none;
&.is-out { &.is-out {
top: .5rem; top: .5rem;

View File

@ -143,9 +143,12 @@ $chat-input-inner-padding-handhelds: .25rem;
@include avatar-color("cyan", #53edd6, #28c9b7); @include avatar-color("cyan", #53edd6, #28c9b7);
@include avatar-color("blue", #5BCBE3, #359AD4); @include avatar-color("blue", #5BCBE3, #359AD4);
@include avatar-color("pink", #FF8AAC, #D95574); @include avatar-color("pink", #FF8AAC, #D95574);
@include avatar-color("saved", #69BFFA, #3D9DE0); // @include avatar-color("saved", #69BFFA, #3D9DE0);
@include avatar-color("archive", #B8C2CC, #9EAAB5); @include avatar-color("archive", #B8C2CC, #9EAAB5);
--peer-avatar-saved-top: var(--light-filled-saved-color);
--peer-avatar-saved-bottom: var(--saved-color);
--avatar-color-top: var(--peer-avatar-saved-top); --avatar-color-top: var(--peer-avatar-saved-top);
--avatar-color-bottom: var(--peer-avatar-saved-bottom); --avatar-color-bottom: var(--peer-avatar-saved-bottom);
--avatar-border-radius-forum: 37%; --avatar-border-radius-forum: 37%;