Compare commits
9 commits
610bee465c
...
a7f45c1ed6
| Author | SHA1 | Date | |
|---|---|---|---|
|
a7f45c1ed6 | ||
|
|
eaf77e8975 | ||
|
|
672553f3aa | ||
|
|
2df3106031 | ||
|
|
3ea41b5cf0 | ||
|
|
5f4783f0b6 | ||
|
|
6d122fcf0c | ||
|
|
002b77b37a | ||
|
|
90aa3babd6 |
18 changed files with 602 additions and 148 deletions
|
|
@ -70,10 +70,17 @@ button:disabled{
|
|||
line-height: 1;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
svg{
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
position: relative;
|
||||
top: -1px;
|
||||
}
|
||||
a{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 1ch;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0 2ch;
|
||||
|
|
@ -83,11 +90,13 @@ button:disabled{
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 1ch;
|
||||
padding: 0 2ch;
|
||||
padding-top: 4px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -95,29 +104,33 @@ button:disabled{
|
|||
.btn--bold{
|
||||
background-color: var(--color-txt);
|
||||
color: var(--color-bg);
|
||||
svg{ fill: var(--color-bg); }
|
||||
&:hover{
|
||||
background-color: var(--color-accent);
|
||||
border-color: var(--color-accent);
|
||||
a{
|
||||
color: var(--color-bg);
|
||||
}
|
||||
svg{ fill: var(--color-bg); }
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.btn--bold-inline{
|
||||
background-color: var(--color-bg);
|
||||
}
|
||||
|
||||
.btn--bold-inline:hover{
|
||||
svg{ fill: var(--color-txt); }
|
||||
&:hover{
|
||||
background-color: var(--grey-800);
|
||||
color: var(--color-txt);
|
||||
a{
|
||||
background-color: var(--grey-800);
|
||||
color: var(--color-txt);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.btn--light{
|
||||
border: var(--border-light);
|
||||
}
|
||||
|
|
@ -151,7 +164,6 @@ button:disabled{
|
|||
|
||||
cursor: pointer;
|
||||
|
||||
|
||||
.icon, .txt{ z-index: 10; }
|
||||
|
||||
.icon{
|
||||
|
|
|
|||
|
|
@ -1,14 +1,25 @@
|
|||
#hero{
|
||||
width: calc(100vw - var(--padding-body)*4);
|
||||
position: relative;
|
||||
left: calc(var(--padding-body)*1);
|
||||
|
||||
@media #{$medium}{
|
||||
width: calc(100vw - var(--padding-body)*2);
|
||||
position: relative;
|
||||
left: 0;
|
||||
|
||||
.page-title-small{
|
||||
color: var(--color-txt-light);
|
||||
font-size: var(--fs-small);
|
||||
top: calc(var(--spacing)*0.25);
|
||||
right: calc(var(--spacing)*0.25);
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
z-index: 200;
|
||||
}
|
||||
|
||||
|
||||
// @media #{$medium}{
|
||||
// width: calc(100vw - var(--padding-body)*2);
|
||||
// position: relative;
|
||||
// left: 0;
|
||||
// }
|
||||
|
||||
@media #{$small}{
|
||||
width: 100vw;
|
||||
left: calc(var(--padding-body)*-1);
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
font-size: var(--fs-big);
|
||||
font-weight: normal;
|
||||
text-transform: uppercase;
|
||||
margin: calc(var(--spacing)*2) auto;
|
||||
margin: calc(var(--spacing)*1.5) auto;
|
||||
text-align: center;
|
||||
max-width: var(--max-w-container);
|
||||
|
||||
|
|
|
|||
|
|
@ -332,11 +332,19 @@ button:disabled {
|
|||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.btn--bold svg,
|
||||
.btn--bold-inline svg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
position: relative;
|
||||
top: -1px;
|
||||
}
|
||||
.btn--bold a,
|
||||
.btn--bold-inline a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 1ch;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0 2ch;
|
||||
|
|
@ -347,6 +355,7 @@ button:disabled {
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 1ch;
|
||||
padding: 0 2ch;
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
|
@ -355,6 +364,9 @@ button:disabled {
|
|||
background-color: var(--color-txt);
|
||||
color: var(--color-bg);
|
||||
}
|
||||
.btn--bold svg {
|
||||
fill: var(--color-bg);
|
||||
}
|
||||
.btn--bold:hover {
|
||||
background-color: var(--color-accent);
|
||||
border-color: var(--color-accent);
|
||||
|
|
@ -362,11 +374,16 @@ button:disabled {
|
|||
.btn--bold:hover a {
|
||||
color: var(--color-bg);
|
||||
}
|
||||
.btn--bold:hover svg {
|
||||
fill: var(--color-bg);
|
||||
}
|
||||
|
||||
.btn--bold-inline {
|
||||
background-color: var(--color-bg);
|
||||
}
|
||||
|
||||
.btn--bold-inline svg {
|
||||
fill: var(--color-txt);
|
||||
}
|
||||
.btn--bold-inline:hover {
|
||||
background-color: var(--grey-800);
|
||||
color: var(--color-txt);
|
||||
|
|
@ -531,16 +548,18 @@ button:disabled {
|
|||
}
|
||||
|
||||
#hero {
|
||||
width: calc(100vw - var(--padding-body) * 4);
|
||||
position: relative;
|
||||
left: calc(var(--padding-body) * 1);
|
||||
}
|
||||
@media screen and (max-width: 1080px) {
|
||||
#hero {
|
||||
width: calc(100vw - var(--padding-body) * 2);
|
||||
position: relative;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
#hero .page-title-small {
|
||||
color: var(--color-txt-light);
|
||||
font-size: var(--fs-small);
|
||||
top: calc(var(--spacing) * 0.25);
|
||||
right: calc(var(--spacing) * 0.25);
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
z-index: 200;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
#hero {
|
||||
|
|
@ -954,7 +973,7 @@ button:disabled {
|
|||
font-size: var(--fs-big);
|
||||
font-weight: normal;
|
||||
text-transform: uppercase;
|
||||
margin: calc(var(--spacing) * 2) auto;
|
||||
margin: calc(var(--spacing) * 1.5) auto;
|
||||
text-align: center;
|
||||
max-width: var(--max-w-container);
|
||||
}
|
||||
|
|
@ -1759,7 +1778,8 @@ body main {
|
|||
cursor: pointer;
|
||||
}
|
||||
[data-template=investigation-summary] main #hero {
|
||||
margin: calc(var(--spacing) * 3) 0;
|
||||
margin-top: calc(var(--spacing) * 1);
|
||||
margin-bottom: calc(var(--spacing) * 3);
|
||||
}
|
||||
[data-template=investigation-summary] main .section__article {
|
||||
margin-left: var(--banner-medium);
|
||||
|
|
@ -1791,7 +1811,8 @@ body main {
|
|||
width: calc((100% - var(--max-w-content)) / 2);
|
||||
}
|
||||
[data-template=investigation-summary] main #hero {
|
||||
margin: calc(var(--spacing) * 3) 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: calc(var(--spacing) * 3);
|
||||
}
|
||||
[data-template=investigation-summary] main #hero figcaption {
|
||||
max-width: var(--max-w-content);
|
||||
|
|
@ -1818,11 +1839,6 @@ body main {
|
|||
max-width: calc(var(--max-w-content) + var(--rapport-w));
|
||||
}
|
||||
#rapport .rapport__header {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 140px;
|
||||
-moz-column-gap: calc(var(--spacing) * 1.5);
|
||||
column-gap: calc(var(--spacing) * 1.5);
|
||||
row-gap: calc(var(--spacing) * 2);
|
||||
margin-top: calc(var(--spacing) * 2);
|
||||
max-width: var(--max-w-content);
|
||||
padding-bottom: calc(var(--spacing) * 0.5);
|
||||
|
|
@ -1830,7 +1846,7 @@ body main {
|
|||
#rapport .rapport__header .rapport__title-group {
|
||||
grid-column: span 2;
|
||||
}
|
||||
#rapport .rapport__header .title {
|
||||
#rapport .rapport__header .rapport__title-group .title {
|
||||
text-transform: uppercase;
|
||||
font-weight: normal;
|
||||
font-size: var(--fs-big);
|
||||
|
|
@ -1838,20 +1854,32 @@ body main {
|
|||
font-weight: normal;
|
||||
margin-top: calc(var(--spacing) * 1);
|
||||
}
|
||||
#rapport .rapport__header .subtitle {
|
||||
#rapport .rapport__header .rapport__title-group .subtitle {
|
||||
font-size: var(--fs-big);
|
||||
line-height: var(--leading-tight);
|
||||
margin-top: calc(var(--spacing) * 0.5);
|
||||
font-weight: normal;
|
||||
}
|
||||
#rapport .rapport__header dl {
|
||||
align-self: end;
|
||||
#rapport .rapport__header .rapport__figure {
|
||||
width: 100%;
|
||||
aspect-ratio: 2/1;
|
||||
margin-top: calc(var(--spacing) * 2);
|
||||
}
|
||||
#rapport .rapport__header .rapport__figure img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
-o-object-fit: cover;
|
||||
object-fit: cover;
|
||||
}
|
||||
#rapport .rapport__header .rapport__dl {
|
||||
align-self: start;
|
||||
font-size: var(--fs-small);
|
||||
border-bottom: var(--border-light);
|
||||
flex-grow: 2;
|
||||
align-items: flex-start;
|
||||
margin-top: calc(var(--spacing) * 0.5);
|
||||
}
|
||||
#rapport .rapport__header dl .dl__group {
|
||||
#rapport .rapport__header .rapport__dl .dl__group {
|
||||
display: grid;
|
||||
grid-gap: var(--padding-inner);
|
||||
grid-template-columns: 2fr 3fr;
|
||||
|
|
@ -1859,20 +1887,59 @@ body main {
|
|||
border-top: var(--border-light);
|
||||
padding: calc(var(--spacing) * 0.5) 0;
|
||||
}
|
||||
#rapport .rapport__header dl dt {
|
||||
#rapport .rapport__header .rapport__dl dt {
|
||||
color: var(--color-txt-light);
|
||||
padding-right: 1ch;
|
||||
}
|
||||
#rapport .rapport__header .thumbnail-pdf {
|
||||
width: 140px;
|
||||
}
|
||||
#rapport .rapport__header .thumbnail-pdf figure {
|
||||
border: var(--border-medium);
|
||||
#rapport .rapport__header .thumbnail--group {
|
||||
display: flex;
|
||||
gap: calc(var(--spacing) * 0.5);
|
||||
margin-top: calc(var(--spacing) * 1);
|
||||
}
|
||||
#rapport .rapport__header .thumbnail-pdf .btn--small {
|
||||
#rapport .rapport__header .btn--group {
|
||||
display: flex;
|
||||
gap: calc(var(--spacing) * 0.5);
|
||||
}
|
||||
#rapport .rapport__header .thumbnail {
|
||||
max-width: 260px;
|
||||
display: grid;
|
||||
display: none;
|
||||
grid-template-columns: 2fr 3fr;
|
||||
-moz-column-gap: calc(var(--padding-inner) * 1);
|
||||
column-gap: calc(var(--padding-inner) * 1);
|
||||
padding: calc(var(--padding-inner) * 0.5);
|
||||
border: var(--border-light);
|
||||
}
|
||||
#rapport .rapport__header .thumbnail figure {
|
||||
display: flex;
|
||||
aspect-ratio: 4/3;
|
||||
grid-column: 1;
|
||||
grid-row: 1/3;
|
||||
}
|
||||
#rapport .rapport__header .thumbnail figure img {
|
||||
width: 100%;
|
||||
margin-top: calc(var(--spacing) * 0.25);
|
||||
height: 100%;
|
||||
-o-object-fit: cover;
|
||||
object-fit: cover;
|
||||
}
|
||||
#rapport .rapport__header .thumbnail .thumbnail__title {
|
||||
padding-top: calc(var(--padding-inner) * 0.5);
|
||||
}
|
||||
#rapport .rapport__header .thumbnail .thumbnail__title a {
|
||||
text-decoration: none;
|
||||
}
|
||||
#rapport .rapport__header .thumbnail button {
|
||||
align-self: end;
|
||||
display: flex;
|
||||
align-items: end;
|
||||
justify-content: end;
|
||||
padding-right: calc(var(--padding-inner) * 0.5);
|
||||
padding-bottom: calc(var(--padding-inner) * 0.5);
|
||||
}
|
||||
#rapport .rapport__header .thumbnail button svg {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
fill: var(--color-txt);
|
||||
}
|
||||
#rapport .rapport__content {
|
||||
max-width: var(--max-w-content);
|
||||
|
|
@ -1893,18 +1960,20 @@ body main {
|
|||
#rapport .rapport__content ul {
|
||||
padding-left: 3ch;
|
||||
}
|
||||
#rapport .rapport__content:target {
|
||||
padding-top: calc(var(--header-h) * 2 + var(--spacing)) !important;
|
||||
}
|
||||
|
||||
#rapport__aside {
|
||||
width: var(--rapport-w);
|
||||
position: fixed;
|
||||
top: calc(var(--header-h) + var(--padding-body));
|
||||
left: var(--padding-body);
|
||||
border: var(--border-light);
|
||||
height: calc(100vh - var(--header-h) - var(--padding-body) * 2);
|
||||
height: calc(100vh - var(--header-h) - var(--padding-body) * 4);
|
||||
}
|
||||
#rapport__aside .tabs {
|
||||
display: flex;
|
||||
border-bottom: var(--border-light);
|
||||
border: var(--border-light);
|
||||
height: calc(var(--h-block) * 1.25);
|
||||
}
|
||||
#rapport__aside .tabs .tab {
|
||||
|
|
@ -1929,6 +1998,8 @@ body main {
|
|||
padding: var(--padding-body);
|
||||
height: calc(100% - var(--h-block) * 1.25);
|
||||
overflow: scroll;
|
||||
border: var(--border-light);
|
||||
border-top: none;
|
||||
}
|
||||
#rapport__aside #toc ul {
|
||||
list-style: none;
|
||||
|
|
@ -1941,6 +2012,9 @@ body main {
|
|||
#rapport__aside #toc li.selected {
|
||||
background-color: var(--grey-800);
|
||||
}
|
||||
#rapport__aside #toc li:hover {
|
||||
background-color: var(--grey-800);
|
||||
}
|
||||
#rapport__aside #toc .toc-level-1 {
|
||||
margin-bottom: calc(var(--spacing) * 0.5);
|
||||
font-weight: bold;
|
||||
|
|
@ -1952,6 +2026,10 @@ body main {
|
|||
#rapport__aside #toc a {
|
||||
text-decoration: none;
|
||||
}
|
||||
#rapport__aside #download-pdf {
|
||||
margin: 0 auto;
|
||||
margin-top: calc(var(--spacing) * 0.5);
|
||||
}
|
||||
|
||||
#tab-print, #tab-toc {
|
||||
display: none;
|
||||
|
|
@ -1971,4 +2049,27 @@ body main {
|
|||
|
||||
#tab-toc:checked ~ .content-aside #print-features {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#rapport {
|
||||
--fig-outside: calc(var(--spacing)*2);
|
||||
}
|
||||
#rapport .container-figure {
|
||||
width: calc(100% + var(--fig-outside) * 2);
|
||||
position: relative;
|
||||
left: calc(var(--fig-outside) * -1);
|
||||
}
|
||||
#rapport .fig-simple {
|
||||
height: calc(100vh - var(--header-h) - var(--spacing) * 2);
|
||||
}
|
||||
#rapport .fig-simple figure {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
#rapport .fig-simple figure img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
-o-object-fit: contain;
|
||||
object-fit: contain;
|
||||
}/*# sourceMappingURL=style.css.map */
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -34,6 +34,6 @@
|
|||
|
||||
@import 'template/investigations';
|
||||
@import 'template/investigation-summary';
|
||||
@import 'template/investigation';
|
||||
@import 'template/rapport';
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
[data-template="investigation-summary"] main{
|
||||
|
||||
|
||||
position: relative;
|
||||
|
||||
|
||||
|
|
@ -261,8 +262,8 @@
|
|||
}
|
||||
|
||||
#hero{
|
||||
margin: calc(var(--spacing)*3) 0;
|
||||
|
||||
margin-top: calc(var(--spacing)*1);
|
||||
margin-bottom: calc(var(--spacing)*3);
|
||||
}
|
||||
|
||||
.section__article{
|
||||
|
|
@ -310,7 +311,8 @@
|
|||
}
|
||||
|
||||
#hero{
|
||||
margin: calc(var(--spacing)*3) 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: calc(var(--spacing)*3);
|
||||
figcaption{
|
||||
max-width: var(--max-w-content);
|
||||
margin: 0 auto;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
|
||||
[data-template="investigations"] main{
|
||||
|
||||
|
||||
|
||||
#container-cards{
|
||||
|
||||
@media #{$x-small-up}{
|
||||
|
|
@ -11,6 +13,12 @@
|
|||
grid-auto-rows: minmax(100px, auto);
|
||||
grid-gap: calc(var(--padding-body)*1.5);
|
||||
margin-bottom: 10vh;
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
@media #{$x-small}{
|
||||
margin-bottom: 10vh;
|
||||
|
|
@ -39,4 +47,7 @@
|
|||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,10 +11,10 @@
|
|||
|
||||
.rapport__header{
|
||||
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 140px;
|
||||
column-gap: calc(var(--spacing)*1.5);
|
||||
row-gap: calc(var(--spacing)*2);
|
||||
// display: grid;
|
||||
// grid-template-columns: 1fr 140px;
|
||||
// column-gap: calc(var(--spacing)*1.5);
|
||||
// row-gap: calc(var(--spacing)*2);
|
||||
|
||||
margin-top: calc(var(--spacing)*2);
|
||||
max-width: var(--max-w-content);
|
||||
|
|
@ -23,7 +23,6 @@
|
|||
|
||||
.rapport__title-group{
|
||||
grid-column: span 2;
|
||||
}
|
||||
|
||||
.title{
|
||||
text-transform: uppercase;
|
||||
|
|
@ -42,15 +41,30 @@
|
|||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
dl{
|
||||
align-self: end;
|
||||
|
||||
.rapport__figure{
|
||||
width: 100%;
|
||||
aspect-ratio: 2/1;
|
||||
margin-top: calc(var(--spacing)*2);
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.rapport__dl{
|
||||
align-self: start;
|
||||
font-size: var(--fs-small);
|
||||
border-bottom: var(--border-light);
|
||||
flex-grow: 2;
|
||||
align-items: flex-start;
|
||||
margin-top: calc(var(--spacing)*0.5);
|
||||
.dl__group{
|
||||
@include grid-content();
|
||||
border-top: var(--border-light);
|
||||
|
|
@ -63,16 +77,61 @@
|
|||
}
|
||||
}
|
||||
|
||||
.thumbnail-pdf{
|
||||
width: 140px;
|
||||
figure{
|
||||
border: var(--border-medium);
|
||||
|
||||
.thumbnail--group{
|
||||
display: flex;
|
||||
gap: calc(var(--spacing)*0.5);
|
||||
margin-top: calc(var(--spacing)*1);
|
||||
}
|
||||
|
||||
.btn--small{
|
||||
|
||||
|
||||
.btn--group{
|
||||
display: flex;
|
||||
gap: calc(var(--spacing)*0.5);
|
||||
}
|
||||
|
||||
.thumbnail{
|
||||
max-width: 260px;
|
||||
display: grid;
|
||||
display: none;
|
||||
grid-template-columns: 2fr 3fr;
|
||||
column-gap: calc(var(--padding-inner)*1);
|
||||
padding: calc(var(--padding-inner)*0.5);
|
||||
border: var(--border-light);
|
||||
figure{
|
||||
display: flex;
|
||||
aspect-ratio: 4/3;
|
||||
grid-column: 1;
|
||||
grid-row: 1/3;
|
||||
img{
|
||||
width: 100%;
|
||||
margin-top: calc(var(--spacing)*0.25);
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
|
||||
.thumbnail__title{
|
||||
padding-top: calc(var(--padding-inner)*0.5);
|
||||
a{
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
button{
|
||||
align-self: end;
|
||||
display: flex;
|
||||
align-items: end;
|
||||
justify-content: end;
|
||||
padding-right: calc(var(--padding-inner)*0.5);
|
||||
padding-bottom: calc(var(--padding-inner)*0.5);
|
||||
}
|
||||
|
||||
|
||||
button svg{
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
fill: var(--color-txt);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -109,6 +168,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
.rapport__content:target{
|
||||
padding-top: calc(var(--header-h)*2 + var(--spacing))!important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -125,13 +188,13 @@
|
|||
position: fixed;
|
||||
top: calc(var(--header-h) + var(--padding-body));
|
||||
left: var(--padding-body);
|
||||
border: var(--border-light);
|
||||
|
||||
// border-radius: var(--radius-small);
|
||||
height: calc(100vh - var(--header-h) - var(--padding-body)*2);
|
||||
height: calc(100vh - var(--header-h) - var(--padding-body)*4);
|
||||
|
||||
.tabs{
|
||||
display: flex;
|
||||
border-bottom: var(--border-light);
|
||||
border: var(--border-light);
|
||||
height: calc(var(--h-block)*1.25);
|
||||
|
||||
.tab{
|
||||
|
|
@ -162,6 +225,8 @@
|
|||
padding: var(--padding-body);
|
||||
height: calc(100% - var(--h-block)*1.25);
|
||||
overflow: scroll;
|
||||
border: var(--border-light);
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -181,6 +246,10 @@
|
|||
background-color: var(--grey-800);
|
||||
}
|
||||
|
||||
li:hover{
|
||||
background-color: var(--grey-800);
|
||||
}
|
||||
|
||||
.toc-level-1{
|
||||
margin-bottom: calc(var(--spacing)*0.5);
|
||||
font-weight: bold;
|
||||
|
|
@ -194,6 +263,11 @@
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
#download-pdf{
|
||||
margin: 0 auto;
|
||||
margin-top: calc(var(--spacing)*0.5);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -204,3 +278,30 @@
|
|||
|
||||
#tab-toc:checked ~ .content-aside #toc{ display: block; }
|
||||
#tab-toc:checked ~ .content-aside #print-features{ display: none; }
|
||||
|
||||
|
||||
|
||||
|
||||
#rapport{
|
||||
--fig-outside: calc(var(--spacing)*2);
|
||||
.container-figure{
|
||||
width: calc(100% + var(--fig-outside)*2);
|
||||
position: relative;
|
||||
left: calc(var(--fig-outside)*-1);
|
||||
}
|
||||
.fig-simple{
|
||||
height: calc(100vh - var(--header-h) - var(--spacing)*2);
|
||||
|
||||
figure{
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
56
assets/icons/pdf.svg
Normal file
56
assets/icons/pdf.svg
Normal file
|
|
@ -0,0 +1,56 @@
|
|||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
width="550.801px" height="550.801px" viewBox="0 0 550.801 550.801" style="enable-background:new 0 0 550.801 550.801;"
|
||||
xml:space="preserve">
|
||||
<g>
|
||||
<path d="M160.381,282.225c0-14.832-10.299-23.684-28.474-23.684c-7.414,0-12.437,0.715-15.071,1.432V307.6
|
||||
c3.114,0.707,6.942,0.949,12.192,0.949C148.419,308.549,160.381,298.74,160.381,282.225z"/>
|
||||
<path d="M272.875,259.019c-8.145,0-13.397,0.717-16.519,1.435v105.523c3.116,0.729,8.142,0.729,12.69,0.729
|
||||
c33.017,0.231,54.554-17.946,54.554-56.474C323.842,276.719,304.215,259.019,272.875,259.019z"/>
|
||||
<path d="M488.426,197.019H475.2v-63.816c0-0.398-0.063-0.799-0.116-1.202c-0.021-2.534-0.827-5.023-2.562-6.995L366.325,3.694
|
||||
c-0.032-0.031-0.063-0.042-0.085-0.076c-0.633-0.707-1.371-1.295-2.151-1.804c-0.231-0.155-0.464-0.285-0.706-0.419
|
||||
c-0.676-0.369-1.393-0.675-2.131-0.896c-0.2-0.056-0.38-0.138-0.58-0.19C359.87,0.119,359.037,0,358.193,0H97.2
|
||||
c-11.918,0-21.6,9.693-21.6,21.601v175.413H62.377c-17.049,0-30.873,13.818-30.873,30.873v160.545
|
||||
c0,17.043,13.824,30.87,30.873,30.87h13.224V529.2c0,11.907,9.682,21.601,21.6,21.601h356.4c11.907,0,21.6-9.693,21.6-21.601
|
||||
V419.302h13.226c17.044,0,30.871-13.827,30.871-30.87v-160.54C519.297,210.838,505.47,197.019,488.426,197.019z M97.2,21.605
|
||||
h250.193v110.513c0,5.967,4.841,10.8,10.8,10.8h95.407v54.108H97.2V21.605z M362.359,309.023c0,30.876-11.243,52.165-26.82,65.333
|
||||
c-16.971,14.117-42.82,20.814-74.396,20.814c-18.9,0-32.297-1.197-41.401-2.389V234.365c13.399-2.149,30.878-3.346,49.304-3.346
|
||||
c30.612,0,50.478,5.508,66.039,17.226C351.828,260.69,362.359,280.547,362.359,309.023z M80.7,393.499V234.365
|
||||
c11.241-1.904,27.042-3.346,49.296-3.346c22.491,0,38.527,4.308,49.291,12.928c10.292,8.131,17.215,21.534,17.215,37.328
|
||||
c0,15.799-5.25,29.198-14.829,38.285c-12.442,11.728-30.865,16.996-52.407,16.996c-4.778,0-9.1-0.243-12.435-0.723v57.67H80.7
|
||||
V393.499z M453.601,523.353H97.2V419.302h356.4V523.353z M484.898,262.127h-61.989v36.851h57.913v29.674h-57.913v64.848h-36.593
|
||||
V232.216h98.582V262.127z"/>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.5 KiB |
BIN
assets/images/adam-raihane/fig-1-a.png
Normal file
BIN
assets/images/adam-raihane/fig-1-a.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
BIN
assets/images/adam-raihane/fig-1-b.png
Normal file
BIN
assets/images/adam-raihane/fig-1-b.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 910 KiB |
BIN
assets/images/adam-raihane/fig-2.png
Normal file
BIN
assets/images/adam-raihane/fig-2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 706 KiB |
BIN
assets/images/adam-raihane/fig-3.png
Normal file
BIN
assets/images/adam-raihane/fig-3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 695 KiB |
|
|
@ -14,9 +14,11 @@ export function headerScrollVisibility() {
|
|||
const header = document.getElementById("site-header");
|
||||
const hero = document.getElementById("hero");
|
||||
|
||||
if (!header || !hero) return;
|
||||
if (!header) return;
|
||||
|
||||
function checkScroll() {
|
||||
if (hero) {
|
||||
// Comportement avec hero
|
||||
const headerHeight = parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--header-h')) || 0;
|
||||
const heroBottom = hero.getBoundingClientRect().bottom;
|
||||
|
||||
|
|
@ -25,6 +27,14 @@ export function headerScrollVisibility() {
|
|||
} else {
|
||||
header.classList.remove("is-visible");
|
||||
}
|
||||
} else {
|
||||
// Comportement sans hero \
|
||||
if (window.scrollY >= 300) {
|
||||
header.classList.add("is-visible");
|
||||
} else {
|
||||
header.classList.remove("is-visible");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
window.addEventListener("scroll", checkScroll);
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
|
||||
<nav id="nav-highlight">
|
||||
<ul>
|
||||
<li><a href="#">Enquêtes</a></li>
|
||||
<li><a href="/enquetes">Enquêtes</a></li>
|
||||
<li><a href="#">Impact</a></li>
|
||||
<li class="soutenir"><a targer="_blank" href="https://soutenir.index.ngo/">Soutenez-nous</a></li>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -1,11 +1,6 @@
|
|||
<?php snippet('header') ?>
|
||||
|
||||
|
||||
<header>
|
||||
<p class="tag-inline">Enquête</p>
|
||||
<h2 class="page-title">L’exécution de Nidal et Khaled ‘Amirah à Naplouse</h2>
|
||||
<p class="date-publish"></p>
|
||||
</header>
|
||||
|
||||
|
||||
|
||||
|
|
@ -54,6 +49,9 @@
|
|||
<!-- HERO VIDEO ------------------------------ -->
|
||||
<div id="hero" class="hero-video">
|
||||
|
||||
<p class="page-title-small">L’exécution de Nidal et Khaled ‘Amirah à Naplouse</p>
|
||||
|
||||
|
||||
<div class="player-container">
|
||||
|
||||
<div class="extract">
|
||||
|
|
@ -75,6 +73,13 @@
|
|||
|
||||
|
||||
|
||||
<header>
|
||||
<p class="tag-inline">Enquête</p>
|
||||
<h2 class="page-title">L’exécution de Nidal et Khaled ‘Amirah à Naplouse</h2>
|
||||
<p class="date-publish"></p>
|
||||
</header>
|
||||
|
||||
|
||||
<div id="banner--page">
|
||||
<nav id="nav--page">
|
||||
<ul>
|
||||
|
|
|
|||
|
|
@ -16,8 +16,8 @@
|
|||
|
||||
<nav id="toc">
|
||||
<ul>
|
||||
<li class="toc-level-1"><a href="#auteurs">Les auteurs de ce rapport</a></li>
|
||||
<li class="toc-level-1 selected"><a href="#rappel-faits">Rappel des faits</a></li>
|
||||
<li class="toc-level-1 selected"><a href="#auteurs">Les auteurs de ce rapport</a></li>
|
||||
<li class="toc-level-1"><a href="#rappel-faits">Rappel des faits</a></li>
|
||||
<li class="toc-level-1"><a href="#ordre-mission">Ordre de mission</a></li>
|
||||
<li class="toc-level-1"><a href="#sources">1. Sources et documentation visuelle disponible</a></li>
|
||||
<li class="toc-level-1"><a href="#reconstitution">2. Reconstitution générale</a></li>
|
||||
|
|
@ -39,6 +39,13 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<button id="download-pdf" class="btn--bold">
|
||||
<a href="#">
|
||||
<span class="icon"><?= svg('assets/icons/pdf.svg') ?></span>
|
||||
<span class="text">Télégarcher le PDF</span>
|
||||
</a>
|
||||
</button>
|
||||
</aside>
|
||||
|
||||
|
||||
|
|
@ -52,8 +59,9 @@
|
|||
</div>
|
||||
|
||||
|
||||
<figure class="rapport__figure"><img src="/assets/images/image-rapport.png"></figure>
|
||||
|
||||
<dl>
|
||||
<dl class="rapport__dl">
|
||||
<div class="dl__group">
|
||||
<dt>Auteurs du rapport</dt>
|
||||
<dd>INDEX Investigation</dd>
|
||||
|
|
@ -62,13 +70,45 @@
|
|||
<dt>Date du rapport</dt>
|
||||
<dd><time datetime="2025-06-10">10 juin 2025</time></dd>
|
||||
</div>
|
||||
|
||||
</dl>
|
||||
|
||||
|
||||
<div class="thumbnail-pdf">
|
||||
<div class="thumbnail--group">
|
||||
<div class="thumbnail thumbnail-pdf">
|
||||
<figure><img src="/assets/images/cover-rapport.png"></figure>
|
||||
<button class="btn--small"><a href="#">Télégarcher le PDF</a></button>
|
||||
<p class="thumbnail__title"><a href="#">Télégarcher le PDF</a></p>
|
||||
<button><?= svg('assets/icons/arrow-left.svg') ?></button>
|
||||
<a class="link-block" href="#"></a>
|
||||
</div>
|
||||
<div class="thumbnail thumbnail-summary">
|
||||
<figure><img src="/assets/images/Nidal-Khaled-Amirah.png"></figure>
|
||||
<p class="thumbnail__title"><a href="#">Voir la synthèse</a></p>
|
||||
<button><?= svg('assets/icons/arrow-left.svg') ?></button>
|
||||
<a class="link-block" href="/enquetes/l-execution-de-nidal-et-khaled-amirah-a-naplouse"></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="btn--group">
|
||||
<button class="btn--bold-inline btn--light">
|
||||
<a href="#">
|
||||
<span class="icon"><?= svg('assets/icons/pdf.svg') ?></span>
|
||||
<span class="text">Télégarcher le PDF</span>
|
||||
</a>
|
||||
</button>
|
||||
|
||||
<button class="btn--bold-inline btn--light">
|
||||
<a href="/enquetes/l-execution-de-nidal-et-khaled-amirah-a-naplouse">
|
||||
<span class="icon"><?= svg('assets/icons/play.svg') ?></span>
|
||||
<span class="text">Voir la synthèse</span>
|
||||
</a>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</header>
|
||||
|
||||
|
||||
|
|
@ -77,7 +117,7 @@
|
|||
|
||||
<div class="rapport__content">
|
||||
|
||||
<div class="section-content">
|
||||
<div class="section-content" id="auteurs">
|
||||
<h3 class="section-title">Les auteurs de ce rapport</h3>
|
||||
|
||||
|
||||
|
|
@ -108,27 +148,132 @@ du présent rapport sont : </p>
|
|||
<h3 class="section-title">Rappel des faits</h3>
|
||||
<p>
|
||||
Le 19 août 2017, vers 17h, M. Luis Manuel BICO, 48 ans, a été tué
|
||||
lors d'une intervention policière à Châlette-sur-Loing.
|
||||
</p>
|
||||
<p>
|
||||
Atteint de schizophrénie dysthymique et suivi pour des troubles
|
||||
bipolaires depuis l’âge de 20 ans, M. BICO a menacé une personne
|
||||
avec un couteau le 19 août 2017, déclenchant une alerte auprès
|
||||
des forces de l’ordre. Localisé au 3 rue Maurice Ravel à Châlettesur-
|
||||
Loing, M. BICO, dans un état d’agitation extrême et tenant des
|
||||
propos incohérents, s'était enfermé dans son véhicule, exhibant un
|
||||
couteau. Deux équipages de police, soit sept agents, sont intervenus.
|
||||
Face à son refus de se rendre, les policiers ont tenté de le maîtriser
|
||||
en usant de gaz lacrymogène et en tentant de briser le pare-brise
|
||||
de son véhicule avec leurs bâtons. M. BICO, au volant, a reculé à
|
||||
plusieurs reprises, percutant un véhicule de police. Lorsqu'un agent a
|
||||
déplacé un second véhicule de police qui obstruait la voie située sur
|
||||
sa gauche, M. BICO a redémarré en tentant de fuir. À ce moment, trois
|
||||
policiers ont ouvert le feu, tirant 18 fois sur le véhicule. M. BICO a été
|
||||
mortellement atteint par deux projectiles et son décès a été constaté
|
||||
sur place. L'incident a été observé par plusieurs témoins et filmé sous
|
||||
divers angles.
|
||||
</p>
|
||||
lors d'une intervention policière à Châlette-sur-Loing.
|
||||
</p>
|
||||
<p>
|
||||
Atteint de schizophrénie dysthymique et suivi pour des troubles
|
||||
bipolaires depuis l’âge de 20 ans, M. BICO a menacé une personne
|
||||
avec un couteau le 19 août 2017, déclenchant une alerte auprès
|
||||
des forces de l’ordre. Localisé au 3 rue Maurice Ravel à Châlettesur-
|
||||
Loing, M. BICO, dans un état d’agitation extrême et tenant des
|
||||
propos incohérents, s'était enfermé dans son véhicule, exhibant un
|
||||
couteau. Deux équipages de police, soit sept agents, sont intervenus.
|
||||
Face à son refus de se rendre, les policiers ont tenté de le maîtriser
|
||||
en usant de gaz lacrymogène et en tentant de briser le pare-brise
|
||||
de son véhicule avec leurs bâtons. M. BICO, au volant, a reculé à
|
||||
plusieurs reprises, percutant un véhicule de police. Lorsqu'un agent a
|
||||
déplacé un second véhicule de police qui obstruait la voie située sur
|
||||
sa gauche, M. BICO a redémarré en tentant de fuir. À ce moment, trois
|
||||
policiers ont ouvert le feu, tirant 18 fois sur le véhicule. M. BICO a été
|
||||
mortellement atteint par deux projectiles et son décès a été constaté
|
||||
sur place. L'incident a été observé par plusieurs témoins et filmé sous
|
||||
divers angles.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="section-content" id="rappel-faits">
|
||||
<h3 class="section-title">MODÉLISATION NUMÉRIQUE EN 3D DES LIEUX DE L’INCIDENT</h3>
|
||||
|
||||
<p>
|
||||
Les faits examinés dans ce rapport se sont déroulés sur le parking du
|
||||
centre commercial Carrefour situé au 136 boulevard Irène Joliot-Curie
|
||||
à Vénissieux (69), dans la proche banlieue de Lyon. Nous avons procédé
|
||||
à une modélisation numérique en 3D dudit parking et des bâtiments qui
|
||||
l’entourent.</p>
|
||||
|
||||
|
||||
<div class="container-figure fig-simple">
|
||||
<figure><img src="/assets/images/adam-raihane/fig-1-a.png"></figure>
|
||||
<!-- <figure><img src="/assets/images/adam-raihane/fig-1-b.png"></figure> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="section-content">
|
||||
<h3 class="section-title">Rappel des faits</h3>
|
||||
<p>
|
||||
Le 19 août 2017, vers 17h, M. Luis Manuel BICO, 48 ans, a été tué
|
||||
lors d'une intervention policière à Châlette-sur-Loing.
|
||||
</p>
|
||||
<p>
|
||||
Atteint de schizophrénie dysthymique et suivi pour des troubles
|
||||
bipolaires depuis l’âge de 20 ans, M. BICO a menacé une personne
|
||||
avec un couteau le 19 août 2017, déclenchant une alerte auprès
|
||||
des forces de l’ordre. Localisé au 3 rue Maurice Ravel à Châlettesur-
|
||||
Loing, M. BICO, dans un état d’agitation extrême et tenant des
|
||||
propos incohérents, s'était enfermé dans son véhicule, exhibant un
|
||||
couteau. Deux équipages de police, soit sept agents, sont intervenus.
|
||||
Face à son refus de se rendre, les policiers ont tenté de le maîtriser
|
||||
en usant de gaz lacrymogène et en tentant de briser le pare-brise
|
||||
de son véhicule avec leurs bâtons. M. BICO, au volant, a reculé à
|
||||
plusieurs reprises, percutant un véhicule de police. Lorsqu'un agent a
|
||||
déplacé un second véhicule de police qui obstruait la voie située sur
|
||||
sa gauche, M. BICO a redémarré en tentant de fuir. À ce moment, trois
|
||||
policiers ont ouvert le feu, tirant 18 fois sur le véhicule. M. BICO a été
|
||||
mortellement atteint par deux projectiles et son décès a été constaté
|
||||
sur place. L'incident a été observé par plusieurs témoins et filmé sous
|
||||
divers angles.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="section-content">
|
||||
<h3 class="section-title">Rappel des faits</h3>
|
||||
<p>
|
||||
Le 19 août 2017, vers 17h, M. Luis Manuel BICO, 48 ans, a été tué
|
||||
lors d'une intervention policière à Châlette-sur-Loing.
|
||||
</p>
|
||||
<p>
|
||||
Atteint de schizophrénie dysthymique et suivi pour des troubles
|
||||
bipolaires depuis l’âge de 20 ans, M. BICO a menacé une personne
|
||||
avec un couteau le 19 août 2017, déclenchant une alerte auprès
|
||||
des forces de l’ordre. Localisé au 3 rue Maurice Ravel à Châlettesur-
|
||||
Loing, M. BICO, dans un état d’agitation extrême et tenant des
|
||||
propos incohérents, s'était enfermé dans son véhicule, exhibant un
|
||||
couteau. Deux équipages de police, soit sept agents, sont intervenus.
|
||||
Face à son refus de se rendre, les policiers ont tenté de le maîtriser
|
||||
en usant de gaz lacrymogène et en tentant de briser le pare-brise
|
||||
de son véhicule avec leurs bâtons. M. BICO, au volant, a reculé à
|
||||
plusieurs reprises, percutant un véhicule de police. Lorsqu'un agent a
|
||||
déplacé un second véhicule de police qui obstruait la voie située sur
|
||||
sa gauche, M. BICO a redémarré en tentant de fuir. À ce moment, trois
|
||||
policiers ont ouvert le feu, tirant 18 fois sur le véhicule. M. BICO a été
|
||||
mortellement atteint par deux projectiles et son décès a été constaté
|
||||
sur place. L'incident a été observé par plusieurs témoins et filmé sous
|
||||
divers angles.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="section-content">
|
||||
<h3 class="section-title">Rappel des faits</h3>
|
||||
<p>
|
||||
Le 19 août 2017, vers 17h, M. Luis Manuel BICO, 48 ans, a été tué
|
||||
lors d'une intervention policière à Châlette-sur-Loing.
|
||||
</p>
|
||||
<p>
|
||||
Atteint de schizophrénie dysthymique et suivi pour des troubles
|
||||
bipolaires depuis l’âge de 20 ans, M. BICO a menacé une personne
|
||||
avec un couteau le 19 août 2017, déclenchant une alerte auprès
|
||||
des forces de l’ordre. Localisé au 3 rue Maurice Ravel à Châlettesur-
|
||||
Loing, M. BICO, dans un état d’agitation extrême et tenant des
|
||||
propos incohérents, s'était enfermé dans son véhicule, exhibant un
|
||||
couteau. Deux équipages de police, soit sept agents, sont intervenus.
|
||||
Face à son refus de se rendre, les policiers ont tenté de le maîtriser
|
||||
en usant de gaz lacrymogène et en tentant de briser le pare-brise
|
||||
de son véhicule avec leurs bâtons. M. BICO, au volant, a reculé à
|
||||
plusieurs reprises, percutant un véhicule de police. Lorsqu'un agent a
|
||||
déplacé un second véhicule de police qui obstruait la voie située sur
|
||||
sa gauche, M. BICO a redémarré en tentant de fuir. À ce moment, trois
|
||||
policiers ont ouvert le feu, tirant 18 fois sur le véhicule. M. BICO a été
|
||||
mortellement atteint par deux projectiles et son décès a été constaté
|
||||
sur place. L'incident a été observé par plusieurs témoins et filmé sous
|
||||
divers angles.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</article>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue