style: new theme,layout tweaks etc.

This commit is contained in:
2025-04-08 02:10:06 +08:00
parent 35378d17d0
commit 58f7f09fbd
6 changed files with 91 additions and 49 deletions

View File

@@ -7,7 +7,7 @@ import { createElement } from '../utils/utils';
class WelcomeWidget extends Widget {
render(): HTMLElement {
const widgetDiv = createElement('div');
widgetDiv.classList.add('widget');
widgetDiv.classList.add('widget', 'welcome-widget');
widgetDiv.innerHTML = `
<div class="widget-header">Welcome to the Dashboard</div>
<div class="widget-body">
@@ -21,7 +21,7 @@ class WelcomeWidget extends Widget {
class QuickLinksWidget extends Widget {
render(): HTMLElement {
const widgetDiv = createElement('div');
widgetDiv.classList.add('widget');
widgetDiv.classList.add('widget', 'quick-links-widget');
widgetDiv.innerHTML = `
<div class="widget-header">Quick Links</div>
<div class="widget-body">
@@ -36,21 +36,20 @@ class QuickLinksWidget extends Widget {
}
}
class PlaceholderWidget extends Widget { // Corrected placeholder widget definition
class PlaceholderWidget extends Widget {
render(): HTMLElement {
const div = createElement('div');
div.classList.add('widget');
div.classList.add('widget', 'placeholder-widget');
div.textContent = 'Placeholder Widget';
return div;
}
}
export const renderDashboardPage = () => {
const layout = new ThreeColumnLayout();
const welcomeWidget = new WelcomeWidget();
const quickLinksWidget = new QuickLinksWidget();
const placeholderWidget = new PlaceholderWidget(); // Use the corrected PlaceholderWidget class
const placeholderWidget = new PlaceholderWidget();
layout.setColumn1Content(welcomeWidget.render());
layout.setColumn2Content(quickLinksWidget.render());