.home-content-container {
  background var(--background-color-1)

  if (hexo-config('home') && hexo-config('home.announcement')) {
    .website-announcement {
      keep-container(var(--home-post-hover-scale), 1rem, 1.8rem)
      display flex
      align-items center
      justify-content space-between
      margin-top -0.6rem

      +keep-tablet() {
        margin-top -0.4rem
      }


      +keep-mobile() {
        margin-top -0.2rem

        .announcement {
          font-size 0.9rem
        }

        .icon {
          font-size 1rem !important
        }
      }


      .announcement {
        width 100%
        padding 0 0.5rem
        color var(--text-color-3)

        p {
          width 100%
          overflow hidden
          white-space nowrap
          text-overflow ellipsis
        }
      }


      .icon {
        flex-shrink 0
        padding 0.2rem
        font-size 1.2rem

        &.left {
          color var(--keep-danger-color)
          font-size 1.5rem
          transform-origin left bottom
          animation shake 1s ease infinite
        }

        &.right {
          color var(--text-color-4)
          cursor pointer

          &:hover {
            color var(--text-color-3)
          }
        }
      }
    }
  }

  .home-post-list {

    .home-post-item {
      position relative

      keep-container(var(--home-post-hover-scale), 0, 2.8rem)

      .post-sticky-box {
        position absolute
        z-index $z-index-1
        display flex
        align-items center
        box-sizing border-box
        padding 0.1rem 0.4rem
        color var(--text-color-4)
        font-size 12px
        letter-spacing 1px
        background var(--background-color-3)
        border-radius 0.3rem
        transform scale(0.86)
        cursor default
        disable-user-select()

        &.cover-offset {
          top 0.6rem
          right 0.6rem
        }

        &.card-offset {
          top 0.8rem
          right 0.8rem
        }

        +keep-mobile() {
          padding 0
          background none
          transform rotate(45deg)

          .sticky-name {
            display none
          }
        }
      }


      .home-post-item-top {
        width 100%
        overflow hidden
        background-color var(--background-color-2)
        border-top-left-radius var(--box-border-radius)
        border-top-right-radius var(--box-border-radius)

        +keep-mobile() {
          height 8rem !important
        }

        .home-cover {
          width 100%
          height 100%
          object-fit cover
          transform-origin center center
          transition-t("transform", "0", "1", "linear")

          &:hover {
            transform scale(1.03)
          }
        }
      }


      .home-post-item-bottom {
        padding 2rem

        .sticky-icon {
          position absolute
          top 1.2rem
          right 1.2rem
          color var(--text-color-4)
          font-size 1.2rem
          transform rotate(45deg)
        }


        .home-post-title {
          margin 0
          color var(--text-color-2)
          font-weight 600
          font-size 1.4rem
          line-height 1.5


          +keep-tablet() {
            font-size 1.3rem
          }


          +keep-mobile() {
            font-size 1.2rem
          }
        }


        .home-post-content {
          margin 1.8rem 0
          color var(--text-color-3)
          text-align justify
          word-wrap break-word
        }
      }
    }
  }
}
