decor-6-expe/maquette-tests/assets/css/base/_layout.scss

@mixin running(){
  font-family: var(--mono);
  font-size: 12px;
  // vertical-align: bottom;
  // padding-bottom: 5mm;
}


@mixin numPage(){
  font-family: var(--sans);
  font-size: 20px;
  vertical-align: bottom;
  padding-bottom: 5mm;
  width: 10mm;

}




@media print{
  
  @page {
    size: 165mm 240mm;
    margin-top: 16mm;
    margin-bottom: 20mm;
    bleed: 6mm;
    marks: crop;
   
  }

  @page:left{
    margin-left: 26mm;
    margin-right: 18mm;
     @bottom-center{
      content: counter(page);
      @include numPage();
       
   
    }
     @top-left {
      content: string(author);
      @include running();
      // text-align: left;
      // padding-left: 3ch;
    }
     @top-center {
    content: string(type);
    @include running();
  }
  }

  @page:right{
    margin-left: 18mm;
    margin-right: 26mm;
     @bottom-center{
      content: counter(page);
      @include numPage();
        text-align: right;
  
    }
     @top-left {
      content: string(title);
      @include running();
    }
  }

  /*p{
    background: salmon;
  }*/

  .chapter{
    break-before: right;
    page: chapter;
  }


  @page chapter:first{
    @top-left{ content: none; }

  }
}


// .pagedjs_left_page .pagedjs_pagebox{

//   background: linear-gradient(180deg, transparent 82%, #00009B 100%)!important;

// }

// .pagedjs_right_page .pagedjs_pagebox{

//   background: linear-gradient(180deg, transparent 82%, #00009B 100%)!important;

// }