More theme changes
This commit is contained in:
parent
773c2202ce
commit
69df832cd1
|
@ -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) => {
|
||||||
|
|
|
@ -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);
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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%;
|
||||||
|
|
Loading…
Reference in New Issue
Block a user