Here is my website: https://personal-website-1ss.pages.dev/ If you go to the bottom of the page you can see the margin at the bottom is still white even in dark mode. This can be changed when you change the background color of the html tag. The html tag is only available in src/app.html which does not know if my site is in dark mode or not and I need a way to change the background color of the html tag through src/routes/index.svelte or src/app.ts. Here is the github: https://github.com/CloudyWhale/personal-website

CodePudding user response：

You could just avoid the margin; there are multiple options.

• Use a padding instead of margin on #fw-container.
• Prevent margin collapse from happening by setting e.g. a 1px padding-bottom on the main element.

You could also use a global style and just change the color that way.

:root {
  --bg: theme(...);
}
:root.dark {
  --bg: theme(...);
}

html {
  background-color: var(--bg);
}

See this question about accessing tailwind colors in CSS.