mirror of
https://github.com/itdoginfo/podkop.git
synced 2025-12-06 11:36:50 +03:00
refactor: migrate global styles to injectGlobalStyles
This commit is contained in:
@@ -1,2 +1,3 @@
|
||||
export * from './getBaseUrl';
|
||||
export * from './parseValueList';
|
||||
export * from './injectGlobalStyles';
|
||||
|
||||
12
fe-app-podkop/src/helpers/injectGlobalStyles.ts
Normal file
12
fe-app-podkop/src/helpers/injectGlobalStyles.ts
Normal file
@@ -0,0 +1,12 @@
|
||||
import { GlobalStyles } from '../styles';
|
||||
|
||||
export function injectGlobalStyles() {
|
||||
document.head.insertAdjacentHTML(
|
||||
'beforeend',
|
||||
`
|
||||
<style>
|
||||
${GlobalStyles}
|
||||
</style>
|
||||
`,
|
||||
);
|
||||
}
|
||||
26
fe-app-podkop/src/styles.ts
Normal file
26
fe-app-podkop/src/styles.ts
Normal 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;
|
||||
}
|
||||
`;
|
||||
@@ -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,
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user