hugo-JuiceBar icon indicating copy to clipboard operation
hugo-JuiceBar copied to clipboard

How do I add a background image??

Open GitHubQueenn opened this issue 11 months ago • 0 comments

I've tried going into the index.html file and adding

<style>
body {
  background-image: url('img.png');
}
</style>

I've tried following https://discourse.gohugo.io/t/background-image-how-to/38539/8?u=4e5rhwrt (@jmooring) but it didn't work for my theme. I can't figure this out. Have spent 4hrs on it so far. Please help.

On my site's forums, the CSS is:

html {
  body {
    background: linear-gradient(
        0deg,
        rgba(var(--primary-rgb), 0.075) 0%,
        rgba(var(--primary-rgb), 0.075) 100%
      ),
      linear-gradient(0deg, var(--secondary) 100%, var(--secondary) 100%);
  }
  .background-container {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    background: linear-gradient(
      90deg,
      var(--tertiary-hover) 0%,
      var(--tertiary) 100%
    );
    clip-path: ellipse(148% 70% at 91% -14%);
  }
}

and the header.html is: <div class="background-container"></div> but that won't work either when I add to CSS files in the theme. The above CSS & HTML on my forums gives a nice: https://i.imgur.com/gOJ5NND.png

GitHubQueenn avatar Mar 28 '24 02:03 GitHubQueenn