Template edits are not reflecting in the code build

Using Themes
1

Hi Team,

I am trying to using LoveIt theme (GitHub - dillonzq/LoveIt: ❤️A clean, elegant but advanced blog theme for Hugo 一个简洁、优雅且高效的 Hugo 主题)

I am trying to edit the scss in LoveIt theme folder: assets\css_page\home.scss, changed width from 8rem to 12rem;

      img {
        display: inline-block;
        width: 12rem;
        height: auto;
        margin: 0 auto;
        @include border-radius(100%);
        @include box-shadow(0 0 0 .3618em rgba(0, 0, 0, .05));
        @include transition(all 0.4s ease);

But after the build using:
hugo server --renderToDisk --noHTTPCache

We are seeing in the \public\css\style.min.css it sill being set to old 8rem

.home .home-profile .home-avatar img {
    display: inline-block;
    width: 8rem;
    height: auto;
    margin: 0 auto;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    -webkit-box-shadow: 0 0 0 0.3618em rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 0 0.3618em rgba(0, 0, 0, 0.05);
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
  }

hugo-error
hugo-error1270×492 109 KB

2

I assume your intention is to resize the avatar image:

following the docs I added assets/css/_custom.css with the following content

.home {
  .home-profile {
    .home-avatar {
      img {
        width: 30rem;
      }
    }
  }
}

The home page avatar is resized.

  • the theme is just cloned (no submodule)
  • use the example site to test this
  • my developer console also shows a little different:
    • the 8rm is strikethrough
    • the update to 30 does not change that value either

guess there’s a rendering pipeline doing some magic.