refactor: migrate global styles to injectGlobalStyles

This commit is contained in:
divocat
2025-10-03 03:52:12 +03:00
parent eb0617eef1
commit db8e8e8298
5 changed files with 82 additions and 28 deletions

View File

@@ -1,2 +1,3 @@
export * from './getBaseUrl';
export * from './parseValueList';
export * from './injectGlobalStyles';

View File

@@ -0,0 +1,12 @@
import { GlobalStyles } from '../styles';
export function injectGlobalStyles() {
document.head.insertAdjacentHTML(
'beforeend',
`
<style>
${GlobalStyles}
</style>
`,
);
}

View File

@@ -0,0 +1,26 @@
// language=CSS
export const GlobalStyles = `
.cbi-value {
margin-bottom: 10px !important;
}
#diagnostics-status .table > div {
background: var(--background-color-primary);
border: 1px solid var(--border-color-medium);
border-radius: var(--border-radius);
}
#diagnostics-status .table > div pre,
#diagnostics-status .table > div div[style*="monospace"] {
color: var(--color-text-primary);
}
#diagnostics-status .alert-message {
background: var(--background-color-primary);
border-color: var(--border-color-medium);
}
#cbi-podkop:has(.cbi-tab-disabled[data-tab="basic"]) #cbi-podkop-extra {
display: none;
}
`;

View File

@@ -288,6 +288,45 @@ function parseValueList(value) {
return value.split(/\n/).map((line) => line.split("//")[0]).join(" ").split(/[,\s]+/).map((s) => s.trim()).filter(Boolean);
}
// src/styles.ts
var GlobalStyles = `
.cbi-value {
margin-bottom: 10px !important;
}
#diagnostics-status .table > div {
background: var(--background-color-primary);
border: 1px solid var(--border-color-medium);
border-radius: var(--border-radius);
}
#diagnostics-status .table > div pre,
#diagnostics-status .table > div div[style*="monospace"] {
color: var(--color-text-primary);
}
#diagnostics-status .alert-message {
background: var(--background-color-primary);
border-color: var(--border-color-medium);
}
#cbi-podkop:has(.cbi-tab-disabled[data-tab="basic"]) #cbi-podkop-extra {
display: none;
}
`;
// src/helpers/injectGlobalStyles.ts
function injectGlobalStyles() {
document.head.insertAdjacentHTML(
"beforeend",
`
<style>
${GlobalStyles}
</style>
`
);
}
// src/constants.ts
var STATUS_COLORS = {
SUCCESS: "#4caf50",
@@ -417,6 +456,7 @@ return baseclass.extend({
UPDATE_INTERVAL_OPTIONS,
bulkValidate,
getBaseUrl,
injectGlobalStyles,
parseValueList,
validateDNS,
validateDomain,

View File

@@ -6,36 +6,11 @@
'require view.podkop.diagnosticTab as diagnosticTab';
'require view.podkop.additionalTab as additionalTab';
'require view.podkop.utils as utils';
'require view.podkop.main as main';
return view.extend({
async render() {
document.head.insertAdjacentHTML('beforeend', `
<style>
.cbi-value {
margin-bottom: 10px !important;
}
#diagnostics-status .table > div {
background: var(--background-color-primary);
border: 1px solid var(--border-color-medium);
border-radius: var(--border-radius);
}
#diagnostics-status .table > div pre,
#diagnostics-status .table > div div[style*="monospace"] {
color: var(--color-text-primary);
}
#diagnostics-status .alert-message {
background: var(--background-color-primary);
border-color: var(--border-color-medium);
}
#cbi-podkop:has(.cbi-tab-disabled[data-tab="basic"]) #cbi-podkop-extra {
display: none;
}
</style>
`);
main.injectGlobalStyles();
const m = new form.Map('podkop', '', null, ['main', 'extra']);
@@ -90,4 +65,4 @@ return view.extend({
return map_promise;
}
});
});