Amandine Alonso

Poirot Investigate, Agatha Christie

Code HTML/CSS

<syntaxhightlight lang="css">

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;800&family=Cormorant+Garamond:ital,wght@0,300;0,700;1,400&family=Mochiy+Pop+P+One&family=Philosopher:ital@0;1&family=Zen+Antique&display=swap');

body,html {

font-size: 10pt; text-align: left; font-family: 'Cormorant Garamond', serif; color: black; line-height: 4mm; }

/*#autrice { font-family: 'Cormorant Garamond'; color:white; font-size:10pt; text-align: left; }*/

1. colofon{

font-family: 'Cormorant Garamond', italic; font-size: 10pt; text-align: center; break-before: page; margin-top: 170mm; line-height: 4mm; margin-left: 10mm; color: black; }

1. contents2{

   font-size:15pt;
   
   }
   

1. TITRE {

  font-family: 'Cormorant Garamond', serif;
  font-weight: bold;
   font-size:30pt;
   color: white; 
   text-align:left;
   line-height: 9mm;
   
   }

@page {

background: linear-gradient(to right , rgba(0, 100,90, 0.5)  0%, rgba (0, 100,90,1)  100%);  
 

size:110mm 210mm; margin-left:5mm; margin-right:5mm; margin-bottom: 10mm; margin-top:10mm; border: width style color;

   @left-middle{
    
   transform: rotate(-90deg);

   }
 

}

@page:left{ background: white; margin-left: 5mm; margin-right: 15mm;

@bottom-left-corner {

   content: counter(page);

   margin-left: 5mm;
   color: black;
   }
   

       
   
   

}

@page:right{

   text-align: right;

margin-left:15mm; margin-right:5mm;

background: white;

  @bottom-right-corner {
   content: counter(page);

   margin-right: 5mm;
   color: black;
   }
   #rectangle {
       color: black;
       witdht:20mm;
       height: 190mm;
       }

}

1. rectangle {

   margin-left: 40mm;
   

width: 20mm; height: 20mm; border: 3mm solid black; position: absolute; break-before: right; margin-left: -10mm; box-shadow: 10px 8px 10px black;

    }
   

h1 {

   font-size: 20pt;

text-align:left;

   font-weight: normal;

color:red; }

1. titlepagemedium {

font-size: 40pt;

text-align: left; color:black; margin-top: 110mm; margin-left:-5mm; position:absolute;

}

1. CH1{

   text-align: center;
   margin-left: -5mm;

font-family: 'Cormorant Garamond',

   font-size: 20pt;
   color: black;

position: absolute;

   }
   

1. CH2 {

     text-align: center;
   margin-left: -5mm;

font-family: 'Cormorant Garamond',

    font-size: 15pt;
   color: black;

position: absolute;

   }  
   

1. CH3 {

        text-align: center;
   margin-left: -5mm;

font-family: 'Cormorant Garamond',

    font-size: 15pt;
   color: black;

position: absolute;

   }  
   

1. CH4 {

        text-align: center;
   margin-left: -5mm;

font-family: 'Cormorant Garamond',

    font-size: 15pt;
   color: black;

position: absolute; }

1. CH5 {

         text-align: center;
   margin-left: -5mm;

font-family: 'Cormorant Garamond',

    font-size: 15pt;
   color: black;

position: absolute; }

1. CH6 {

         text-align: center;
   margin-left: -5mm;

font-family: 'Cormorant Garamond',

    font-size: 15pt;
   color: black;

position: absolute; }

1. CH7 {

         text-align: center;
   margin-left: -5mm;

font-family: 'Cormorant Garamond',

    font-size: 15pt;
   color: black;

position: absolute; }

1. CH8 {

        text-align: center;
   margin-left: -5mm;

font-family: 'Cormorant Garamond',

    font-size: 15pt;
   color: black;

position: absolute; }

1. CH9 {

   text-align: center;
   margin-left: -5mm;

font-family: 'Cormorant Garamond',

    font-size: 15pt;
   color: black;

position: absolute; }

1. CH10 {

   text-align: center;
   margin-left: -5mm;

font-family: 'Cormorant Garamond',

    font-size: 15pt;
   color: black;

position: absolute; }

1. CH11 {

   text-align: center;
   margin-left: -5mm;

font-family: 'Cormorant Garamond',

    font-size: 15pt;
   color: black;

position: absolute; } div.contents2 {

   margin-top: 20mm;
   text-align: left; 
   font-size: 15pt; 
   font-family: 'Cormorant Garamond',
   font-weight: bold;
   color: white;
   line-height: 10mm;
   position: absolute;
   text-decoration : none;
   
   } 
   

1. TOC{

   text-align: center;
   margin-left; -10mm;
   font-size: 30pt;
   font-weight: normal;

font-family: 'Cormorant Garamond', serif; font-weight: bold;

   font-weight: normal;

color:black;

}

h3 { font-size: 30pt;

   font-weight: bold;

font-family: 'Philosopher';

   font-weight: normal;

color:white; color:pink;

}

i{

   margin-top: 30mm;
   font-family: 'Cormorant Garamond', Extra-bold;

font-size:30pt; color: black; line-height: 5mm;

}

div.dots {

   font-size: 30pt;
   text-shadow: 4px 2px 4px black;
   
   }

div.chtitle {

margin-top:170mm;

font-size: 30pt; font-family: 'Cormorant Garamond', serif;

color: black; text-align: left; line-height: 12mm;

break-after : page; position: absolute;

/* border-width:1px 2px 3px 2px;

border-style:solid ;
border-color:white;
padding:100px;*/

} @page : chtitle {

     background: black;
   }
   

@page :first { background:black;

   @right-middle {
       visibility: hidden;
   }
   @top-center {
       visibility: hidden;
   }
   @top-right-corner {
       visibility: hidden;
   }
     @bottom-right-corner {
        visibility: hidden; }

@top-left-corner {

       visibility: hidden;

}

}

@page {

/*background: linear-gradient(to right , rgba(0, 100,90, 0.5)  0%, rgba (0, 100,90,1)  100%);  */

size:110mm 210mm; margin-left:5mm; margin-right:5mm; margin-bottom: 10mm; margin-top:10mm; border: width style color;

@left-middle{
    
   transform: rotate(-90deg);


   }

   @top-center {
   content: "The Poirot Investigate";
   text-size:9pt;
   margin-left: -5mm;
   color: white;
   }
/*   @bottom-right-corner {
   content: counter(page);
   color: white;
   
   padding-right: 8ch;
   }*/

}

• /

</syntaxhighlight>