Merge branch 'develop' into sw-notification-action
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
import { Ref, ref } from 'vue';
|
||||
import * as getCaretCoordinates from 'textarea-caret';
|
||||
import { toASCII } from 'punycode';
|
||||
import { toASCII } from 'punycode/';
|
||||
import { popup } from '@client/os';
|
||||
|
||||
export class Autocomplete {
|
||||
|
@@ -1,40 +1,45 @@
|
||||
export class StickySidebar {
|
||||
private lastScrollTop = 0;
|
||||
private container: HTMLElement;
|
||||
private el: HTMLElement;
|
||||
private spacer: HTMLElement;
|
||||
private marginTop: number;
|
||||
private isTop = false;
|
||||
private isBottom = false;
|
||||
private offsetTop: number;
|
||||
|
||||
constructor(el: StickySidebar['el'], spacer: StickySidebar['spacer'], marginTop = 0) {
|
||||
this.el = el;
|
||||
this.spacer = spacer;
|
||||
constructor(container: StickySidebar['container'], marginTop = 0) {
|
||||
this.container = container;
|
||||
this.el = this.container.children[0] as HTMLElement;
|
||||
this.el.style.position = 'sticky';
|
||||
this.spacer = document.createElement('div');
|
||||
this.container.prepend(this.spacer);
|
||||
this.marginTop = marginTop;
|
||||
this.offsetTop = this.container.getBoundingClientRect().top;
|
||||
}
|
||||
|
||||
public calc(scrollTop: number) {
|
||||
if (scrollTop > this.lastScrollTop) { // downscroll
|
||||
const overflow = this.el.clientHeight - window.innerHeight;
|
||||
const overflow = Math.max(0, (this.el.clientHeight + this.marginTop) - window.innerHeight);
|
||||
this.el.style.bottom = null;
|
||||
this.el.style.top = `${-overflow}px`;
|
||||
this.el.style.top = `${-overflow + this.marginTop}px`;
|
||||
|
||||
this.isBottom = (scrollTop + window.innerHeight) >= (this.el.offsetTop + this.el.clientHeight);
|
||||
|
||||
if (this.isTop) {
|
||||
this.isTop = false;
|
||||
this.spacer.style.marginTop = `${this.lastScrollTop}px`;
|
||||
this.spacer.style.marginTop = `${Math.max(0, this.lastScrollTop + this.marginTop - this.offsetTop)}px`;
|
||||
}
|
||||
} else { // upscroll
|
||||
const overflow = this.el.clientHeight - window.innerHeight;
|
||||
const overflow = (this.el.clientHeight + this.marginTop) - window.innerHeight;
|
||||
this.el.style.top = null;
|
||||
this.el.style.bottom = `${-overflow - this.marginTop}px`;
|
||||
this.el.style.bottom = `${-overflow}px`;
|
||||
|
||||
this.isTop = scrollTop <= this.el.offsetTop;
|
||||
|
||||
if (this.isBottom) {
|
||||
this.isBottom = false;
|
||||
const overflow = this.el.clientHeight - window.innerHeight;
|
||||
this.spacer.style.marginTop = `${this.lastScrollTop - (overflow + this.marginTop)}px`;
|
||||
this.spacer.style.marginTop = `${this.lastScrollTop + this.marginTop - this.offsetTop - overflow}px`;
|
||||
}
|
||||
}
|
||||
|
||||
|
@@ -9,18 +9,19 @@ export type Theme = {
|
||||
props: Record<string, string>;
|
||||
};
|
||||
|
||||
export const lightTheme: Theme = require('../themes/_light.json5');
|
||||
export const darkTheme: Theme = require('../themes/_dark.json5');
|
||||
export const lightTheme: Theme = require('@client/themes/_light.json5');
|
||||
export const darkTheme: Theme = require('@client/themes/_dark.json5');
|
||||
|
||||
export const themeProps = Object.keys(lightTheme.props).filter(key => !key.startsWith('X'));
|
||||
|
||||
export const builtinThemes = [
|
||||
require('../themes/l-light.json5'),
|
||||
require('../themes/l-apricot.json5'),
|
||||
require('@client/themes/l-light.json5'),
|
||||
require('@client/themes/l-apricot.json5'),
|
||||
require('@client/themes/l-rainy.json5'),
|
||||
|
||||
require('../themes/d-dark.json5'),
|
||||
require('../themes/d-persimmon.json5'),
|
||||
require('../themes/d-black.json5'),
|
||||
require('@client/themes/d-dark.json5'),
|
||||
require('@client/themes/d-persimmon.json5'),
|
||||
require('@client/themes/d-black.json5'),
|
||||
] as Theme[];
|
||||
|
||||
let timeout = null;
|
||||
@@ -28,10 +29,10 @@ let timeout = null;
|
||||
export function applyTheme(theme: Theme, persist = true) {
|
||||
if (timeout) clearTimeout(timeout);
|
||||
|
||||
document.documentElement.classList.add('changing-theme');
|
||||
document.documentElement.classList.add('_themeChanging_');
|
||||
|
||||
timeout = setTimeout(() => {
|
||||
document.documentElement.classList.remove('changing-theme');
|
||||
document.documentElement.classList.remove('_themeChanging_');
|
||||
}, 1000);
|
||||
|
||||
// Deep copy
|
||||
|
Reference in New Issue
Block a user