decor-6-expe/maquette-tests/assets/css/modules/_chapter-header.scss

.chapter-header{
    // break-after: page;
    position: relative;
        margin-top: calc(var(--baseline)*2);
    margin-bottom: calc(var(--baseline)*3);
    --color: black;

    p{ text-indent: 0px!important; }
}

.chapter-header h2 {
  string-set: title content(text);
}

.chapter-header .author {
  string-set: author content(text);
}

.chapter-header .type {
  string-set: type content(text);
}


.chapter-header .h2-pattern{
    font-size: 58px;
    line-height: 0.8;
    // font-family: var(--font);
    //   font-family: var(--mono);
    color: var(--blue);
    margin-bottom: calc(var(--baseline)*1);
    text-align: left;
    font-weight: normal;

    color: var(--color);
    text-align: center;
    font-family: var(--font-decor);

    transform: scale(2);
      z-index: 0;
        position: absolute;
  top: 0;
   

}

.chapter-header h2{
  font-family: 'Routed Gothic Wide';
  margin-top: calc(var(--baseline)*4);
  text-align: center;
    line-height: 1.2;
    font-size: 36px;
  font-weight: normal;


  span{
  background-color: white;
  border: 1px solid red;
  box-shadow: 0px 1px 23px 8px rgba(255,0,0,1);
  border-radius:10px;
  padding-inline: 0.5ch;
  box-decoration-break: clone;
-webkit-box-decoration-break: clone; /* pour Safari */
  }

  z-index: 10;
}


.chapter-header .type{
     margin-bottom: calc(var(--baseline)*1);
     display: none;
    //  text-align: center;
}

.chapter-header .type{

}


.chapter-header .author{
     font-family: 'Routed Gothic Wide';
  margin-top: calc(var(--baseline)*1);
  text-align: center;
  font-size: 28px;
  font-weight: normal;
  // margin-top: calc(var(--baseline)*2)
}