dees-domtools/ts/domtools.elementbasic.ts

60 lines
1.3 KiB
TypeScript
Raw Permalink Normal View History

2022-03-16 12:39:50 +00:00
import * as plugins from './domtools.plugins.js';
2022-04-21 20:53:58 +00:00
import { DomTools, IDomToolsContructorOptions } from './domtools.classes.domtools.js';
2022-03-16 12:39:50 +00:00
import { scrollBarStyles, globalBaseStyles } from './domtools.css.basestyles.js';
2020-05-25 15:57:47 +00:00
2021-11-26 15:21:11 +00:00
import { html, LitElement, css, unsafeCSS } from 'lit';
2021-03-28 21:51:11 +00:00
export const staticStyles = css`
* {
transition: background 0.1s, color 0.1s;
box-sizing: border-box;
}
:host {
2021-12-13 22:18:06 +00:00
box-sizing: border-box;
2023-01-03 16:02:40 +00:00
font-family: 'Inter', sans-serif;
2021-03-28 21:51:11 +00:00
}
${unsafeCSS(scrollBarStyles)}
`;
2020-09-13 14:57:30 +00:00
/**
* styles to be included in every webcomponent
*/
2020-09-13 15:53:30 +00:00
export const styles = html`
2020-05-25 15:57:47 +00:00
<style>
* {
2020-11-25 15:14:48 +00:00
transition: background 0.1s, color 0.1s;
2020-05-25 15:57:47 +00:00
box-sizing: border-box;
}
2020-09-13 14:57:30 +00:00
2021-03-10 16:57:25 +00:00
:host {
2023-01-03 16:02:40 +00:00
font-family: 'Inter', sans-serif;
2021-03-10 16:57:25 +00:00
}
2020-09-13 14:57:30 +00:00
${scrollBarStyles}
2020-05-25 15:57:47 +00:00
</style>
`;
/**
* a basic setup for elements
* makes sure everything is in check
*/
2023-05-07 18:56:08 +00:00
export const setup = async (
elementArg?: LitElement,
optionsArg: IDomToolsContructorOptions = {}
): Promise<DomTools> => {
2022-04-21 20:53:58 +00:00
const domTools = await DomTools.setupDomTools(optionsArg);
2020-11-23 20:41:26 +00:00
if (elementArg) {
2020-12-07 03:13:34 +00:00
// lets do something with the element
// not used right now
2020-11-23 20:41:26 +00:00
}
2020-05-25 15:57:47 +00:00
domTools.runOnce('elementBasicSetup', async () => {
// bodyStyles
2021-11-26 15:21:11 +00:00
domTools.setGlobalStyles(globalBaseStyles);
2020-05-25 15:57:47 +00:00
});
2020-11-21 16:50:13 +00:00
return domTools;
2020-05-25 15:57:47 +00:00
};